Contributor Guide - PDF document

1 Mura CMS 2019 Contributor
Mura CMS 2019 Contributor Guide February 2019 Draft THECB Mura Contributor Guide 1 February 2019 D raft Contents Basic Concepts ................................ ................................ ................................ ................................ .............. 3 Logging In ................................ ................................ ................................ ................................ .................. 3 Log In From Back - End Administration View ................................ ................................ .......................... 3 Log In From the Front - End Public View ................................ ................................ ................................ . 4 Logging Out ................................ ................................ ................................ ................................ ............... 4 Log Out From Back - End Administration View ................................ ..........

2 ...................... .................
...................... ....................... 4 Log Out From Front - End Public View ................................ ................................ ................................ .... 5 Front - End Editing ................................ ................................ ................................ ................................ ...... 5 Inline Edit ................................ ................................ ................................ ................................ .............. 5 Full Edi t ................................ ................................ ................................ ................................ .................. 7 Back - End Editing ................................ ................................ ................................ ................................ ....... 9 Basic Publishing ................................ ................................ ................................ ................................ ....... 11 Save Draft

3 ................................ ....
................................ ................................ ................................ ................................ ............ 11 Preview ................................ ................................ ................................ ................................ ............... 11 Save to Change Set* ................................ ................................ ................................ ............................ 11 Publish* ................................ ................................ ................................ ................................ ............... 11 Basic Content ................................ ................................ ................................ ................................ .............. 12 Content Types ................................ ................................ ................................ ................................ ......... 12 Page ................................ .............................

4 ... ................................ ...
... ................................ ................................ ..................... 12 Link ................................ ................................ ................................ ................................ ...................... 12 File ................................ ................................ ................................ ................................ ....................... 12 Folder ................................ ................................ ................................ ................................ .................. 12 Calendar ................................ ................................ ................................ ................................ .............. 13 Quick Upload ................................ ................................ ................................ ................................ ...... 13 Custom Content Types ................................ ................................ ...........................

5 ..... ....................... 13 Adm
..... ....................... 13 Admin Content View ................................ ................................ ................................ ............................... 13 Content Tree View ................................ ................................ ................................ .............................. 14 Content List View ................................ ................................ ................................ ................................ 16 Basic Tab ................................ ................................ ................................ ................................ ................. 17 Mura Contributor Guide 2 February 2019 D raft Content Formatting ................................ ................................ ................................ ................................ 22 The Toolbar ................................ ................................ ................................ .............................

6 ... ......... 22 Using the Toolbar
... ......... 22 Using the Toolbar ................................ ................................ ................................ ................................ 23 Collapsing and Restoring the Toolbar ................................ ................................ ................................ . 23 Uploading Images and Files ................................ ................................ ................................ ................ 24 How to Create a Photo Gallery ................................ ................................ ................................ ............... 24 Mura Contributor Guide 3 February 2019 D raft Basic Concepts In this section, you'll learn many of the basic concepts of Mura CMS. Fo r example, how to log in, edit content, and learn about the different types of content you can create with Mura. Logging In There are a few of different ways to log in to Mura CMS as a content manager or administrator. The method you choose will de

7 pend pri marily on what you a re tryin
pend pri marily on what you a re trying to do, as you will see in the next steps. Log In From Back - End Administration View 1. Go to your primary domain/URL and add "/admin/" to it. For example, http://www.yourdomain.com/admin/ 2. If you're not already logged in, you shoul d be prompted with a "Login" screen 3. Enter your Username and Password, then click the Login button Mura Contributor Guide 4 February 2019 D raft 4. Once logged in, you should be taken to the Content view Log In From t he Front - End Public View 1. Go to your primary domain/URL, and navigate to the page you wish to edit 2. Now, press the Escape key and the lower case letter L (e.g., -20;SC+l) 3. You see a "Please Log In" screen. Once logged in, you should now see the Front - End Toolbar appear at the top of the browser viewport, as highlighted below. Logging Out Th ere are a few different ways to log out of Mura CMS. The method you choose will depend on where you are at wh

