HTML Content Module

Introduction

The HTML Content module provides a flexible tool to add text, images, tables and more to site pages.



How to Change Module Settings

HTML Module

Click the [Edit] button to show the settings.




HTML Module

Initially, this shows that the HTML Content is being displayed directly from the Scouts Online Default settings. To change this, select either your group default or section specific from the drop down list.




You will now see a blank panel, allowing you to enter your own text, images, links, tables, etc.

HTML Module



Clicking the [Get settings from Default] button will copy the default settings as a base from which to edit.

HTML Module



Editor Features

This editor is a third-party application used by many CMSs. The functionality varies between browsers. We therefore recommend the Google Chrome browser when editing.


Text colour, Background Colour, Bold, Italic, Underline, Strike Through and Remove Formatting

Highlight word(s) in your text using your mouse and click one of these buttons to affect the formatting.

The colours are important to stay within Scout Association suggested brand guidelines. The colours shown in the text and background palette lists are the recommended colours. However, you may elect to use a non-standard colour by clicking More Colors.


Cut, Copy, Paste

Highlight text to Cut/Copy and click the button. Move to another area and click Paste to copy/move the text.


Numbered bullet point, Bullet points

Click a new line, or highlighted text, to add a bullet point.


Left justify, Centralise, Right justify, Full justify

Highlight text and click one of these buttons to affect the justification.


This button will toggle between display mode and raw HTML. The HTML mode can be useful to fine-tune the appearance of your text, after extensive formatting has been done.


This drop-down-list shows pre-defined styles that may be applied to highlighted text.


Image, Table, Hyperlink, Unlink

Image: The URL field defines the image to display. The URL may be found in the Full Path field on the File Manager File Details panel after selecting the image. E.g. www.scoutsonline.co.uk/ MyFiles/Group?????/ Scouts/GroupPic.png

The Width and Height fields define the size when displayed.


Table: A table can often help you display text and information in columns or an organised way. You may specify the number of Rows, Columns, Width and more.
Hint: Setting the Border Size and Cell Spacing to 0 (zero) will make the table framework invisible, leaving your content alone on the page.


Hyperlink: A link may be added to open up an external website, a page inside your site or a document (e.g. PDF).

The URL field defines the website page (e.g. www.scouts.org.uk) or document to open.
To open a PDF uploaded to your site using File Manager, enter the Full Path from the File Manager File Details panel. E.g. www.scoutsonline.co.uk/ MyFiles/Group?????/ Scouts/AAForm.pdf

To open the link in a new browser tab, set the Target to New Window (_blank). The link can be customised by setting the Stylesheet Classes to "ALink" or "ALink2".


Unlink Hyperlink: Highlight a hyperlink and click this button to remove the hyperlink.


Undo, Redo. These buttons reverse or re-apply a change made to the text or formatting.




Clicking [save] will store the changes you made. Alternatively, you may change the drop down list back to Scouts Online Default to revert back to using the default settings.

Once set, group defaults will be shown for all sections without a section specific setting. Where section specific settings are defined, it will only apply to that settings, leaving other sections to use the group default or the Scouts Online default.