Introduction to SimpleCMS

Logging in

Finding your way around

Updating a page

The Editing Interface

Inserting a Link

Uploading and Linking to Documents

Uploading and Inserting Images

Further Help

Introduction to SimpleCMS

SimpleCMS was created with one main aim: to make it simple for you to manage your own website content. What follows is a quick guide to get you started.

Logging in

Naturally only authorised users may edit content on your website, and in order to do so they need to log in.

At the bottom of your website pages there will be an admin link. Clicking on this will present you with a log in form. Enter your username and password and click OK.

Finding your way around

The admin interface will reflect the structure of your site, in that there's a left-hand navigation menu and a central content area. To edit a page, use the menu to navigate to it as usual. You'll then see the page content appear in the editing interface.

Updating a page

The Editing Interface

Anyone who has used Microsoft Word should be familiar with many of these options. Moving the mouse over each button highlights its use.

Note that many of the common formatting options such as bold, italics, left alignment, right alignment, superscript, subscript, etc. are all available.

Other common editing options such as cut, paste, undo, redo, search, etc. are also available.

If you feel that there is an option that is missing from the available buttons, try clicking on the downward pointing arrow as show below:

This displays an option to Add/Remove Buttons.

There may not be enough room to display all available options and, as such, some of the less commonly used options may be ‘hidden’.

Click on Add/Remove Buttons to display all related options, as shown below:

Inserting a Link

  • Enter some text in the editor window i.e. ‘The University of Aberdeen’
  • Select the text and then click theInsert a Link button
  • When you click, you will see a popup dialog box that comes complete with the ready for you to enter the remainder of your URL.
  • Enter the URL after the provided
  • Click the OK button

The resulting link is shown below:

Note, at the bottom of the editor, the options to add a Title: and to alter the Target: of the link. The title is what will be displayed when a user hovers their mouse over the link text. The target defines where the link will be opened. This can usually be left as 'normal', but sometimes you may wish to open a new browser window (for example, when linking to an external website).

Uploading and Linkingto Documents

  • Click the Link to Document button
  • The Remote File Explorer will be displayed

  • Click the Upload Filebutton
  • This displays a traditional file selection dialog


  • Navigate to the required file (in the example below, the file CV.pdf) and then click Opento select the file
  • The file will be uploaded

  • Once the file has uploaded, click on the file to ensure that it is selected (highlighted with a blue border as shown above)
  • Then click the Insert button
  • A link to the uploaded document appears in the respective field:

Uploading and Inserting Images

The upload of images is similar to the upload of files.

Note the restrictions on the upload of images.The image should be 150 pixels wide or less, and file size should be less than 50kb.

  • Click theImage button
  • The Remote File Explorer will be displayed

  • Click the Upload Filebutton
  • This displays a traditional file selection dialog
  • Navigate to the required file (in the example below the file me_large.jpg) and then click Opento select the file
  • The file will then be uploaded for you

Note: If the image file that you attempt to upload exceeds the permitted 50kb limit, then you will see the following dialog:

Use a graphics package to reduce the size of the image before again attempting to upload the image.

Once you successfully upload an image, the image will be displayed in the Remote File Explorer.

Before inserting the image, you have further options available to you:

  • Right-click on the image
  • You will see an options menu as shown below:
  • Click the Edit imageoption
  • This will open the Image Editor as shown below:

Note in particular the top two options

  • The Image Editor contains Crop and Resize buttons
  • To resize our image to the 150 pixel limit, click the Resize button
  • The width of our image is displayed along with the option to Keep Aspect Ratio. It is recommended that you leave this ticked as this will ensure that your image is resized proportionately
  • Enter 150 in place of the width of your own image and then click the Applybutton
  • Your image is resized
  • You can then click the Finishbutton to return you to the Remote File Explorer
  • Having resized the image to the required size, you can now select the image and click the Insertbutton to insert the image into the respective field
  • Click Save to save your image.

Note that it is possible to edit your image as follows.

  • Click the Editbutton
  • Select your image
  • You should see selection boxes around the image as shown below:
  • Click the Advancedbutton
  • You can now enter an alttag for your image, which will be displayed when a user hovers over the image. You can also select an Alignment for the image. When you’ve finished, click Simpleand then Save to commit the changes to the database.

Further Help

Help

Click on the Help icon and then click on any of the buttons to obtain a pop up window that fully describes the purpose of the button. Note that you need to click the Help icon again to turn this feature off.

About

Information about the editor.