The Source button within the WYSIWYG editor allows more technical users to have greater control of page content by editing the HTML source code.

Font Style

The overall site font style is defined in CSS, however, alterations can be made in the code for size and colour using "font" tags.

e.g. <font size="2" color ="#87d300"> Text </font>

You can make text bold or italic in the WYSIWYG editor, but if you prefer to continue working in the Source editor the bold tag used is <strong>,the italic tag is <em> and the underline tag is <u>

A set of predefined CSS "h" tag headings can also be used within the Source editor, for which size and color can not be altered (please note the spacing above and below the headings and that <h3> includes the blue bar): 

<h1>

<h2>

<h3>

<h4>

<h5>

<h6>

Layout

With the WYSIWYG editor you can arrange content in a single column where the width is defined by that of the content section, or create a table to organise the content more freely. You can setup tables from within the source editor too by using standard table tags.

e.g. 

<table height="200" cellspacing="5" cellpadding="2" width="100%" border="1">
    <tbody>
        <tr>
            <td>Text for cell 1</td>
            <td>Text for cell 2</td>
            <td>Text for cell 3</td>
        </tr>
     </tbody>
</table>

Text alignment can be applied to cells where "valign" sets the vertical alignment and "align" sets the horizontal.

e.g. 

<td valign="top" align="left">Text for cell 1</td>
<td valign="middle" align="center">Text for cell 2</td>
<td valign="bottom" align="right">Text for cell 3</td>

The padding within individual cells can be specified using <td style> tags.

e.g.

<td style="padding-right: 10px; padding-left: 10px; padding-bottom: 10px; padding-top: 10px">

Images can be placed within cells by using the insert image button in the WYSIWYG editor or by copying and pasting the image reference of an existing image into the Source editor.