The Content Editor
The Content Editor
Quality page content is the key to your website’s success!
It is often said that web page content can “make or break” a website. Your page content should be the primary focus in your website’s preparation as well as its ongoing maintenance.
Page content is the key to engaging with your customers. Poorly crafted content will certainly lose visitors, so careful consideration should be made as to the type of content you provide, its volume and its presentation, be it text-based, images, video, or a combination of all these.
The Content Editor provides the tools necessary to build and maintain your web page content independently of a website designer.
On this page |
|
Screen illustrationsWhen you see this icon, clicking it will display an illustration relevant to the step described: |
Tip: Use the Underline text tool sparinglyUse this text formatting tool with care - website visitors recognise underlined text as a hyperlink so they may become frustrated when they click on underlined text expecting it to link somewhere. Instead, consider using bold type or italics to emphasise text. |
The Content Editor
The Content Editor is the interface for adding and editing page content (text, images, video, tables, etc.) on your website. It features a familiar WYSIWYG (“what you see is what you get”) Toolbar , similar to those found in common word processors.
All aspects of your page content are controlled via the WYSIWYG Toolbar 
You will find a Content Editor available for each of the following content elements of your website and shop:
- Pages
- Blogs (news articles)
- Shop Categories
- Products
- Shopfront
- Email Campaigns (limited toolbar functionality)
- Automated Customer Order & Shipping Notifications (limited toolbar functionality)
The WYSIWYG Toolbar
The WYSIWYG Toolbar is a familiar set of tools, many of which are commonly found in popular word processing software. Each tool provides an aid for creating and editing your page content as quickly and as effortlessly as possible. We recommend that you familiarise yourself with each tool’s operation.
 |
Cut: Remove selected content from the page in order to paste it elsewhere (on the same page or another page). |
 |
Copy: Duplicate selected content from the page to the clipboard ready to paste elsewhere. |
 |
Paste: Place your cursor where you would like to insert content from your clipboard. Click to insert the content. |
 |
Paste as Plain Text: Place your cursor where you would like to insert text from your clipboard. Click to paste. |
 |
Paste from Word: Place your cursor where you would like to insert text from your word processor. Click to insert. |
 |
Un-do: Undo the last editing command. Sequential. Click repeatedly to step back through recent changes. |
 |
Re-do: Having performed an un-do command, you can re-do the last editing command. |
 |
Bold: Highlight text and click this tool to increase the text’s weight or thickness (bold type). Essential for SEO. |
 |
Italic: Highlight text and click this tool to italicise selected text. Used to create emphasis. |
 |
Underline: Highlight text and click this tool to underline selected text. |
 |
Strikethrough: Highlight text and click this tool to draw an unbroken line through the centre of the selected text. |
 |
Align: Select the text that you wish to align and click one of the align tools. |
 |
Bulleted List: Lists are an effective and user-friendly way to present content. Use lists as often as possible. |
 |
Numbered List: Lists are an effective and user-friendly way to present your content. Use lists as often as possible. Highlight the text that you would like to become a numbered list and click this tool. Each line of selected text will start with the next consecutive number. To end a numbered list, press the Enter key twice or click on the Numbered List button again. |
 |
Increase Indent: Highlight the text and click this tool to increase the indent on the current selected line. |
 |
Decrease Indent: Highlight the text and click this tool to decrease the indent on the current line. |
 |
Font Colour: Highlight the text and click this tool to change its colour.
Use this tool sparingly. Your site will look more professional if you keep to a standardised colour scheme throughout your headings and links. |
 |
Remove Styling: Highlight text and click this tool to remove its formatting (styles, colours, etc). |
 |
Horizontal Rule: Place your cursor where you would like to draw a horizontal line across a page.
Horizontal lines can be used to break up sections of content on a long page. They assist users to scan through your content. |
 |
Insert Hyperlink: Highlight text that you would like to become a hyperlink and click this tool to enter the URL. |
 |
Remove Link: Highlight a text or image hyperlink (URL) and click this tool to remove the link. |
 |
Insert Anchor: Create a link from one point to another on the same page, e.g. a ‘back to top’ link. See Managing Hyperlinks in this section. |
 |
Insert/Edit Image: Add existing web images or upload new images to content pages. |
 |
Link to a File: Highlight link text and click this tool to upload/select the file. |
 |
Insert Module Content: Position module-based content anywhere on the page. |
How to create and maintain tables is covered in Using Tables to Format Page Content.
 |
Insert/Edit Table: Tables are useful for formatting and placing text and images on a page. |
 |
Table Row Properties: Place your cursor within a table row and click this tool to set row properties. |
 |
Cell Properties: Place your cursor within a table cell to set alignment properties for the selected cell. |
 |
Insert Row Before: Add a new row to your table. The new row will appear above the currently selected row. |
 |
Insert Row After: Add a new row to your table. The new row will appear below the currently selected row. |
 |
Delete Row: Place your cursor within the row that you would like to delete, then click this tool to remove row. |
 |
Insert Column Before: Add new column to a table. The new column will appear to the left of the selected column. |
 |
Insert Column After: Add a new column to your table. The new column will appear to the right of the selected column. |
 |
Delete Column: Place your cursor within the row that you would like to delete, then click this tool to remove row. |
 |
Split Merged Cells: Click this tool to divide a previously merged table cell. |
 |
Merge Cells: Combine two or more cells in a row to form one large cell. |
 |
Display Guidelines: Click this tool to show guidelines for ‘invisible’ tables in the content editor. |
 |
Insert Custom Character: Add non-standard text characters to your content, e.g. ®, ©,™, etc. |
 |
Toggle Full-Screen Mode: Click this icon to increase/decrease the content editor work space. |
 |
Find Text: Click this icon to open the quick-edit find/replace window. |
 |
Replace Text: Click this icon to open the quick-edit find/replace window. |
 |
Toggle Spell Checker : Click this icon to check spelling within the Content Editor . |
 |
Insert Pre-Defined Template Layout: Click this icon to create quick, standardised page layouts. |
 |
View HTML: For advanced users, opens a HTML editing window complete with code-line references. |
Preview a Page Before Publishing
As you add new content to a page, sometimes it helps to see how your content will display to your visitors without having to first publish the website to do so.
Although planning your content and page layouts in advance is recommended, it’s still good to know that you can preview how visitors will view your page, at any time.
- Go to Pages > Add / Edit Pages
- Navigate to the page you wish to edit.
- After making necessary edits to your page content, click the Save button
- Now click the Preview button. A new web browser tab or window will open, previewing your page.
- Note the preview control buttons at the top right of your browser preview screen
- If further edits to the page are required you can leave the preview page open before navigating back to the page’s Content Editor to make additional changes.
- Click the Save button after making any further changes.
- Either navigate back to the open preview page and click Refresh or click the Preview button from within the Content Editor to be automatically taken to the open preview page (and to view the page refreshed).
- If you wish to preview a brand new page, first Save & Exit the new page before navigating back into the page’s Content Editor and following from step 3.