8 ile logged in to Mura. Log Out From Ba
ile logged in to Mura. Log Out From Back - End Administration View 1. Look to the top right part of your browser window, and on the right of your name, click the down arrow, then select "Log Out . " You should see the "Login" screen. Mura Contributor Guide 5 February 2019 D raft Log Out From Front - End Public View 1. On the Front - End Toolbar, look to the far right and locate the "Log Out" link. 2. If you see the Mura logo at the top of your browser, but c annot see the Front - End Toolbar, simply click the Mura logo to toggle the visibility of the toolbar. 3. Click the "Log Out" link. Front - End Editing With Mura CMS, most content managers tend to make content edits using the front - end editing options listed belo w. Inline Edit Inline editing is useful for content managers who wish to see how their content will appear in context to the rest of the page. As you will see in another section, you can also add various display objects to different display regions using

9 i nline editing. For basic inline editin
i nline editing. For basic inline editing, follow the steps below. 1. From the Front - End Toolbar, hover over the pencil icon, and select "inline edit . " Mura Contributor Guide 6 February 2019 D raft 2. While in "inline edit" mode, a utility panel will open on the right hand side of your browser window. The utility panel contains several types of display objects that you can add to the various display regions throughout the page. 3. As you move your mouse around the browser window, the "Body" and other editable display regions will highlight. For example, if y ou hover over the "Body" region, a label will appear around it. 4. If you double - click inside the "Body" region, the utility panel will change to "Editing Content" and a content formatting toolbar will appear above the content region where you can make a ch ange and apply any desired formatting. Mura Contributor Guide 7 February 2019 D raft 5. When finished making your content change(s),

10 move your mouse to the Front - End Toolb
move your mouse to the Front - End Toolbar, hover over "Save" and select your desired publishing option (e.g., "Publish"). Please note that "Publish" will only appear for g roups that have "Editor" privileges. Full Edit When you need to edit something more than basic content and display objects, you will need to use "full edit" mode. In full edit mode, you have complete control over a vast number of attributes and options t hat will be discussed in future sections. However, let us at least get familiar with how to make a simple content edit in "full edit" mode. 1. From the Front - End Toolbar, hover over the pencil icon, and select "full edit . " 2. The "Edit Content" modal window wi ll appear. Mura Contributor Guide 8 February 2019 D raft 3. You will see that it contains a number of tabs, which are display across the top of the window. However, if you scroll down, you should be able to locate the "Content" region and a familiar formatting toolbar. 4. From this windo

11 w, you can simpl y click inside of it, m
w, you can simpl y click inside of it, make your change(s) , and apply your desired formatting. When you are done, you can select your desired publishing option (e.g., "Publish"). Please note that "Publish" will only appear for groups that have "Editor" privileges. Mura Contributor Guide 9 February 2019 D raft Back - End Editing While most content managers tend to make the majority of their content edits using one of the front - end editing options, content you can edit from t he back - end administration area. There are a couple of different ways to get to the back - end administration area. If logged into the front - end public view of your site, you can simply click the "tree view" icon on the Front - End Toolbar, and you will see a "zoomed - in" tree view of your content. Otherwise, you can access the back - end administration area by adding "/admin" to your domain name. For example, http://www.yourdomain.com/admin, and then log in. Once you have accessed the back -

12 end administrator are a, go to the "Con
end administrator are a, go to the "Content" view. Using either the "Tree View" or "List View" locate the content item you wish to edit, and select it. Mura Contributor Guide 10 February 2019 D raft Now, you should see a familiar "Edit Content" screen. This is pretty much the same screen that you have seen before when u sing the "full edit" mode to edit content on the front - end public view. However, there are a few additional features, information, and options available from this view such as when the content item was last updated, it's "status" a nd a list of available "A ctions . ” From here, simply make your content edit(s) and select your desired publishing option just as you did before on the front - end. Mura Contributor Guide 11 February 2019 D raft Basic Publ i shing Content managers have a number of publishing options with Mura CMS. We have listed an overview of s ome of the various options below. T hese are p ublishing options in "full edit" mode

