CMS Shado 9 Quick Start Guide 1
Logging In 3 Shado Central Interface 4 Sections, Pages and Containers 7 Sections 7 Pages 7 Containers 7 The Site Tree 8 Edit Content on a Page 9 Editing Container Content 10 Working with Sections 12 Adding a Section 12 Editing Section Properties 13 Deleting a Section: For advanced Editors & Publishers 13 Working with Pages 14 Adding a Page 14 Editing Page Properties 15 Controlling Page Layout 16 Deleting a Page 16 Adding files into Shado Digital Assets (Formerly FMS) 17 Using Digital Assets 17 Inserting files into a Shado page 20 2
Logging In Shado Central is the administration interface used for working with Shado. You can log into the Shado Central site management interface by browsing to http://cms.massey.ac.nz/massey/admin Log into the Shado Central Interface Click the Massey users click here to log back in link. You will be presented with a login box. Enter your Massey credentials and click OK to log into Shado. 3
Shado Central Interface After logging in, you will see the interface referred to as Shado Central, which forms the backbone of the Shado CMS. It is the administrative interface that you use to manage your site. As you will see Shado 9 is quite a bit different from earlier versions. The Shado Central Interface To begin editing a site in Shado 9 click the Manage Your Site button. The screen will refresh and you will be presented with the top (Home) directory of the folder tree. 4
Drop-down Menus Information Bar Menu Bar Explorer Window Page Summary Action Window The interface of Shado Central has three distinct areas: The Menu and Information bars on top provide the main form of navigation The Explorer Window displays options available for the item selected from the Menu bar The Action Window displays actions that can be performed on the option selected in the Explorer Window 5
Within the Explorer Window and the Action Window, you can go through multiple options using the Navigation Tabs. As you go through this guide, you will become increasingly familiar with how these work together. 6
Sections, Pages and Containers Three important concepts - Sections, Pages and Containers - need explanation before beginning content management with Shado. Sections A Section is a holder for Pages and other sub-sections. Sections are often referred to as circuits. An individual Section can only have one parent Section but can be moved from section to section easily. Pages Pages contain content the end-user of the site sees. Pages use templates to provide layout. Pages are made up of Containers to organise chunks of content. Pages are grouped within sections. Containers Containers are dynamically driven blocks of content that can be added to pages. One container can be used in many pages within the site. Containers can contain text, HTML, images and can be edited in-line or via Shadow CMS Admin. Behaviours can be embedded in Containers to add dynamic functionality to images and files. 7
The Site Tree The Site Tree is the first element on the Menu Bar. It is the core navigational method for getting around Shado. The Site Tree allows users to perform the following functions. Create and edit Sections Create and edit Pages Create and edit Containers Add and delete pages in Sections Link and unlink containers to pages Reorder sections Search for Sections, Pages and Containers You navigate the Site Tree in the same manner as you would through a normal file system directory using Windows Explorer (or other such tool). Each element in the Site Tree has a different icon to help you identify what element you are looking at. 8
Edit Content on a Page Navigate to a page in the site tree and click on it, this will open the page properties in the right hand frame. At the top of the page properties form you will have two links, one to edit the page content and one to view the page content. If you click on the edit link it will open the page in edit mode with editable containers highlighted. Containers are dynamically-driven blocks of content that can be added to a page. Containers can contain text, html, images or files and can be edited in-line or via Shado admin. A container is simply an element of a page template. A page template can have many containers, and one container can be used in many pages or templates within a site. Changes to a container are automatically reflected on all pages/templates where that container has been used. 9
Editing Container Content The following example illustrates how containers work. 1. Select the page you wish to edit on the Site Tree and click on the Edit the content on this page link 2. In the new window that opens with the home page, click on the Edit Mode button in the Shado Toolbar. This reloads the page, and will show editable containers on the page. You should see now see the containers of the page. 3. If you click the create content link, Shado will create a new container ready for your content. 4. If a container already exists you can click the Launch Content Editor link. The page will refresh and open the container for editing in an editor on the page. The editor is like a standard wordprocessing program. You will also see the container colour change from blue to yellow. 5. You can add/edit content in containers. Clicking the commit button will save the container and submit changes for approval/publishing. 6. To view the page created, click on the URL link in the Action Window. This will open the page in a new window/tab in the default layout of the site. 10
7. Since you are logged into Shado Central (in another window/tab), you will also see an Admin Toolbar bar at the bottom of the page. You have now learnt to create a new section, browse to it in the Site Tree, and preview what the home page of the section looks like. 11
Working with Sections Adding a Section 1. Click on the root section in the Site Tree. In this example the root section is Home 2. You should see the properties of the root section in the Action Window. 3. Above the properties for the section you see a navigation menu with tabs. Click on the New tab and in the drop down menu click Create New Sub-Section. The action windows should refresh and ask for Name, Title and Description etc. 4. Type in a name for the section. You will see that the title field is automatically filled with the name of the section. Fill out the remaining mandatory fields and click save. 5. The action window will now refresh and you will see the new section that you have added in the Site Tree 6. Click on the plus symbol next to the section you have created in the Explorer Window. The tree will now expand, and you will see a page named after your section. This is the default page for the section. It is created automatically by Shado and is always created for every new section. 7. Click on this page, you will see the properties for this page in the Action Window. 12
Editing Section Properties Sections have properties associated with them. For example, a section has a name, title, description, and so on. You can edit these or other properties in any section in the Site Tree. To change the properties of a section, navigate to the section (by clicking on the plus symbols in the Site Tree) and selecting the section by clicking on it. This brings up all the properties of the section in the Action Window. Change the value of any property you wish to change and click the Save button. Deleting a Section: For advanced Editors & Publishers To delete a section, navigate to and select the section or sub-section to be deleted in the Explorer Window. Click the Delete button in the Action Window. The recommended option is to set pages to inactive. This will effectively remove the page from your audience but keep it in Shado for later changes 13
Working with Pages Shado is designed to be page-centric. Pages are the main building blocks of a site built in Shado. Pages are grouped within Sections, and make use of Templates to control the look and feel. Templates have layout containers which provide places for content or dynamic code to be displayed. Adding a Page A new page can be added by carrying out the following: 1. In the Site Tree, select the section or sub-section to which you want to add a new page to. This brings up the properties of the section in the Action Window. 2. Click on the New navigation tab and in the sub-menu click Create New Page 3. Fill out the details for the page, Name, Title, Browser Title etc. 4. To preview or edit the newly created page click on the link in the Action Window. 14
Editing Page Properties Pages have properties associated with them. For example, a page has a name, title, description, keywords and so on. You can edit these or other properties for any page from the Site Tree. Generally the default settings for a page will get you going. You can of course change templates and re-order the page from here as well, however it is recommended to reorder pages by right clicking (Windows, or control clicking on a Mac) on the page in the Site Tree. See Screenshot below. In the page properties Action Window (as above) you can hover over the (?) icons for help text. Change the value of any property you wish and click the Save button. 15
Controlling Page Layout Page Templates control the layout of a page and separate the design from content, a drop-list container of the page templates can be viewed in the page properties. In most cases you will not be able to change the template; this is to maintain a standard look and feel of all WebPages across Massey University. Deleting a Page To delete a page, navigate to and select the page to be deleted in the Explorer Window. Right click the page in the Site Tree and select delete. Ideally you should never delete a page, if you no longer wish for a page to appear in your section you can make it inactive. You can do this by clicking the radio button in the Page Summary/Properties window. 16
Adding files into Shado Digital Assets (Formerly FMS) Digital Assets (FMS) is a file repository system within ShadoMX. All files that will be user as content on the Massey site, such as documents, images and media, must first be uploaded to Digital Assets. Once a file is uploaded to Digital Assets, the files are controlled by FMS on the ShadoMX server. Folders and sub-folders can be setup, and each file can have attributes applied and maintained. Using Digital Assets Navigating around Digital Assets is similar to navigating the site tree. In Digital Assets it s called the document tree. The Digital Assets document tree displays folders and files for a given file store, which is usually set to default. Only folders and files that the user has permission for will be displayed. The document tree consists of a standard folder set up for each web section. The standard folders are documents, images, media, and other. Sub folders can be created under each of the standard folders. When a folder or file is select on the document tree, the properties for the item selected are shown in the properties panel in the explorer window. 1. From the Shado drop down menus select Digital Assets 2. Navigate to the correct folder in the Root Folder Site Tree 3. If you have documents already loaded in Digital Assets you will see a list of documents. If you click the link to the document you will be presented with the properties associated with it.
4. If you click on a document in the Digital Assets document list you will be presented with the file s properties. This remains largely unchanged from Shado 7. If you are already familiar with Shado you should recognise many of the options presented to you. Important note: When uploading an image, the image pixel size should be no larger than 800 x 600 with a resolution of 150dpi. If the file will be used as a thumbnail pop up, both the original image plus the smaller file that will be used as the thumbnail (with _thumb ) needs to be uploaded into the same Digital Assets directory, e.g image1.jpg, and image1_thumb.jpg. Click on the folder name the item is to be added to e.g. help Note the action window will display four tabs. Files, Folder, Upload File and Create Sub Folder. It is a good idea to separate out your files based on file types, images in one folder documents in another. When you have selected the folder you want your file to be uploaded to click Upload File 18
Click the Upload File tab you should be presented with the upload tool as below NOTE: The bulk upload tool will only work if you zip your files first. For upload of several files at once use the web apps drop down menu. 19
Inserting files into a Shado page 1. Navigate to your page in the site tree 2. Open the container you wish to add the file to 3. In the Shado toolbox select the insert/edit file option 4. A new window will pop up. 5. Navigate to the folder in Digital Assets where you uploaded your file/s 20
6. Click the file name (this is a link) you will be presented with the attributes of the file along with an insert file button. 7. When you click Insert File you will be taken back to the container. You should see the icon of the file in your container. The icon will change depending on the file type. The icon will be displayed in Digital Assets before you insert the file. In the above example a PDF was used with a red and white icon. Document Icons PDF: Word: Excel: Rich Text: Misc Flash: Executable File: Image Icons GIF: JPEG: PNG: 21