OU Campus Beginner s Guide

Transcription

1 OU Campus Beginner s Guide for web publishers at Augusta University

2 Table of Contents Terminology... 1 Homepage, Index Page & Landing Page Website Binary Files Logging In... 2 Failed Logins & User Lockouts Common Login Error Messages Navigating OU Campus... 4 Folder Requirements Checking Pages In/Out... 5 File Actions Panel... 6 Page Properties... 7 Editing a Page... 8 WYSIWYG Editor Just Edit Mode Links Inserting Links Linking to an Augusta University Page Dependency Manager Linking to an External Page Documents Linking to a Document Images Inserting Images Image Editor Uploading Files Uploading Files Naming Conventions Reverting Pages Revert a Page Publishing Pages Publish a Page Final Check Tab Schedule Tab Site Navigation... 23

3 Terminology Our Content Management System (CMS) has been called many things: Content Management System (CMS) OU Campus - The name of the CMS we use OmniUpdate - The company that made OU Campus Staging Server - The place where users edit pages before publishing them Those terms are all referring to the same thing and can be used interchangeably when talking about the site. Homepage, Index Page & Landing Page These terms refer to the default page of a directory on the web. Think of it as the front door. On augusta.edu these pages are always named index.php. Website Augusta University has three different websites. These are: augusta.edu - This is the main university website. augustahealth.org - This is the website for the hospital. PAWS - This is the university s intranet and is intended for internal information for faculty, staff and students. There is only one university website - augusta.edu. What many people refer to as their website is actually a section within augusta.edu. Some examples of sections within the augusta.edu website are: Admissions, Financial Aid, College of Nursing, etc. Binary Files Anything that is not a webpage (ending in.php) is considered a binary file. This includes: Images -.jpg,.gif,.png Documents -.doc,.docx,.pdf Spreadsheets -.xls,.xlsx Presentations -.ppt,.pptx 1

4 Logging In Content contributors and administrators can log in to OU Campus by clicking the copyright symbol ( ) located next to the Augusta University name at the bottom of the page. Typically, every page of a website managed by OU Campus includes this link to allow content contributors to log in directly to edit a page. Click the copyright symbol at the bottom of the page to log in. Clicking the link will take users to the OU Campus login page, where they can sign in using their usernames and passwords. Upon logging in, users return to an editable view of the page where they clicked the link. 2 Your OU Campus username and password are not connected to your other accounts. Contact the Web Team if you have difficulty logging in. Once logged in, the browser session is persistent, and a user can open another page or tab in the same browser without having to log in again. Users must have the proper access privileges granted in order to access the page - without proper access, users will be logged in to OU Campus but will be unable to view the page.

5 Logging In Failed Logins & User Lockouts If users incorrectly enter their login credentials too many times in a row (typically three incorrect tries), they will automatically be locked out of the OU Campus system, preventing users from trying to log in again. In the event of a user lockout, the Reset Password function becomes unavailable, and an is sent notifying the user of the lockout. An administrator must reset the user s login privileges. Submit a web request form to request a password reset. Common Login Error Messages If you see any of the error messages displayed below, please contact the Web Team for assistance, or navigate to another page. Error 1 Error 2 The above error messages mean you are trying to edit a page you do not have permission to access. Contact the Web Team if you need access to edit this page. Error 3 This error message means you tried to log in with the wrong username and/or password. The Web Team can reset your password for you if necessary. 3

6 Navigating OU Campus OU Campus uses a folder structure, which allows users to receive permissions to edit certain folders. This also prevents other users from accessing pages they do not have permission to edit. The structure of OU Campus includes the: 1. Current Directory The Current Directory tells users in which folder they are currently working. 2. Split-Screen Explorer The Split Screen Explorer lets users navigate quickly between pages within a folder. The Split Screen button allows users to navigate between the Full View and the Folder Structure. 3. Current File The Current File tells users which web page they are currently working on. 4. File Actions Panel The File Actions Panel allows users to view and edit settings directly related to a single page. 5. Preview Pane The Preview Pane lets users preview their page as it is and/or before it goes live on the internet. Folder Requirements Every folder must contain certain components without these components, the folder and the pages within the folder will not work. These components include: _props.pcf - This file updates the properties of the folder. Do not edit this file. _nav.inc This is the navigation for everything in the folder. documents folder This folder is where all the documents should be stored. images folder This folder is where all the images should be stored. includes folder This folder contains background data for the folder. index.pcf This is the main/default page of the folder, aka the Landing Page. 4