13 and p ublishing options in "inline ed
and p ublishing options in "inline edit" mode . Save Draft "Save Draft" allows you to save a temporary, non - published version of content for later editing or approval. Draf t versions are available for review by the user who created the item, or any site administrators Preview "Preview" does the same thing as "Save Draft" and then displays what th e content would look like if published on the front - end view. If using "Preview" from the back end administration area, it will attempt to launch a new window. Save to Change Set* "Save to Change Set" saves a version of the content in the desired "change set." A "Change Set" is like a virtual bucket where you can store any changes you want to make "live" at the same time. Publish* "Publish" makes the content "live" and visible to the front - end public view of your site. The content item's status will become "Published." This action will also remove any "Draft" versions of the content item. *Note: "Save to Change Set" and "Publish" options

14 will only appear for groups that have "E
will only appear for groups that have "Editor" roles. They will not appear for groups with "Author" roles. Mura Contributor Guide 12 February 2019 D raft Basic Content In this section, we'll review Mura's content types and get to know the basics o f creating/managing content. Content Types In Mura CMS, it's important to understand that there are different types of content. For example, sometimes you may want to create a traditional "page" of content, where there's a body area of text and images. Oth er times, you may want to add a "file" such as a PDF document, image file , or a link to another website. One very important distinction here is that each content type has several attributes and features such as the ability to use categories, tags, and cont rol whether or not the item will display or not, or even restrict access to the information to specific group(s). Please take a moment and review each of the basic content types listed below. Page Page content types are the website pages

15 of your site. These are the most commonl
of your site. These are the most commonly used content types containing text, images, and links. Link Link content types are simply URL links. They can be used to link to another section of your existing website, or to external websites. File File content types are specifically any kind of file type that the system administrator has allowed Mura CMS to manage. File icons are used to denote most of the common file types such PDF, Word, Excel, Zip, and many others. Folder Folder content types allow you to aggregate related content into a defined group. Folders are most often used for sections of the site that may contain "news" or "blog" type content. For example, folders typically display the "title" and "summary" fields of each content item that lives directly beneath it, and pagination occurs automatically. Folders are also configurable to display several other fields such as the content release date , categories, tags, how many items to display per page, and more. The folder’s “body” area w

16 ill appear above the listing of content
ill appear above the listing of content that lives beneath it. Mura Contributor Guide 13 February 2019 D raft Cal endar Calendar content types allow you to display scheduled content in a traditional calendar format. Content placed directly under a "calendar" is scheduled by its "schedule" and has a number of configurable options such as whether or not the item should repeat, the frequency of when it should display, and more. Quick Upload Quick Upload is not a content type. Rather, it's a way to upload multiple files, such as images and/or documents, all at once instead of having to upload each item individually. This is very useful when you wish to create a gallery of images, or even a library of documents. Custom Content Types Custom Content Types may also be created by your website development team in order to accommodate unique data specific to your organizations requirements or needs. For example, maybe yo ur organization hosts a large number of YouTube videos. In that case, a develo

17 per might use "class extensions" to c
per might use "class extensions" to create a special content type called "YouTube" which collects the URL to the video, and other important information about that video. Then, us ing custom code in your theme or via a plugin, the content may be displayed in a special way on the front end of your site. Admin Content View There are many things you can do on the back - end administration view of Mura CMS that you cannot do on the front - end public view. Here, we'll explore the "Content" area of the "Admin View" and learn how to find content we might be looking for to edit. Mura Contributor Guide 14 February 2019 D raft Content Tree View The "Tree View" is the default "Content" view in Mura CMS. The default Tree View button option i s "Site" and is described in this section; the two other button options under Tree View (" Components " and " Forms ") are described elsewhere. From here, you can see all of the content in a hierarchical view, with the "Home" page being the topmost content item.

18 We'll discuss managing navigation
We'll discuss managing navigation menus in another section. However, it's important to note that each row in the list of content is listed in the order it will appear in the navigation on the front - end public view of the site. So, all of the top level navigation, or the "Home" page, and it's immediate children will appear in the primary navigation of your site by default. You have several options for interacting with each row of content listed here. One option is clicking the vertical three dots on the far left of each row to reveal a menu of options. Mura Contributor Guide 15 February 2019 D raft  Zoom: When a content item has children, selecting "Zoom" will drill into that section of the site. This often makes it easier to manage a specific section, or sub - section of a site witho ut the clutter of viewing all of the siblings of a content item. You can keep track of where you are in context to the "Home" page by using the breadcrumbs found directly above the listing of content

