Website Page Editing

If you have the rights to edit particular WEB HTML pages on the system you will see a "Edit this page" link in the left hand menu and on some pages a (E) link after the title of something.

The page editor presents a word processor like interface with a set of toolbar entries along the top. Normal word processing features such as paragraph style, bold, Italic, bulleted or numbered lines etc can be used. The system can also create hyperlinks to other website pages or off-site pages using their URL.

The Website HTML page your are editing is stored in a directory/folder on the system. Here you can add any number of WEB pages and sub directories (Folders). Each page can be simply edited on-line using the simple Word Processor like editor provided. The left hand menu provides functions for editing and browsing the files as well as the ability to upload certain types of files.

Simply type in the information and format it as required using the menus at the top of the editing area. You should take note that the WEB page you are editing might be viewed on a device with a small screen, such as a mobile phone, The main thing here is not to have things that have a large fixed width. Normally the system/browser will rescale things like images, but things like multiple columns have to be handled specially. Set the Mobile Phones section for more info.

If needed, and if users have an understanding of HTML formatting, the "Source" mode of editing can be used for more control over the page layout and contents. Use the menus "Source" button to access this.

The "Add a new page" button can be used to add a new webpage. A link will be added at the bottom of the current page to link to it. Please use a short page name without spaces where possible. Once you have edited the new page you will probably want to edit the parent page and move/format the link as desired changing its title text as wanted.
The "Add a directory" button can be used to add a separate directory (folder) with an initial page. this is useful to structure your additional information.

Pictures

Pictures can be inserted with the "image" menu button. You can either use a picture existing on the web system or upload new pictures using using the "Browse Server" button. The "Browse Server" button pops up a simple file browser with an Upload area in the bottom left hand corner. To select a picture simply double click on it. By default the File Browser will be located in the directory/folder where the file being edited resides.
When uploading images, the images will be automatically resized to 1920x1080 pixels to reduce file upload time and storage on the server. Make sure the orientation is correct before uploading them. The size of the image may be adjusted using the 'image properties'.

By default the system will resize pictures to 100% of the width of the screen or table column they are in. However if you want to resize them smaller they can be resized to the size required if needed by clicking on them and using the resize handles at the image corners. Inserting images into table cells is sometimes useful for ordering/collating multiple images. Note that images will be resized automatically for the device being viewed on.

Links

As well as images, links to onsite or offsite information can be inserted using the link button. Also maps, videos etc can be inserted. Each link has a URL and a textual title. Where possible use relative directory/file names using the Protocol "<other>".

Mobile Phones

The WEB pages will resize when viewed on a mobile phone. However, it is important to not produce pages with things that need a large fixed width like multiple columns or tables with lots of columns.

If you want multiple columns you ideally want to use what are called "div" blocks so that these columns can disappear when viewing on a mobile phone. If you want this sort of page layout see some of the other web pages on how to do it. You will need to use the source mode and have some knowledge of HTML and CSS to do this. Contact us for help on this.

Special Inline Code Blocks

There are some special "<websys>" script entries on the page that include the RO's information, News, What's On, Showcase and Documents live information. These automatically insert the appropriate information on the webpage. Be careful not to delete these (they look like a name with ()'s eg. "groupContact()"). To edit/move these you will need to edit the page source with the "Source" button and have some understanding of using HTML tags.
Make sure you click on the Menu's save button or the "Submit" button at the bottom of the page to commit your work before moving off this page.

The Special, website generated, blocks can be included using the following code entered in "Source" mode:

  <websys>whatsOnList()</websys>

There are a few functions that can be used. These currently include:

groupContact() The groups contact
newsListAdd(height, "news") This shows the recent news in a window 300 pixels high
whatsOnList(3) The next 3 entries from the What's On list
documentList(3) The next 3 entries from the documents
showcaseGroup(3) The next 3 entries from the showcase
picturesRandomImage(width=30%) A random picture from the system with given width as a percentage of the page width

Website Style

Please see the Website Style Guide for information on style.