7 Checking Pages In/Out The checked out/in icon, represented by a lightbulb, reflects the state of an OU Campus page or file. When a user edits a page by clicking on an editable region button or clicks to a page from a list view, the page is automatically checked out to that user. Likewise, when the user publishes a page, it is automatically checked back in. The Check In and Check Out features allow multiple people to make changes in one site without overwriting another user s changes. Anytime a file is edited, it will automatically check out the page to that user. When a page or file is checked out to a user, no other users can view or edit the page until it has been checked back in. The Web Team can override this and manually check pages back in that are checked out, but doing so will cancel any unsaved changes to the page. If you are editing a file, you will see a lit lightbulb next to the file name. If someone else has the file checked out, you will see the red padlock next to the file name. It is important to check in a page once you have completed your work. Users can view all the pages they have checked out by clicking the Dashboard tab at the top of the screen within OU Campus. 5

8 File Actions Panel The File Actions Panel includes options in relation to the current file being worked on. As long as the page is checked out (the yellow lightbulb is on), the following options available to you are: 1. Preview - The Preview button allows you to preview any edits made on the webpage before being published. 2. Edit - The Edit button allows you to edit the sections on the page. 3. Properties - The Properties button allows you to update and edit specific details and metadata about the webpage, including page title and page layout. 4. Versions - The Versions button allows you to view previous publishes of the webpage and revert the page to a previous publish. 5. Check In/Out - The Check In/Out lightbulb allows you to check out the page so that no one else can edit the page. The yellow lightbulb means the page is checked out, and the gray lightbulb means the page is checked in. 6. Publish - The green Publish button allows you to publish the page onto the live website. 6

9 Page Properties Once a page is checked out, click the Properties button in the File Actions Panel. This will open a page allowing the uesr to change the page title, breadcrumb, heading and layout of the page. 1. The Title appears in the blue bar of the browser and in search results. 2. The Description is a brief summary of the page that appears in search results. Usually the first paragraph of the page is enough (1-3 sentences). Do not add more than one paragraph. 3. The Page Heading appears at the top of the page in large type. 4. The Breadcrumb is one or two words for the trail of links that appear at the top of each page. The breadcrumb automatically links to the index.php page in each respective folder. To edit the layout of the page, use the checkboxes in the Feature Settings and Page Settings to either display or hide the appropriate editable sections. 7

10 Editing a Page When logging in to the system to directly edit a page, there may be several editable regions available. The available editable regions are defined by permission levels and group associations. Only areas that are available to be edited by that user are shown with an edit button. These are indicated by a green button above the editable region labled with the region s title, such as Featured Content, Promo Image and Main Content. Clicking on the Edit button above a region allows for that section to be edited. This opens the WYSIWYG Editor by default, and the assigned toolbar becomes available. WYSIWYG Editor WYSIWYG (aka Whizzywig ) is an acronym for What You See Is What You Get. Many of the editing tasks for a page, such as inserting images and links, applying formatting (such as bold or italics) and spell-checking a page can be accomplished within the WYSIWYG Editor using the toolbar. Icons represent the various tools in the toolbar. Clicking on any icon performs an action, either direction to the page or to the selected text and graphics. Some icons display more options in a drop-down menu or dialog. 8

11 Editing a Page Just Edit Mode Clicking the green Edit button will allow users to add, delete or modify content without having to know any HTML code. A new feature of OU Campus is the Just Edit feature, which allows users to view the edits in context. Many buttons on the toolbar are similar to the buttons and options available in Microsoft Word. The availablity of a function is based on the selected items or the location of the cursor on the page. For example, if nothing is selected, functions such as Insert Link are dimmed, signifying that this function is not available at the moment. For the Insert Link button to be available, the user must first select text or a graphic. One item that is not represented on the toolbar, but is available from within the WYSIWYG, is the ability to save-in-place using the CTRL+S (PC) or CMD+S (Mac) keys on the keyboard. This offers users the ability to save the page without clicking the usual save icon that ends the editing session. Save-in-place saves the page and allows the user to continue editing. Once the content has been updated and changed, the user can click the Save button on the toolbar to end the editing session and save the changes. The user can review the page via the Preview mode to see what the page would look like on the live website prior to publishing the page. 9

12 Links Inserting Links To insert a link, begin by opening up the page in OU Campus and selecting the Edit option on the appropriate section. Select and highlight the text that needs to be linked. Click the Insert/Edit Link button on the toolbar, and a pop-up dialog box will open. 1. The File Search button allows users to search for documents and webpages within OU Campus. 2. The URL Field indicates where the finished link will take the user. 3. The Text to Display is the actual text of the link. This can change the text that was highlighted. 4. The Target lets the user decide whether the link will open in the same tab (None) or in a new window/tab (New Window). 10