19 items.  Edit: Select this op
items.  Edit: Select this option to go to the "Edit Con tent" screen.  Add Content: Select this option to add a child content item.  Copy: Select this option to copy the specific content item into memory. When you select this option, you can click the vertical three dots and a "Paste" option will appear so that you can paste the copied item.  Copy All: Similar to "Copy" except it copies both the selected item, and all of its children.  View: Launches a new browser window to see what the selected content item looks like on the front - end public view of your site.  Ver sion History: Selecting this option will take you to the " Version History " screen where you can perform actions such as comparing versions, an d edit old versions to re - publish them.  Permissions: Selecting this option will take you to the " Permissions " screen for the specified content item so that you can control who has "Editor" and "Author" permissions, or even explicitly deny a gro

20 up access to content. 0 Mura
up access to content. 0 Mura Contributor Guide 16 February 2019 D raft Content List View By default, the Content "List View" displays all of the content as a listing of search results, sorted by the date each item was last updated. From this view, you can apply a number of different filters to narrow your search as desired. For example, you can easily toggle between all site content, drafts you've been working on, any submissions or approvals that have been assigned to you, and more by clicking the area next to "Showing:" as illustrated below. Mura Contributor Guide 17 February 2019 D raft You can also apply several other filters. For example, clicking on "Advanced Filters" opens up another set of form fields that you can use to enter keywords, narro w by content type, tags, and categories. Simply click the "Filter" button when finished, and Mura will return any results that match the filters you've applied. Basic Tab When you select a content item to edit it, y

21 ou're taken to the "Edit Content" scree
ou're taken to the "Edit Content" scree n. As you've probably already noticed, there are several tabs listed across the top of the screen. Note: For information about the other tabs on this screen see the Tabs se ction. Mura Contributor Guide 18 February 2019 D raft By default, the "Basic" tab is displayed. The "Basic" tab contains some of the most critical and commonly used form fields that are used for Mura CMS content. Also, it's important to note that this tab varies depending on the "Type" of content you are editing. For example, when you add a "File" content type, you won't see a "Content" field. Each of the form fields listed below apply to most content types though.  Type: This displays the content type selected when the content item was created. You ha ve the option to change the content type here. Some content types aren't exactly compatible with others, which is why you may not see "File" as an option when the original content item was a "Page" or "Folder" content type.

22  Title: This is the most importa
 Title: This is the most importan t field for any content item. It's also the only required form field by default. The text entered here typically appears as the page title, just above the content. The value entered here will be used to automatically create all other title fields, listed b elow, if they are left blank. Hence, when you change the value entered here, a prompt will be displayed asking if you wish to "Clear Additional Titles." Often times, you'll want to take advantage of this feature. o Navigation Title (Optional): The value ente red here will be used for any navigation that's automatically generated by Mura. For example, it will be the text displayed on the primary or sub - navigation of your site. o URL Title (Optional): The value entered here will appear in the browser's address bar . For example, "About Us" would become "about - us" and when combined with the full domain, will appear as http://www.yourdomain.com/about - us/ o HTML (Browser) Title (Optional): The value entered

23 here will appear on the browser's chro
here will appear on the browser's chrome or browser tab.  Assign Associated Image: This is a very special field where you can upload a primary image to be used along with the content item itself. The first is when the content item is a direct child of a "Folder" content type, the image is typically displayed along with the Title, Summary, and a few other fields in the Folder listing. Next, it will typically display on the content item itself. Mura Contributor Guide 19 February 2019 D raft The size, and placement are determined by the layout and theme used. It can also be displayed on a "Folder" when it's a direct chi ld of the Folder itself in the listing. o You can either upload an image, enter a known URL of an image, or even select an existing associated by searching for one. o The buttons above the image allow you to perform various actions.  The crop marks button wil l direct you to the "Image Details" screen where you can adjust the image orientation, as well as creat

