Content Management System

This is draft 1c of this document

check www.tvcm.co.uk/docs/cmsms.pdf for latest version
1. Logging on
i. go to your website www.yoursite.co.uk (or whatever)
ii. add the word /admin on the end of the address www.yoursite.co.uk/admin
iii. enter the username and password you have been given and you will now be in the
administration area of your website.
iv. It's handy to have another browser window open on your website so if you have a
browser that uses tabs, right click on “View Site” (at the top) and select “open in new
tab”. Alternatively open a new browser and go to www.yoursite.co.ukHYPERLINK
"http://www.yoursite.co.uk/" this way you can switch between viewing and editing your
site

2. My Preferences – My Account
i. If this is your first time on the site the first thing you should do is click on “My
preferences” and then “My Account” and here you can change your username and
password and add other details like your name and email address.

3. Create New Page or Edit and Existing One

i. Now go to CONTENT >>> PAGES – you will see all the pages you could edit by
clicking on them – be careful !
ii. Click on “Add New Content”
a) Content Type = CONTENT (there are other options but this is nearly always the one)
b) Title – this is the title that appears at the top of the new page.
c) Menu Text – this is what appears in the left hand menu to link to your page
d) Parent – this means your page can become a subpage (or child) of any the main
pages in the left hand menu bar. If this is what you want choose a parent page.
e) If you want to create an “orphan” page, that is a page not appearing in the menu bar
as a main item or a sub-item then go to options at the top and untick “Show in
Menu”. You will still be able to link to this page from other pages on the site.
f) Back on the MAIN menu – choose a template from the drop down list for your page.
g) You can change any of the above items by editing the page later.
iii. Finally enter your text or story in the big box. This is a WYSIWYG editor so you can
change fonts and colours and stuff but don't go wild or your site will lose consistancy.
iv. You can add links to your story or article.
a) An internal link. This is a link to page on your website such as the orphan page
described above. The best way to find the button to do this is to slowly scroll along
the buttons at the top of the WYSIWYG editor until you see “insert CMSMS link” -
click on that button. You will be presented with a list of pages you could link to.
Choose one and click INSERT.
b) An external link. First type some text such as “click here”. Select it. You will see a
chain link icon next to the one you just used will now be clickable. Click on it. Now
you can enter the web address of the web page you want to link to. Click INSERT.
c) LINK TO A FILE. (first you have to have uploaded the file – see below) Follow the
steps in (b) above but instead of the link URL click the box to the right of it. You will
now be able to browse to the file you previously uploaded. This could be a text file, a
word processor document, spreadsheet or a PDF file.
v. When you are done click on the SUBMIT button and your page will be publishe
4. Creating a News Page – news pages are different to other pages. The are dated and run in
chronological order and the headlines appear in every other page.
i. Click on “CONTENT” and instead of selecting “PAGE” as you did earlier select
“NEWS”
ii. On the next page you can click on the CATGORIES tab and enter new categories for
your news articles e.g. Movies, music, fashion, whatever
iii. Tick back on the ARTICLES tab and you'll see articles you could edit (if there are any).
Click on “ADD ARTICLE”.
iv. Give the article a title
v. Select the category from the drop-down box.
vi. You will see that unlike creating a regular page there are two content boxes. The top one
is the “teaser” or “feeder” which could a summary of the story. The second box is for the
main story. ITS GOOD PRACTICE TO ALWAYS PUT SOMETHING IN THE
SUMMARY BOX FOR DISPLAY ON THE REST OF THE SITE.
vii. You can add links, files and images just as you did in the previous section.
viii.When you are done you can click [SUBMIT] to publish your story but you may want to
follow the next step before doing so.
ix. If you tick the box “Use Expiration Date” you have further options.
x. If you ticked the box you can now enter a start date for your articles. This means you can
set a story to go live the next day or any other time. You could set a series of articles to
go live over a series of weeks. If that's all you want you could set the end date way into
the future (10 years). However you could set your end date so the article is gone after a
month or so. It will still be in the admin area for reference or editing but will not be
published after that date.

5. Uploading Files and images

i. Again we're in the CONTENT menu but there are two items that would allow us to
upload files – one is the Image Manager and the other is the File Manger
a) The File manager is best for uploading files and in fact will allow you to upload
multiple files.
b) The Image Manager will allow you to upload images but it is best for editing
images.
ii. Go to FILE MANAGER. You should start by creating new folders. E.G. One for
documents, another for audio and one for video if you are going to be uploading this
kind of file. Click on the images folder to go into it.
iii. You will see that you can upload up to 4 images/files at once. Browse for them and then
upload. Try not to upload massive pictures. They can be resized online but if they are
huge they will be hard to manage (see appendix 1)