13 Links Linking to an Augusta University Page When linking to another page on the university s website, click the File Search button and another pop-up box will appear. Staging The staging server is selected by default and a PCF file type should be selected in order to have links managed. This box displays a list of folders and files, which can be used to navigate through the website. 1. The Preview Pane allows users to preview any page selected, to ensure the correct page is being linked. 2. The Page Information provides basic information about the page selected. 3. The Folder Navigation serves as a breadcrumb link to allow navigation up the folder structure. 4. The Select a Page section allows users to select the page or file they wish to link to. Once the desired page is selected, click Insert to see the next step. 11

14 Links Dependency Manager By inserting a link via this method, OU Campus creates a series of letters and numbers tracking this particular link using the Dependency Manager. The Dependency Manager will keep track of the link, making it possible for pages, links and/or directories maintained within OU Campus to be updated automatically when that page or directory is moved or renamed. Using the Dependency Manager prevents most broken links from occurring, meaning less stress and confusion in the future when attempting to fix and correct broken links. When linking to a page within OU Campus, select None as the Target. Linking to an External Page The steps to link to an external page are the same as the procedure outlined above, but instead of browsing for the internal link using the File Search button, the complete URL for the page can be typed (or pasted) into the URL field. Links to external pages are not under Dependency Manager tracking. Click OK to insert the link. When linking to a page outside of the university website, select New Window as the Target. 12

15 Documents Users should primarily use PDFs when adding files to the website. Microsoft Office files (such as Word, Excel and Powerpoint) rely upon the user s computer to work, while PDFs rely upon the user s browser. Essentially, if users can view your webpage, they can view a PDF. Microsoft Office files also cannot be easily downloaded or viewed on phones or tablets, while PDFs can easily be downloaded. Linking to a Document In Edit mode, select and highlight the text that should link to the document. Click the Insert/Edit Link button from the toolbar. Click the File Search button to the right of the URL field, and another pop-up dialog box will appear. Navigate to the appropriate documents folder to view a list of all the document files uploaded on the site. When linking to a document, select New Window as the Target. Select the desired document file, and click Insert. Click OK to insert the link. 13

16 Images Images and pictures are important to the website. They should be stored in the appropriate Images folder. When placed on the website, images should be resized to be as close as possible to the size the images should be viewed. Large images make pages difficult to load, and certain browsers will always display the image at full-size. Generally, images on the website should be no larger than 600 pixels wide. Inserting Images Users may easily insert and edit images within OU Campus. Place the cursor where the picture needs to be inserted, and click the Insert/Edit Image button. 1. The File Search button allows users to search for images within OU Campus. 2. The Source Field indicates where the images are located. 3. A brief Description of the image allows site and text readers to understand and describe the image. This is necessary to comply with accessibility requirements. 4. The Dimensions field allows users to change the apparent size of the image, but not the actual size of the image itself. 14

17 Images Inserting Images On the Insert/Edit Image pop-up box, click on the File Search button next to the Source field, and another pop-up box will appear. Navigate to the appropriate Images folder to view a list of all the image files uploaded to OU Campus. Users can preview the images by selecting the image or by clicking the Thumbnail view at the top of the dialog box. Select the desired image, and click Insert. Type a brief description of the image into the Description field. On the Appearance tab, the image s appearance on the page can be edited. The Vertical space and Horizontal space is the amount of space between the image and the words surrounding the image. Click OK to finish. 15

18 Image Editor OU Campus offers a basic image editing tool so images can be resized, cropped and rotated directly within the CMS. This helps ensure large images are properly resized before being published to the production server. OU Campus Image Editor When selecting an image to insert onto the page, select Edit Image on the image preview window. 1. The Resize option includes the ability to specify a new width and height for the image. The original ratio for the image dimensions can be kept intact by selecting the Preserve Ratio checkbox. 2. The Crop option allows the user to crop the image by dragging the crop handles located on the edges of the crop box or by selecting one of the preconfigured crop settings. 3. The Rotate option rotates the image 90 degrees in a clockwise direction with each click Once the image is edited to your liking, select Save As and insert the newly edited image as normal. 16