24 e new crops for each of the defined ima
e new crops for each of the defined image sizes. Mura Contributor Guide 20 February 2019 D raft The info button will launch the "Edit Image Properties" window. Here, you can enter values into a nu mber of various metadata fields.  The download button will launch an alert asking if you wish to download the file. Select "OK" to download.  Summary: The text entered into this field is shown in special circumstances. The first is when the content item is a direct child of a "Folder" content type, the value from this field is typically displayed along with the Title, Associated Image, and a few other fields in the Folder listing. The other instance is when the content item has been restricted to public v iew, and the user attempting to view the content is not logged in. It will appear just above the log in screen. So, be careful to not enter any confidential information into this field unless your development team has instructed you that it's safe to do so because of some modifica

25 tion they've made to Mura CMS.
tion they've made to Mura CMS. Mura Contributor Guide 21 February 2019 D raft  Content: This is the main body, or "content" of the content item. It's here that you will enter your primary text, images, and links.  Delete: Selecting this option will generate an alert dialog to confirm whether or not you wish to delete the selected content item and all content nested beneath it. Another option are the icons on the far right of each row. Mura Contributor Guide 22 February 2019 D raft Objects: Objects can inherit or not inherit cascading, and they can also start a new casc ade. Display: The content is either displayed or hidden or controlled by a schedule; if hidden it can only be edited via the back - end administration area unless you know the URL to the page in order to edit via the front - end. Template: The content can inhe rit the parent template, or use another template, and use an alternate child template for its children. Nav: This op

26 tion toggles whether or not a content it
tion toggles whether or not a content item will appear in navigation generated by Mura. The navigation for the following page has been turne d off: It does not appear in the News section below: Updated: The field indicates the date when the content was last changed. Content Formatting When editing the "Content" or "Summary" fields in Mura CMS, you're actually using a web text editor. The e ditor comes with a number of very powerful features. First of all, if you click the question mark found on the far right of the last row of tools, a dialog window will appear informing you that the web text editor was created by CKEditor . While we'll cover some basics, you may find the CKEditor User's Guide a much more thorough resource. The Toolbar The first thing you'll notice when editing content with the web text editor i s the toolbar that appears at the top of the editor window. A similar toolbar appears when you using "inline edit" mode on the front - end public view of your site as well. It conta

27 ins menu buttons that give you access to
ins menu buttons that give you access to various functions of the editor. All buttons are grouped according to their function and include both simple operations (like basic text styling or formatting ) and more advanced features (like inserting media via a dialog window ). Mura Contributor Guide 23 February 2019 D raft The CKEditor toolbar buttons are illustra ted with meaningful icons. If, however, you are not sure what functions they perform, hover the mouse cursor over the buttons to see a tooltip with the name of the function. Using the Toolbar In order to perform an operation assigned to a button, click t he button once. In most cases it will either immediately perform some predefined action or open a dialog window with further configuration options for a feature. Remember that the toolbar can also be used with your keyboard. To enter the toolbar, use the A lt+F10 keyboard shortcut. To move to the next or previous button group, use the Tab and Shift+Tab keys, respecti

28 vely. Within a button group, use the L
vely. Within a button group, use the Left Arrow and Right Arrow keys to move between buttons of this group. To activate a selected toolbar butto n, press Enter or Space. Some of the buttons serve as placeholders giving you access to further options placed in a drop - down list. They are easily recognizable thanks to a small icon on their right. Clicking the name or the arrow icon of such button expa nds the list and lets you choose one of its options via the left mouse button. To select a drop - down list option you can also use the Tab or the Down Arrow key and then accept your choice by pressing Enter or Space on your keyboard. To hide the list, use t he Esc key or click anywhere in the browser window. Collapsing and Restoring the Toolbar To save on screen estate, you can collapse the toolbar by pressing the button or using the Alt+ - (minus) keyboard shortcut. In order to return to the full toolbar vi ew, press the same button or keyboard shortcut again.

