Directions (please read carefully) System Basics 1 - Navigate to http://morgana.mtroyal.ca/training. The page shown below appears. Evoking edit mode 2 - Use Ctrl+Shift+F5 to evoke edit mode. Logging in Username = cmstraining Password = newsite Note: in the real world you would use your mymru (LDAP) login. Click the student link that matches the number written at the top of this training sheet. I.e. if you have the number 1 then you would click Student 1. See screen shot on next page. 1
1 2 3 4 5 You will now see the formatting toolbars for the 5 editable regions on a level 2 page. To edit the content region of your page click the Edit option on the content_region toolbar. Creating a level 1 heading 1 - Enter some text for the heading (required element). Important A Java related dialogue may now appear at this point select the Run button quickly. Repeat for the second dialogue that appears directly after. Style Note: Use sentence style headlines (capitalize the first word only of the headline). Creating a subheading 2 - Select the text Career choices and from the Paragraph style (Normal Paragraph) dropdown select Subheading. Style Note: Subheads are either red as above or bold. Links in the body of the copy are not bold. 2
Creating an internal link 3 - Select the text "Bachelor of Ompholology"; bold it, and then click the Link button. From the screen that appears select the Link to a section option. This option is selected when you are creating an internal link. Note: It is important to do all internal links this way. Do not use Link to the following URL for mtroyal.ca links. 4 - Next select training (training) from the website drop-down and then select another student's page. 5 - Click Next. 6 - Leave the final screen as is then click Finish. To preview link select the Preview button. Click the link to see if it opens the correct page. Note: that student's page link will be highlighted blue in the sidebar. 3
Creating an external link 7 - Highlight the text Yahoo and click the Link button. 8 - From the first screen that appears select Link to the following URL: option. Type the text shown below. Note: the http:// prefix appears by default. 9 - From the next screen select Open link target in new window then select _blank from the drop-down. This will open the page in a new window. Note: you will always want to do this for external links. 10 - Click Finish and then Preview. 11 - Click the Update button on the content_region toolbar. Very important this will send changes to the content region for approval and this section is now locked for editing until changes are approved or rejected. 4
Adding a header photo 12 - Click the Edit button for the header_photo region. From the screen that appears double-click the Insert Image button. 13 - You will now have to search for the image required. To do so from the Query Actions drop-down select Search Within. When the search form appears enter, training_header in the title field and click the Search Within button (or the Enter key). Note: in the real world you will only need to enter header_ in the title field. Important - If your first search string contains a typo you will receive 0 results. Retyping the search string correctly will still return 0 results as you will be re-searching the original result list of 0. To prevent this problem you must start your search over again from the very beginning. 5
14 - From the next screen click the image title link to preview the image. Note: to return to the image list use the Backspace key on your keyboard. Clicking X will return you to the beginning of the search, where you will have to retype the search string again. 15 - To insert the desired image click the Select button for that image. 16 - Once inserted right-click the image and from Image Properties enter alternative text for the image. Note: this alternative text is needed for screen readers. 17 - Click the Preview button to preview changes then the Update button if satisfied with the results. Adding text links to the See Also region 18 - Click the Edit button for the See Also region. 19 - Add the text See Also: to the heading section and from the screen that appears click the Green Plus symbol to add a new row. Click the Pencil icon to edit the row. 20 - Enter some text in the link area to serve as a link to another student's page. Once entered, select the text and click the Link button. Note: be sure to highlight all the text. 6
21 - From the next screen select Link to a section option. 22 - From the next screen select training (training) as the website then the appropriate student page. 23 - Leave the last screen as is and select Finish. Click the Preview button to test the link and then Update if satisfied. Adding a license plate to the white sidebar 24 - Click the Edit button for the white sidebar region. 25 - Click the Green Plus symbol to add a row. Click the Pencil icon to edit the row. 26 - Double-click the Insert Image icon to add an image. 27 - From the Search dropdown select Images when the search form appears type training_sb in the Title text field and click Search. Note: in the real world you will only need sb_. From the returned results look for images that end in wt. This signifies the image can be placed in the white sidebar. 28 - Choose an image and click Select to insert the image, once inserted right-click the image and select Image Properties to add alternative text. Note: if you wish to add a new image to the sidebar region simply select the Green Plus symbol to add a new row and follow steps listed above again. 29 - To add an image to the blue sidebar follow the same steps as for white sidebar but select images that end in blu from search results. 7
Navigating to a level 3 page To navigate to your level 3 page click the Second page link on the bottom of your page 1 content region. Adding an image to the content region 1 - Click the Edit button for the content region. Click where the image is to appear. 2 - Double-click the Insert Image button found on the toolbar. 3 - From the Search dropdown select Images when the search form appears type training _content in the Title text field and click Search. Note: in the real world you will only need content_. 4 - Select your image and once inserted right-click the image and from Image Properties select Middle from the Alignment drop-down. Add some alternative text to the image and click OK. Placing smaller images in the content region This is how you include an image that is not the standard 500px wide in the content region and get the correct spacing of 20px around it (you no longer have to use image properties): 1. Place the cursor where you would like the image to go. Note: Remember that if you add an image that is not 500px wide it should not be more than 200px wide. This allows enough space for the text around it. 2. Click the Insert Image button or select the insert image option on the Insert drop-down menu. 3. Find your image and click Select. 8
4. The image will now appear in the content region click the image and go to the drop-down style menu. 5. Select img (img- right) if you would like it to appear on the right side of the content region or img (img- left) if you would like it to appear on the left side of the content region. Note: This is not necessary for images that are 500px wide as they are the full width of the content region and text will not wrap around it. 6. This step will automatically include 20px to the three sides of the image that border text. The fourth side will not have extra spacing and will align with the text. Note: In most cases you will want to select right to balance the left sidebar. Remember not to clutter a page with too many photos. Usually, if you have a photo in the content region you will not need one in the white sidebar use a licence plate or quote instead. All images should be properly sized and styled - with grey line - before being checked in to the CMS. Do not resize images once they are on the page. You can learn how to do this at the CMS Photo workshop. Note: This process is not necessary for tables. You can still use the cell padding and spacing, as well as the table alignment. 9
Adding an table to the content region 1 - Click after the first paragraph in the body of the page and from the Insert menu select, the Insert Table option. Add a table with 2 columns and 3 rows. 2 - Right-click the second row in the table and select Row Properties, from the Color drop-down select the color box. Style Note: Read the Style Guide for the base style of tables. You can download it from MyMRU. 3 Select the blue (E5EFF6) box, then press OK. Note: More colors are available by selecting More Colors below the blue box but these should be use very sparingly. Repeat these steps for every second row in the table. 4 - Once completed right-click anywhere in the table and select Table Properties, from the screen that appears set the following options. Note: If your table is 500px wide leave the table alignment at Default. 10
Alignment Your choice if smaller than 500px Cell Padding 5 Border Size 0 Width 500 In pixels (it s important not to go higher than 500 because it will stretch the page) Adding an image and a quote to the white sidebar 1 - Click the Edit button for the white sidebar and then click the Green Plus symbol to insert a new row. Doubleclick the Insert Image icon and search for training_quote. 2 - Once selected, insert the image quote in the sidebar and click Preview to preview changes. 3 - Click the Green Plus symbol a second time and search for training_sb. Find an image that doesn t end in wt or blu and click the Select button to insert it. Click Preview, then Update if satisfied with changes. Creating an E-mail link 1 - Navigate to http://morgana.mtroyal.ca/training and login if necessary 2 - Enter edit mode (CTRL+SHIFT+F5) 3 - Select the text to create email link on 4 - Click the link button 5 - Choose Link to the following URL option and type mailto:jdoe@mtroyal.ca for example 6 - Click Finish 11
Working on the CMS To update your page(s) on the live site you will need to navigate to: http://morgana.mtroyal.ca/mr Sign in using your LDAP username and password. First time users should navigate to http://morgana.mtroyal.ca/wcmdev and from my profile set layout to topmenus. JAVA certificate issue solution 1 Navigate to morgana.mtroyal.ca/wcmdev and select My Profile 2 From below the form that appears select Site Studio Certificate Validation 3 From the next screen select both Check buttons. NOTE: do not use www. Also, this address is protected and can t be accessed on public computers with VPN. 12
Workflow Approvers will receive an e-mail notifying them that there is a page for them to review. It will come from the Author who edited the page The Review workflow item link will take you to the page to be approved When the page opens a green gear will appear to the left of the region tag to identify what region is in the workflow and needs to be approved. The dropdown menu icon on the far right will give you the option of rejecting or approving the document. You can also view the differences (changes will be highlighted). Rejected pages If a page is rejected a window will appear where the Approver can explain to the Author why the page was not approved. The Author will receive those comments in an e-mail and the region will be unlocked so they are able to make changes. Unlike regular page editing, once changes are made to a rejected page and the Author updates it, an e-mail is not automatically sent to the Approver. After updating the changes, wait for the page to refresh. The green workflow gear will appear (see above) and the Author can approve their changes by using the drop down menu of the icon on the far right. Once the Author approves the region, an e-mail will be sent to the Approver notifying them that the page is ready to be reviewed again. If the Author does not approve their changes, the page will stay in workflow for two days when a reminder e- mail will be sent to the Author stating the content is dormant. No changes will appear on the live website until an Approver has approved the content. 13
Changing Workflow If you would like to request a change to your workflow (adding or taking someone out) a request must be sent to the ITS web team. This request must be made by a manager/chair or higher. Please contact Andrew Long at along@mtroyal.ca or call him at 6936. Keep up to date The best way to stay current on CMS news and university-wide changes is to read the CMS blog (blogs.mtroyal.ca/cmsblog). It is also a great place to ask questions and give feedback. Anika s tip Contacts Anika Van Wyk 440-6622 Verle Winsor 440-8740 HelpDesk 440-6000 14