6. Editing Images
i. Ideally images should be about 500 -600 pixels wide if they are going to fill the page
and 250 – 300 pixels wide if they are to sit on the right or left of a page with text
floating around them.
ii. Click on CONTENT >> IMAGE MANAGER
iii. Find the image you are interested in and click on the little pencil (edit) icon beneath it.
iv. You can crop, resize and rotate an image.
v. Click on resize
vi. Make sure the “constrain proportions” box is ticked and enter the width you want in the
width box. You will see that the height alters proportionately.
vii. If you are happy with the result click the green tick.
 viii.Click on SAVE. You can change the name slightly so that you retain the original or you
can save it over the original
ix. In the “Image Format” drop down list chose JPEG Medium or use the slider to the right
to set the quality to 50 or 60% then click on the green tick to finally perform the save.

7. Adding images to pages.

i. To add an image to a page you must have already uploaded it as in step (5) and prepared
it as in step (6)
ii. Now edit a page you have previously created or create a new page.
iii. Set your curser in the top left corner of the page before an of the text.
iv. Click on the TREE (insert image) icon
v. To the right of the “Image URL” box there is an icon – click on it.
vi. This will take you to your image store area, find the image you want and click on it.
vii. Now click on the APPEARANCE tab
viii.Use the ALIGNMENT drop down box and select right or left alignment
ix. In the vertical space box type 10 and in the the horizontal space box type 10 this will put
a 10 pixel space around your image – you can try other values.
x. Back in the GENERAL tab type something in the image description because this is what
web browser readers will look for for sight impaired visitors. If you don't to this you will
get a warning when you insert the image which you can ignore is you so choose.
xi. Click INSERT to add the image.
xii. Click on SUBMIT to publish your page with the image.

8. Creating Image Albums

It is important that you understand there are two parts to the process involving images
on your website.

STEP 1 – Upload your images using the file manager

STEP 2 – Incorporate the image into a page or an album. The pictures you have uploaded
could be used several times on your website and included in pages and albums as you like.

Now let’s create an album (assuming you have already uploaded the pictures)

NB TO CREATE AN ALBUM YOU MUST HAVE ULOADED YOUR IMAGES VIA

THE FILE MANAGER INTO THE IMAGES FOLDER ON YOUR
WEBSPACE. IT IS ALSO RECCOMEDED THAT YOU CREATE A NEW
DIRECTORY (FOLDER) TO UPLOAD GROUPS OF IMAGES TO.

i. Whilst logged on and in the admin area of your website choose >> Content >> Photo
Albums
ii. You will see previously created albums (if you created any). These can be deleted or
edited or have extra images added. NB – deleting an album does not delete the pictures
associated with it.
iii. Click “add new album” to create a new album, Give it an appropriate name.
iv. Now you can start to choose the images that will be in your album. When you are
finished click on “save”
 ADDING IMAGE ALBUMS TO YOUR WEBSITE

There are two ways to do this

A) By creating a page do display ALL albums

I. Go to content>>>pages and create new page (Add New Content)

II. In the “Content Type” dropdown box choose “Photo Albums”
III. You can choose the Page Title, Menu Text and template to use as with any normal page
but you will also see all the available albums that you can select to appear on the
“Gallery” page.
IV. If you add new albums later you can edit this page and add your new album.

B) By Adding individual album(s) to a page.

I. Go to >> content >> photo albums

II. From the list of available albums make a note of the ID number(s) of the albums(s) you
want to dispaly

III. To add an album to one of your pages type in the following code

{cms_module module='album' albums='1,3'}

Type it exactly as shown. At the end place the album number you want to show. (in the
above example albums 1 and three would be displayed) Separate multiple albums with
commas or just enter one album. NB the brackets to use are curly brackets (to the right of
the “P” key on your keyboard.

Steve Thompson
Community Media Coordinator
Institute of Digital Innovation
University Of Teesside
T- 01642 384567
M- 07795 826953
E- s.d.thompson@tees.ac.uk
Tees Valley Community Media
http://www.tvcm.co.uk

APPENDIX 1

N.B. - there is little point of an image on a website being bigger than a 1000 or even 800 pixels
wide. You can resize the images later using the image manager but if your images are huge files
right out of a digital camera you may as well resize them somewhat as it will save time on the
upload. A good easy tool for resizing images is the Microsoft image resize power-toy
http://tinyurl.com/2yt2