29 Mura Contributor Guide 24 February
Mura Contributor Guide 24 February 2019 D raft Uploading Images and Files Mura CMS uses CKFinder for its web file manager, which is maintained by the same organization that created CKEditor . CKFinder is a file manager that can help you browse, upload, and manage files located on a web server - directly from your Internet browser and without the need to install anything on your computer. For complete document ation on how to use CKFinder, please visit http://docs.cksource.com/CKFinder_2.x/Users_Guide . How to Create a Photo Gallery As previously mentioned in the Folder section , Folders allow you to aggregate related content into a defined group. While they are typically used to keep content such as "news" or "blog" posts together, they may also be used to create photo galleries. In fact, there's nothing stopping you from creating a "folder of galleries" or "galleries of galleries". To create a custom photo gallery, follow the steps outlined below. 1. Navigate to the section of your sit

30 e where you wish to add a photo gallery
e where you wish to add a photo gallery (or gallery of galleries, etc.), then add a "Folder" content item. 2. In the " Title " field, enter the name of your gallery. For example, "My Photo Gallery". Mura Contributor Guide 25 February 2019 D raft 3. When finished, select your desired publishing option. 4. Now that you've crea ted a new Folder, you can add your images in a few different ways. First, keep in mind, this is just a Folder. So, you can add multiple "Pages", and just make sure you use the "Assign Associated Image" field to add your desired image for each page (this is essentially how "news" or "blog" posts are created. You could also add a "File" content type, and select an image as your file to upload. Or, you could use the " Quick Upload " feature to upload multiple images at the same time. Finally, you could select the "Folder" content type, and use the "Assign Associated Image" field for your image. In fact, using a specified image for the nested Folder is a grea

31 t wa y to create "galleries of galleries
t wa y to create "galleries of galleries". 5. The example below is using the Quick Upload feature to upload multiple images at the same time. When using this feature, keep in mind that you're able to modify the "Title" of the image before it's uploaded. Mura Contributor Guide 26 February 2019 D raft 6. After you've completed uploading all of your images as content items, whether it's Pages, Folders, Files, or you used the Quick Upload feature, you're ready to customize your Folder to make it function more like a traditional photo gallery, because your gallery will display just like any other Folder does by default. 7. From the front - end view of your site, hover over the pencil icon, then select " Inline Edit ". Mura Contributor Guide 27 February 2019 D raft 8. Hover your mouse over the list of images in the body area, and click the pencil icon which should a ppear in the top - left corner of the region. 9. The display object panel should now rev

32 eal the "Folder" configuration panel.
eal the "Folder" configuration panel. 10. From the "Folder" configuration panel, you may select your Layout, List Image Size, which Selected Fields you wish to display, Item s per Page, and more. For example, for the Layout, select "Grid", then select your desired "Grid Style" option and "List Image Size". You'll see the display automatically update as you make each selection, so you'll know what the gallery will look like for your site visitors. Mura Contributor Guide 28 February 2019 D raft 11. If you don't want the Title of each image to appear, select the " Edit " button beneath the " Selected Fields " label. 12. The " Select Fields " dialog window should open. From here, you may click, drag and drop the field(s) you wish to di splay, or not display by moving them from one column, to the other. Mura Contributor Guide 29 February 2019 D raft 13. When finished selecting your desired fields, click Update . 14. The body area will update to refl

33 ect your updates. Mura
ect your updates. Mura Contributor Guide 30 February 2019 D raft 15. In addition, on the "Folder" configuration panel, make sure you set " View Images as Gallery " to " True " if you want a modal window to open when a user clicks on an image. 16. You may also select the number of " Items Per Page ", and if your Folder contains more images than the number selected, Mura will auto - generate pagination for you. Mura Contributor Guide 31 February 2019 D raft 17. When finished, be sure to "Save" your changes by hovering over the " Save " button, and selecting your desired publishing option. 18. Your new gallery should now be ready for viewing. Mura Contributor Guide 32 February 2019 D raft 19. If you set " View Images as Gallery " to "True", clicking an image will open the image in a modal window. 20. If/when you wish to reorder the images , you will need to do so via the back - end adm inistration area, just as you would