title  · web view\\isad.isadroot.ex.ac.uk\uoe\user\sarah\cms\training\trainers guide nov...

21

Click here to load reader

Upload: phungtruc

Post on 23-Jul-2018

212 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Title  · Web view\\isad.isadroot.ex.ac.uk\uoe\user\SARAH\CMS\Training\Trainers Guide Nov 2012.docx1. ... The images are held in the Media Library ... Complete the Title field

Title Web Development: Introduction to Terminal Four (T4) v 7 Site Manager WebCMS PP

Domestics Toilets In case of a fire alarm/emergency – left out of the room and towards the Queens car park. Breaks/refreshments

Objectives

By the end of this session you will (with reference to your notes): Understand the menu set up of Site Manager Be able to create a new section (= page) add content to a section using templates for different types of content (= words, pictures and links) edit and modify content, add tables and links format content re-use existing content (mirror, duplicate, move) approve content use the Media Library

PP

Range

2 hoursWe will look at: The basics of using Site Manager Existing templates We won’t be addressing individual issues regarding website – these should be addressed directly to the

Web Team

Need By completing this workshop, individuals will be able to add content to their sections of the new website.

Interest Show an example of the new web site (eg: http://www.exeter.ac.uk/working/prospective/vacancies/)Point out the different parts of the page (see diagram)

Website

Interest (cont.) Look at the Site Manager file structure and point out how this relates to what is seen on the website. Site

Manager

/tt/file_convert/5b54ccfe7f8b9a5a578dbc79/document.docx 1

Page 2: Title  · Web view\\isad.isadroot.ex.ac.uk\uoe\user\SARAH\CMS\Training\Trainers Guide Nov 2012.docx1. ... The images are held in the Media Library ... Complete the Title field

/tt/file_convert/5b54ccfe7f8b9a5a578dbc79/document.docx 2

Image with captionThese are always positioned in the same place with shaded caption below

Breadcrumb TrailThis is automatically generated from the site structure (demo as move from Home, through Working here to this page)

Navigation MenuThis is automatically generated from the site structure

Page HeadingThis is always ‘Heading 1’ formatting is automatically generated

ContentThe main text on the page can be created as one piece of content or multiple pieces.

Sub-headingsThese should always be used in order; these will be ‘Heading 2’

More Sub-headingsThese are subheadings of a ‘Heading 2’, so will be ‘Heading 3’

Page 3: Title  · Web view\\isad.isadroot.ex.ac.uk\uoe\user\SARAH\CMS\Training\Trainers Guide Nov 2012.docx1. ... The images are held in the Media Library ... Complete the Title field

Show group around Site Managerhttps://content.exeter.ac.uk/terminalfour/SiteManager

/tt/file_convert/5b54ccfe7f8b9a5a578dbc79/document.docx 3

Font size Dashboard Username Search for specific content

Logout

Top menu

Grey toolbar

Current action

Current location & path

Sections – click + to expand

Section menu displays on hover over arrows

Approved, Pending, Deleted

Dashboard information

Hide left hand columns

Page 4: Title  · Web view\\isad.isadroot.ex.ac.uk\uoe\user\SARAH\CMS\Training\Trainers Guide Nov 2012.docx1. ... The images are held in the Media Library ... Complete the Title field

Stage 1 Create a new section – page 6A Section is the folder – similar to directories and folders in Microsoft Explorer.Create a new section: Hover over the arrow next to the section you’re going to add your new section to and click ADD

SECTION On the GENERAL Tab complete the NAME (use sentence case) Kathryn’s home page Enter the Output URI (shortened name for the URL) Kathryn If the ‘Show in navigation’ check box is unchecked the section name will not appear in the navigation Click ADD Returns to the Site Structure screen – section added. Make sure to tell them NOT TO REFRESH THE SITE STRUCTURE PAGE when they are adding

their subsections to the main section for the session. Instead show them how to close the folder for this training session and reopen using the plus and minus signs.

Questions Any Questions?

/tt/file_convert/5b54ccfe7f8b9a5a578dbc79/document.docx 4

Page 5: Title  · Web view\\isad.isadroot.ex.ac.uk\uoe\user\SARAH\CMS\Training\Trainers Guide Nov 2012.docx1. ... The images are held in the Media Library ... Complete the Title field

Add content to a section – page 7Add content to a section: Click the arrow and click ADD CONTENT

TemplatesThere are different templates currently available: ‘Page with no Feature Image’ is used as the initial page; it has a heading. ‘Image with Caption’ is used to add content which is an image with a caption. ‘Page’ is used to add text content to a page. ‘Page with Feature Image’ is used, in the main, for title/introductory pages.Note: those available to individuals will depend on their College/Service/Area – the list may increase according to demand. Any queries relating to the need for additional templates should be directed to the lead in the College/Service in the first place, who will liaise with the Web Team.

/tt/file_convert/5b54ccfe7f8b9a5a578dbc79/document.docx 5

Page 6: Title  · Web view\\isad.isadroot.ex.ac.uk\uoe\user\SARAH\CMS\Training\Trainers Guide Nov 2012.docx1. ... The images are held in the Media Library ... Complete the Title field

Continue with adding content… Select the Page with no Feature Image template Complete NAME & HEADING (use sentence case) Formatting text in Site Manager Type content into the MAIN BODY Headings are styled centrally and applied to the web content

automatically, but you have to mark them up as headings in Site Manager by selecting the appropriate heading level from the drop-down formatting menu.

Click PREVIEW to preview your work (opens in a new browser window) Close the browser window Click ADD to save your work or you can choose SAVE AS DRAFT if you’re not ready for the work to be

approved. Click ADD AND APPROVE if you are happy it is complete and want it to be published in the live site with the next scheduled publish.

Approving content, page 13: you will see the ADD AND APPROVE/UPDATE AND APPROVE unless your content is subject to a workflow, when you won’t be able to approve your own content, and another person is designated the Approver for that section.

You will be taken to the Content tab in the Section.

Note: Publishing to the live site is done automatically every 12 hours, early morning and early evening – scheduled by the Web Team.

Questions Any Questions?

/tt/file_convert/5b54ccfe7f8b9a5a578dbc79/document.docx 6

Page 7: Title  · Web view\\isad.isadroot.ex.ac.uk\uoe\user\SARAH\CMS\Training\Trainers Guide Nov 2012.docx1. ... The images are held in the Media Library ... Complete the Title field

Stage 2 Add further content – page 9Add further content using the Add Content button on the Content screen within the Formatting Text section – we’re going to be playing with the formatting menu (page 13) so make it something that you can make bold, italic and use bullets and/or numbers for. On the CONTENT Tab, click ADD CONTENT Select the Page template Complete NAME (use sentence case) Bold and italic

Add Content … Bold and italic (Heading 2)In main text, use bold and italic very sparingly and only to create emphasis. o Italic can be useful for light emphasis of a single word, short phrase, or for titles of books or articles;o bold can be effective for stronger emphasis of single words or phrases. o Avoid the use of both styles together, as it significantly reduces the legibility of text on screen.Neither style works well on whole blocks of text on screen as it makes them less readable, so do avoid applying them to whole paragraphs.

Preview (note how the new content has gone below the original content) & Add to save

Modifying content – page 11To edit and modify content that you have already created, navigate to the section and choose modify content from the section drop down menu. Click on the arrow next to the content drop down and choose modify.You can then update your content and save by clicking on Update.

/tt/file_convert/5b54ccfe7f8b9a5a578dbc79/document.docx 7

Page 8: Title  · Web view\\isad.isadroot.ex.ac.uk\uoe\user\SARAH\CMS\Training\Trainers Guide Nov 2012.docx1. ... The images are held in the Media Library ... Complete the Title field

Add a new Sub Section under your home page (Tables) – page 17

Tables – p18

From the Site Structure page, add a new Subsection under your homepage Section Hover over the arrow and click ADD SECTION On the GENERAL Tab complete the NAME (use sentence case) Tables and links Complete the URI (tables) Click ADD Returns to the Site Structure screen – section added. Hover over the arrow and click ADD CONTENT Select the Page with no Feature Image template (we’ll look at the templates later in the session) Complete NAME Tables & HEADING – use Sentence case Tables and links Add Content …, this time we will be adding a table: Add a subheading (level 2) TablesDates Type Course20 March 2012 IT Skills Excel 2007: Organising and Managing Lists28 March 2012 IT Skills Word 2007: Mail Merge27 June 2012 IT Skills Excel 2007: More Formulae and Functions

Preview & Add to save

Note: to update the table click on the table then click on the insert new table button again, the properties can then be updated.

Questions Any Questions?

/tt/file_convert/5b54ccfe7f8b9a5a578dbc79/document.docx 8

Page 9: Title  · Web view\\isad.isadroot.ex.ac.uk\uoe\user\SARAH\CMS\Training\Trainers Guide Nov 2012.docx1. ... The images are held in the Media Library ... Complete the Title field

Add links to content – page 19 On Tables and links click on Modify On the CONTENT Tab, click ADD CONTENT Select the Page template Complete NAME – use Title case: LinksExternal linksIn the Main Body type: Type the subheading (level 2): Links Add an External Link: The Plain English Campaign describes plain English as: ‘a message, written with

the reader in mind and with the right tone of voice, that is clear and concise’. Open up the http://www.plainenglish.co.uk website window Copy the URL Click back to the T4 window Select the link text (go from back to front of the text) Click on the link button (note: the remove link button is adjacent) Paste your copied URL into the Link field PREVIEW Click ADD to save

/tt/file_convert/5b54ccfe7f8b9a5a578dbc79/document.docx 9

Page 10: Title  · Web view\\isad.isadroot.ex.ac.uk\uoe\user\SARAH\CMS\Training\Trainers Guide Nov 2012.docx1. ... The images are held in the Media Library ... Complete the Title field

Section Link (page 21) – you can link to internal sections in the same way as for an external link, but if the destination address changes, the link will be broken, by using a section break, the links will be updated if they move. If they are removed a message will be given to the person deleting the link notifying them that links will be broken. Go back into the Modify Content Click the Insert Section Link button – this shows the whole site structure Navigate to the Key Themes section in Research Click Key Themes PREVIEW

Email address links (not in the guide) Email address – type in the text you want to have as the link text; select the text and click on the ‘insert

web link button’; type in mailto:and then the email address - mailto:[email protected], then click OK PREVIEW – when you hover over each of the email addresses it shows where it ‘links to’ in the bottom

right of the screen. UPDATE to save

Questions Any Questions?

/tt/file_convert/5b54ccfe7f8b9a5a578dbc79/document.docx 10

Page 11: Title  · Web view\\isad.isadroot.ex.ac.uk\uoe\user\SARAH\CMS\Training\Trainers Guide Nov 2012.docx1. ... The images are held in the Media Library ... Complete the Title field

Cutting and pasting content from other sources – not in guide, but see Web Support pages http://www.exeter.ac.uk/staff/web/sitemanager/guides/pasting1/http://www.exeter.ac.uk/staff/web/sitemanager/guides/pasting2/ Many of you will have your content ready to go in Word documents. When pasting content from other

sources it can bring with it all different types of coding, this can make the formatting look strange in the CMS. To ensure it does not do this, content being added to the CMS should be pasted as plain text using the past as plain text button.

NAME – Pasting text Heading level 2: Pasting text OPEN the page http://bitly.com/exetert4, download the Word document, select all and copy/paste as

normal into the text box. PREVIEW Now click the UNDO button, then click the paste as plain text button Paste the text again PREVIEW

Questions Any Questions?

Break

/tt/file_convert/5b54ccfe7f8b9a5a578dbc79/document.docx 11

Page 12: Title  · Web view\\isad.isadroot.ex.ac.uk\uoe\user\SARAH\CMS\Training\Trainers Guide Nov 2012.docx1. ... The images are held in the Media Library ... Complete the Title field

Media Library – p39The images are held in the Media Library – all documents, images and files to be accessed from the Website are stored here. Uploading: Use a document from your memory stick as an example and put it in the documents folder in the Media LibraryContent MenuMedia LibraryNavigate to where it should be savedClick on the Add New Media buttonComplete the fields (don’t worry about the Thumbnail one)Click on the Add button.Get them to download to their desktop an image from the web or from the Media Library to use for practice.Then just demo adding a document to the Media Library.Using as document links in ContentNavigate to some Content – eg Links.

Click on the Insert Item from Media Library Icon Navigate to where it is saved in the Media Library.Click on the description & it will be inserted.The link text will automatically be displayed. The change this, right click the link text, enter the text you wish to be displayed and click update.

Questions Any Questions?

Adding Images to your Content (Using the Image with Caption template and the Media Library) – page 43

/tt/file_convert/5b54ccfe7f8b9a5a578dbc79/document.docx 12

Page 13: Title  · Web view\\isad.isadroot.ex.ac.uk\uoe\user\SARAH\CMS\Training\Trainers Guide Nov 2012.docx1. ... The images are held in the Media Library ... Complete the Title field

From the Site Structure, navigate to one of your Sections Click Modify Add Content Select the ‘Image with caption’ Template Complete the Title field – put your own name and image as the name for training purposes Kathryn

image Add an image from the Media library Add caption text PREVIEW: NOTE: the preview function does not show the image and caption ... it is there and will

show when the content is added. ADD PREVIEW

Questions Any Questions?

/tt/file_convert/5b54ccfe7f8b9a5a578dbc79/document.docx 13

Page 14: Title  · Web view\\isad.isadroot.ex.ac.uk\uoe\user\SARAH\CMS\Training\Trainers Guide Nov 2012.docx1. ... The images are held in the Media Library ... Complete the Title field

Stage 3 Re-using existing content – page 32There are 3 ways of re-using existing content: Mirror Duplicate MoveFor each of these you use the principle that you go to the content you want to Mirror/Duplicate/Move, pick it up and put it where you want it to end up.Mirror Open up one of the participants Sections and select content to Mirror – note the grey message bar at

the top of the screen that guides your actions. Mirror the content in the Kathryn Section

NOTE: the screen will remain on the original Section – show the snowflake icon Navigate to the Kathryn Section – show the snowflake iconDuplicate Open up one of the participants Sections and select content to Duplicate Duplicate the content in the Kathryn Section

NOTE: the screen will remain on the original Section – no snowflake Navigate to the Kathryn Section; open up the new section Modify the Section PREVIEW ADD Navigate to original section – show that no changes have been madeMove Open up the Kathryn folder and select content to Move Move the content to a participant’s Section

NOTE: the screen will remain on the original Section Navigate to the participant’s section and show it moved. PREVIEW ADD

/tt/file_convert/5b54ccfe7f8b9a5a578dbc79/document.docx 14

Page 15: Title  · Web view\\isad.isadroot.ex.ac.uk\uoe\user\SARAH\CMS\Training\Trainers Guide Nov 2012.docx1. ... The images are held in the Media Library ... Complete the Title field

Questions Any Questions?

Moving Sections & Subsections – page 25SECTIONS: You can move a section in your Site Manager in 2 ways

1. Drag & drop (click, drag and let go of mouse)2. Through the section drop down menu

Click the arrow next to the Section you wish to move Click Move Then click your mouse where you want the section moved to.SUBSECTIONS: page 26 To change the order of Subsections, click Modify on the top level Section. Click on the Subsections Tab Use the Move buttons to move your Subsection.

Questions Any Questions?

Deleting Content – page 28 NOTE: check with your Web Marketing Officer as you may have internal processes for this. To delete a Section or Content, hover over the section drop down Arrow and select DELETE SECTION

or DELETE CONTENT. You will receive a message checking that you really want to delete the Section, click OK. You will see that that Section is now red in colour. It will still be visible in your Site Structure until the

Web Team clear the deleted items, which occurs once a week every Friday afternoon. Deleted items can be reactivated if they have not been cleared by click on the down Arrow for your

Section and clicking MODIFY. The Status should then be changed to Pending or Approved (depending on your level of authorisation) Note: If one of your links has been deleted it will be surrounded by a red box. IMPORTANT: Emptying Recycle bin: once the Recycle bin is emptied by the Web Team, any

deleted content cannot easily be retrieved. Do not mark any sections or content as ‘Inactive’ if you want to keep it – ‘Inactive = ‘to be killed off’.

If you want to retain unused content or sections for reuse later, create a Pending section and move such material into there. ’Pending’ sections will not be removed, and no content in them will be published, even if it is Approved.

Show how to make a Pending section by marking it Pending from the Status drop-down.Questions Any Questions?

/tt/file_convert/5b54ccfe7f8b9a5a578dbc79/document.docx 15

Page 16: Title  · Web view\\isad.isadroot.ex.ac.uk\uoe\user\SARAH\CMS\Training\Trainers Guide Nov 2012.docx1. ... The images are held in the Media Library ... Complete the Title field

ACTIVITY

Consolidate Learning Add a new section Add content using the Page without Feature Image Add further content in the form of an image with Caption (use the Image with Caption template) Modify your content to include a table and a link Mirror a piece of content from a colleague’s Section (or elsewhere in yours)

Questions Any Questions?

/tt/file_convert/5b54ccfe7f8b9a5a578dbc79/document.docx 16