19 Image Editor Alternate Image Editor It may be easier to upload the image into OU Campus ready to be posted, instead of using the OU Campus Image Editor. If the user does not have image editing software (such as Adobe Photoshop, the user can use pixlr.com/editor. Pixlr.com/editor is a free, online image editor that allows users to resize, edit, rename and save images. Pixlr.com/editor will also allow users to change JPEG files into PNG files. Note: JPEG image files will lose quality when edited within the OU Campus Image Editor. To avoid pixelated or blurry images, please use PNG files. Users are not able to change files from JPEG to PNG files using the OU Campus Image Editor. 17

20 Uploading Files OU Campus allows users to upload files from their computer to OU Campus, which makes it then easy to link to or use those files on the website. When uploading files to OU Campus, make sure the files are being uploaded to the appropriate folder. Documents should always be uploaded to the documents folder inside of the appropriate site directory, while images should always be uploaded to the images folder. Uploading Files To upload a document or an image from your computer, select and highlight the text that should link to the document/image. Navigate to the appropriate insertion button, click the File Search button and another pop-up dialog box will appear. Navigate to the appropriate documents or images folder to view a list of all the files uploaded to OU Campus. Click the Upload button at the top of the pop-up box. In the next pop-up box, either drag-and-drop the file from your computer to the pop-up box, or select the green +Add button to locate and select the document to upload. The header at the top indicates where the file will be placed. All documents should be placed inside the documents folder, and all images should be placed in the images folder. 18

21 Uploading Files Naming Conventions By uploading these files, you are essentially creating a URL for the files. As such, all files must follow specific naming conventions to work properly. These include: lowercase letters only numbers dashes (-) File names with capital letters or spaces will not upload. Correct File Names brand-guidelines-2016.pdf student-center-16.png Incorrect File Names 2016 Brand Guidelines.pdf Student Center.png Files may be renamed at this point by clicking Rename and entering the new file name. Click Start Upload to upload the file. An error message is shown if a file could not be uploaded, which may be the case if it does not follow naming conventions or if the file already exists and the Overwrite Existing checkbox was not selected. Once the file is uploaded, it will appear in the current folder. Items are sorted alphabetically, so users can easily locate the desired file. 19

22 Reverting Pages Every time a webpage is published, OU Campus catalogues that version of the page. The Versions screen shows a list of saved versions of a page. Users may access the list of all previous versions once they have checked out the page. All versions of the page are kept in the system until the page is deleted. There is no limit to the number of versions that are stored in the system for an individual page or across all pages in the site. If a file is moved to the Recycle Bin and then restored, versions will still be preserved. Revert a Page To restore (revert) a page to a previous version, check the page out, and then click the Versions button. This displays a list of revisions. After deciding which version of the webpage to revert to, click the version number, and click Revert. This will load the selected version back into OU Campus, which can be edited via the Edit mode. 20

23 Publishing Pages Pages and other content files within OU Campus are located on the staging server and must be published to the production server to be viewed on the internet. Pages can be published by all user levels in OU Campus, but users can only publish pages to which they have access. Publish a Page Files and pages must be checked out to publish. Pages can be published three different ways: 1. From the Page List View 2. From the Edit Mode 3. From the Split Screen View To publish a page, click the green Publish button. By selecting the drop-down menu next to the green Publish button, users can schedule pages to be published at a later date or schedule pages to expire. Upon clicking the Publish button, the Final Check tab will appear. 21

24 Publishing Pages Final Check Tab The Final Check tab allows the user to check the spelling on the page and ensures that all the links on the page work. Optionally, a brief version description can be written to describe the changes made during the latest edit. This description appears on the Versions page should the page need to be reverted to an earlier publish. If a new document file has been uploaded or an image file has been edited or uploaded, an Include Unpublished Dependencies checkbox appears. This option ensures that all content necessary for the page to work properly is published at the same time as the page. Click Publish to publish the page to the live website (production server). It may take up to five minutes for the changes to go live on the website. Schedule Tab Users have the ability to publish content at a later date using the Scheduled Publish tool. A scheduled publish can only be canceled or modified by the user who set the schedule. Users can select the date and time the page should be published and have the option of sending a message when the page publishes. 22

25 Site Navigation OU Campus automatically generates a sidebar for all of the pages included in the site directory. The _nav.inc file updates the side navigation for every page within its respective folder. To modify this navigation, open up the split-screen layout. Locate _nav.inc, and check out the file by clicking on the lightbulb icon next to its name. Users can edit the _nav.inc file by either clicking the Edit option on the page actions menu or clicking the _nav.inc file. The site navigation appears as a bulleted list. Edit and update this file using the same tools used when editing pages. Make sure to properly link the text to the correct pages. Note: Use only the bulleted list. Do not use colors, headers or images in the _nav.inc file. This will break the navigation list and disrupt the responsive nature of the navigation. Save and publish the file to update the navigation. 23

26 Contact Us Website: augusta.edu/dcm/web Sign up for web training Submit a work request Review training materials and videos Review policies and guidelines Keep up-to-date with news Address: Communications & Marketing Augusta University Health Sciences Campus Professional Building th Street Augusta, GA webcontent@augusta.edu Phone: