1.Getting Started 2.Modifying Design 3.Page 4.News 5.Events 6.FAQ 7.Photo Gallery 8.Webform 9.Newsletter Index Training Oct 25 th 2011

1. Getting Started2. Modifying Design3. Page4. News5. Events6. FAQ7. Photo Gallery8. Webform9. Newsletter

Index

Training Oct 25th 2011

Training for ESF Schools Website


2

1

Log into CMS

To edit your school website, add “/user” to the URL (1) and you will see a login promptEnter your username and password to enter the CMS (2)


4

14

2

3

6

5

7

Site Overview

In the center of the homepage, we’ve setup a panel which consists of 2 content types:1)Display news record page node (list by date)2)Display content partial content from a page by teaser3)Photo Gallery – Display all existing galleries from the website with first image as thumbnail

On the left and right side of the homepage, there are different type of blocks:4)Search Block5)Calendar Block6)Display ESF logos7)Quick links Block


5

Administer Overview



7

Panel Setting

12

1) Page displaying 3 blocks in this panel2) To disable a block in the panel, simply click on the right top corner of the block and select “disable”3) User may also rearrange the order of the blocks by drag and drop4) Press save in order to apply changes


8

Block Setting

1

2

3

1. List of active blocks2. To arrange the block location, simply select from the menu and saved.3. To configure a block – click “configure” next to the block that you want to edit


9

Block Setting

1

2

1) Block content – ie. Esf logos (this require html knowledge)

2) Visibility setting – display block on specific pages


10

Centralised news block

1) This image can be reached under Administer -> Site Building -> Blocks

2) There is a block called [centralised_news_listing: ESF Announcements (block)]

3) Select the Region you wish for this block to appear in the ‘Region’ drop down menu

4) Click on ‘Save blocks’ at the bottom of the list to save changes


11

Centralised news input

1) This image can be reached under Create content -> Centralized News

2) Input the Title of the news in the ‘Title’ field

3) Input the content you wish to display in the ‘Body’ editor

4) Click on ‘Save’ at the bottom of the page to output the news



Create/Edit page

1

2

1

2

3

4

5

6

Once you logged in, you will see your username on the left panel.

To create/edit a page, 1)From the editor menu, select Create content>PageThere are 9 important features on a page

2)Title – Page title

3)Menu title - title to appear on the menu

4)Parent item – where you want to locate this page according to the primary menu

5)Image upload – image will locate by default to the right side of the body page


14

Create/Edit page

7

8

9

6 6) Body – Wyswyg editor page body

7) File attachment – upload files to the server and link files for display on page or as download list

8) Publish options – Published page will go live and public. Promoted to front page or sticky at top of lists are settings for order list.

9) Save / Preview – content will not be updated until the save button is clicked


Add images on to a page

1

2

1) To add an image on top of body content, click on the ‘Browse…’ button. A prompt box ‘Choose File To Upload’ will appear for you to select an image from you hard drive.

2) Once you click ‘Open’, you may see the file link appear next to the ‘Browse…’ button. Click on the ’Upload’ button to upload the selected image and you will see the image being loaded onto the page. Scroll down to the bottom of the page to ‘Preview’ or ‘Save’ the changes.

1) Browse images from computer2) Select an image and click ‘Open’ and ‘upload’


Add images on to a page

4

3

The default setting allows you to upload two images, but you may also upload additional images onto the page. Simply click on the ‘Add Another Item’ button, an add image row will appear. Once you have complete adding another item, scroll down to the bottom of the page to ‘Preview’ or ‘Save’ the changes.3.Click ‘Upload’ button to upload selected image onto the page4.Click ‘Add Another Item’ button to add more imagesTips: The maximum file size for each image is100 MB and it only allow the following image formats: jpg jpeg png gif


Remove image from page

1

To remove an image that has been uploaded onto a page, simply click on the ‘Remove’ button next to the image that you want to remove. Once image is removed, scroll down to the bottom of the page to ‘Preview’ or ‘Save’ the changes.

1.Click ‘Remove’ button to remove image from page


Wyswyg editor

1

To edit text, simply use the wiki editor. It is very similar to any other text editor. Once changes have been made, scroll down to the bottom of the page to ‘Preview’ or ‘Save’ the changes.

1)Edit text content with text editor


Add URL

1

2

To add URL onto content, selected and/or type in text for link. Then click on ‘Insert/Edit Link’ button, a URL prompt box will appear. Simply enter the URL and click ok. Once changes have been made, scroll down to the bottom of the page to ‘Preview’ or ‘Save’ the changes.

1)Enter and select text to link•Click ‘Insert/Edit Link button


Attach file to page

12

3

The file attachments function lets you attach file(s) and download in a list. To do that, simply click on the ‘Browse…’ button then click on the ‘Attach’ button to upload files to the list. Once changes have been made, scroll down to the bottom of the page to ‘Preview’ or ‘Save’ the changes.

1)Click ‘Browse’ to select files from computer

2)Click ‘Attach’ to attach selected file


Delete file from list

1

2

Once you logged in, you will see your username on the left panel.To edit a page, simply navigate to the page you want to edit, and then click on the ‘Edit’ tab.

1)Check the ‘Delete’ box to select file for deletion

2)Click ‘Save’ to save changes made to attachments


Add image to page

1

1

1. Browse and Attach image to list


Add image to page

2

You may also add images to body text. First you need to upload the image file using the ‘Attach Files To List’ function. Once the image file is uploaded, there is a URL beneath it. Select and copy the image URL and click on the ‘Insert Image’ button. An image properties prompt box will appear. Then you may paste the URL and enter image properties and click ‘OK’. Once changes have been made, scroll down to the bottom to ‘Preview’ or ‘Save’ the changes.

•Browse and Attach image to list•Select image URL


Add image to page

3

4

4

5

3. Click ‘Insert Image’ button

4. Enter image URL and settings

5. Click OK


Paste text from word

1

If you have a document with a large amount of text to be imported or copied to a page, you must use the ‘Paste From Word’ button. This is to avoid inappropriate codes embedded into the html source which would cause strange formatting.

1) First you select the text from your document then place the cursor to where you want to insert text in the editor. Then click on the ‘Paste From Word’ button, a prompt box will appear. You may press ‘Ctrl+V’ on your keyboard to paste the selected text then click ‘OK’. Once you’re happy with the text, scroll down to the bottom of the page to ‘Preview’ or ‘Save’ the changes.

•Select text from WORD



2

3

2. Click “Paste from WORD’ button

3. Press ‘Ctrl+V’ to paste text and Click ‘OK’



4

4. Click ‘Save’ to save changes made to attachments


28

2

1

3

4

5

6

Create anchor link on page

1) Click on the Anchor icon on the wyswyg editor2) Create a link destination3) Select from the index when you want to link from4) Click on ‘insert/edit link’ icon5) Pop up window appear, select link type ‘Link to anchor in

the text’6) Select anchor name and press OK7) Save the page



30

Create News

1

A news, is ideal for creating and displaying news content that informs or engages website visitors. By default, a news entry is automatically featured on the site's initial home page.

To create news on your website,

1)Click on ‘Create Content’ then click ‘News’


31

Create News

1

2

3

Once you have enter the Create News page,

2) Enter a Title for the Event. i.e. This is the latest News.3) Enter News content in the ‘Body’4) Scroll down to the bottom to ‘Preview’ or ‘Save’ the changes.


32

5

Create News

A ‘New Event’ has been created and the record appears on the News List



34

Create an Event on Calendar

1

To create a new event on your calendar1)Click on ‘Create Content’ then click ‘Event’


35

Create Event

1

2

3

1) Enter Event title – it will be display as teaser below the calendar

2) Date entry – set the event date by entering from and to date or even time, user can also create recurrent event and set exception dates

3) Body – description of the events

4) Press save in order to complete creation


36

comments

- Almost every content will contain a ‘Comment settings’

- IMPORTANT, In general it is advised to keep this option disabled as it allows normal user to comment on a page. This could result to heavy moderation requirement as well as inappropriate text appearing on your page



38

Manage the ordering of questions

1) This page is under Create Content -> FAQ

2) Through this page you will be able to create additional question to add to the existing FAQ

3) Fill in the Question field, Answer field and click on the ‘Save’ button at the end


39

Manage the ordering of questions

1) Click on ‘Frequently Asked Questions’ on the admin menu

2) Left click and hold on the + symbol next to each question

3) Drag and drop the menu to the desired order



41

Create a Photo Gallery

1

A photo gallery is a collection of images/photographs maintained by a user. To create a photo gallery on your website, you need to add images into the gallery

1)Click on ‘Create Content’ then click ‘Gallery’


42

Create Gallery

3

1

2

To create a photo gallery1)Enter a title for the gallery

2)Select parent item from the menu settings to indicate where you want to locate this gallery

3)Click on the image icon to start mass upload photos from your computer to the website


43


4

5

4) Click on ‘Add Photo’ to create new photo

5) On the create photo page, Enter a Title for the photo


44


6

7

8

6) Click on ‘Browse’ and A prompt box ‘Choose File To Upload’ will appear for you to select an image from you hard drive.

7) Once you click ‘Open’, you may see the file link appear next to the ‘Browse…’ button. 8) Click ‘Upload’ button to upload image onto the page.


45

9


Scroll down to the bottom to ‘Preview’ or ‘Save’ the changes. Now image 1 – creek has been added to your New Gallery



47

Creating the form

1) In the admin panel, click on Create Content -> Webform

2) This page is to create the basis of the Webform. Please fill in the Title at least before pressing ‘save’ at the bottom of the page.


48

Various kinds of responses

1) In the webform page, underneath ‘Webform’ a list of field category can be created

2) If there are more then 1 field, the + symbol on the left of the table allows you to drag and drop to change the order of the field

3) Input the name of the field

4) The dropdown menu allows you to specify what type of input is required by the user

5) If this field is compulsory to completing the field, click on the ‘Mandatory’ checkbox

6) Click on the ‘Add’ button to add the field



Create Newsletter Issue

1

To create Newsletter Issue, click on ‘Create Content’ on the left panel a list of content types with descriptions will pop up. Scroll down to the middle of the list and click on ‘Newsletter Issue’. (1)

Click on the ‘Title’ box and enter a title for the Newsletter i.e. January 2010. Under the ‘Newsletter drop-down menu’, select the appropriate group/list of receivers i.e. Bradbury School Newsletter.



1

2

1) Enter a title for the newsletter2) Select recipient list & roll group3) You must also select a newsletter from the dropdown box



4

4) Next, click on the template buttons, and a set of default templates will appear in a box for selection, double-click on ‘Newsletter’ template, which we have created for you in advance.



5

5) Once the template is loaded, you may start to add, remove or edit the contents or pictures you want. When you are done with the changes, scroll down to the bottom of the page to ‘Preview’ or ‘Save’ the changes.


Testing Newsletter

6

6) Always send a test to your email to ensure the layout


Testing Newsletter

7

7) Save content and send test


Testing Newsletter

8

8) System indicate the test newsletter is send to your email

You may send a newsletter or a test newsletter by selecting the appropriate radio button and submitting the text. This way, you can view what it is like from a receiver side and make sure it is how you want it to be. After that, scroll down to save and send mail for test. Next you will see a preview of the newsletter you created, there is some information about where the test mail was sent to, name of publisher and the last modified date…etc

You may also log onto you email account and double-check the layout and content.


Testing Newsletter

9

9) Some settings for the newsletterSent issues – shows sent & pendingDraft issues – issue saved that has not been sentNewsletter – list of available newsletters Subscriptions – manage subscription list including mass subscriptions or removeStatistics – shows the open, click through rate, generic bounce rate


Newsletter Statistics

10



11

11) To view the newsletter statistics, click on ‘Administer‘ on the left panel then click on ‘Statistics’. Here you can view the open rate of each newsletter. If you click on ‘Details’, you will see who has opened the newsletter and how many times that person has opened it.



12

12) You can also track the newsletter click details, by clicking on ‘Newsletter clicks’ tab. Here it shows which link user has linked to, who the user is by email address and when was the link being clicked.



13

13) To check Newsletter bounce rate, simply click on ‘Newsletter Bounce’ tab. Here it shows which user is experiencing bounce back on a particular newsletter by Subject, email and date/time.


62

Mass subscribe

14) You may also mass subscribe a list of emails to a newsletter. (additional to the Maze database)

Documents

1.Getting Started 2.Modifying Design 3.Page 4.News 5.Events 6.FAQ 7.Photo Gallery 8.Webform 9.Newsletter Index Training Oct 25 th 2011