Editing and Content

When an article is selected from the Site Tree, it is opened in read-only mode. The Edit icon in the top right-hand box must be clicked before an article can be amended.

An article can be manipulated through six tabs: General, Security, Attributes, Content, Preview and History.

General

• Title – The name of the article.
• Category – The parent article. Changing the category moves the article.
• Template - The structure or layout of the article. If you are unsure of the layout, select the template you are considering and Preview. If the preview doesn’t show your desired layout, go back to the General tab and select another template.
• Publish Date - The date from which you want the article to be viewed on the website.
• Withdraw Date – The date you want to remove the article from public view.
• Workflow – Designated automatically by Cougar CMS. Simple means there is only one level of approval required for any changes.

Security

The Security tab shows the security levels of changes to the article and may not be editable.

Attributes

Attributes specify the properties of an article. The template of an article and its parent-child relationship determine which attributes are available to the article. To access more attribute options, click Show Advanced Options on the bottom left-hand corner of the webpage.

Content

The Content tab includes space for entering and formatting text. The left-hand tabs distinguish the available content areas for each page (eg. Body, Left Hand/Right Hand Content, Header).

Preview

Shows a browser representation of the article.

History

Shows the history of updates and deletions to the article, listed from newest to oldest.

How to Edit

Using the CMS:

1. From the Site Tree, click the appropriate article name.
2. Choose the Edit icon () from the top right-hand box.
3. Click the Content tab.
4. Choose the desired content area by clicking on the appropriate left-hand tab (eg. Body, Left Hand/Right Hand Content, Header).

Using In-Place Editing:

Hover the cursor over the top left-hand side of the relevant content area. Click the Edit icon ().

Click the left-hand side grey Edit Page button to go to the main content area of the article.

Editing Toolbar

TIP: The editing toolbar is only accessible in Edit mode. It is not visible in Read-Only mode.

Source
View the content in HTML format.

Cut (Ctrl + X)
Delete selected text and copy it to the clipboard.

Copy (Ctrl+C)
Copy the selected text to the clipboard.

Paste (Ctrl + V)
Copy the contents of the clipboard to the location of the cursor or in place of selected text.

Insert Plain Text
Paste text into the clipboard. It is stripped of formatting and pasted at the cursor or in place of selected text.

TIP: It is best to insert content in Plain Text. This ensures you maintain the website's style guide.

Paste from Word
Paste text from Microsoft Word. It is pasted at the cursor or in place of selected text. When you select the icon, a window opens with options to remove font face definitions or style definitions.

Print
Print the entire Content tab or selected content.

Undo (Ctrl + Z)
Restore the last action.

Redo (Ctrl + Y)
Repeat the last action.

Select All (Ctrl + A)
Highlights all content within the Content tab.

Remove Format
Delete all formatting from the selected text.

Bold (Ctrl + B)
Bold the selected text.

Italic (Ctrl + I)
Italicise the selected text.

Underline (Ctrl + U)
Underline the selected text.

Strike Through
Strike through the selected text.

Subscript
Decrease the size of the selected text and lower it beneath the original line of text.

Superscript
Decrease the size of the selected text and raise it above the original line of text.

Numbered List
Create a numbered list.

Bulleted List
Create a bulleted list.

Decrease Indent
Decrease the indentation of the selected text.

Increase Indent
Increase the indentation of the selected text.

Blockquote
Align the selected text into blockquote format (indented and separated from other text).

Left Justify
Align the selected text to the left margin.

Center Justify
Align the selected text to the center of the Content tab.

Right Justify
Align the selected text to the right margin.

Block Justify
Align the selected text to both left and right margins.

Text Colour
Select a colour from the palette.

Background Colour
Select a colour from the palette.

Find
Search the Content tab for specific text.

1. Click the Find icon (). The Find and Replace window opens:
   
2. Enter the text to find in Find what. You can match the case of the text and/or the whole word.
3. Click the Find button.

Replace

Search the Content tab for specific text and replace it with other text.

1. Click the Replace icon (). The Find and Replace window opens:
   
2. Enter the text to find in Find what. You can match the case of the text and/or the whole word.
3. Enter the replacement text in the Replace with field.
4. Click the Replace button to have the system replace the first occurrence of the text, or click the Replace All button if you want the system to replace all occurrences of the text.

Insert/Edit Link

1. If you want your content to link to a URL/article etc, highlight the content text first. Otherwise, start from step 2.
2. Click the Insert/Edit Link icon (). The Link window opens:
   
3. Select a Link Type from the drop-down list.
   
   • URL – Enter the URL of a web page you want to link to. When the linked text is clicked, it will redirect to the URL.
   • Article – Click the Browse Server button to select the article to be linked from the Site Tree. When the linked text is clicked, it will redirect to the article in the Site Tree.
   • Link to anchor in the text – Follow the instructions for creating an Anchor. Highlight the text to be linked to the anchor. Select the Anchor Name or ID that you have already created. When the anchor is clicked, it will redirect to the anchored text.
   • E-Mail – Enter an e-mail address, subject, and body. When the link is selected, the user’s default e-mail application is launched ready to compose a new message.
4. Go to the Target tab to amend how the link is accessed. Choose from the drop-down list.
5. Click OK.

TIP: If you right-click on a link, you can paste, open, edit and remove the link.

Remove Link

1. Highlight the text associated with the link you want to remove.
2. Click the Remove Link icon (). The system removes the link from the text.

TIP: If you right-click on a link, you can paste,open, edit and remove the link.

Insert/Edit Anchor

1. Highlight the text that will be the anchor.
2. Click the Insert/Edit Anchor icon (). The Anchor Properties window opens:
3. Enter or edit the Anchor Name in the space provided.
4. Click OK. An anchor symbol displays to the right of the text you selected.

TIP: To link to the anchor text, highlight the linking text then click the Insert/Edit Link icon. Choose Link to an anchor in the text.

Insert/Edit Image

1. Place the cursor within the text where you want to insert or edit an image.
2. Click the Insert/Edit Image icon (). The Image Properties window opens:
3. Select an Image Type from the drop-down list:
   
   • URL – Specify the URL of an image.
   • Resource – Click the Browse Server button to select an image from the Resource Library.
4. You can enter alternative text and specify the border, horizontal and vertical space dimensions and select an alignment.
5. Click OK.

TIP: If you are inserting a series of images, insert a table first. This helps to arrange the images.

Insert/Edit Table

1. Place the cursor where you want to insert or edit a table.
2. Click the Insert/Edit Table icon (). The Table Properties window opens:
3. Specify the properties for the table and click OK.

TIP: Tables are useful for arranging images and text. If your table's width dimensions are set outside of the content area, it will affect its appearance. Use width 100 percent to ensure the table is not larger than the available content area.

Insert Horizontal Line

1. Place the cursor where you want to insert the horizontal line.
2. Click the Insert Horizontal Line icon (). The system inserts a horizontal line at the specified location.

Insert Special Character

1. Place the cursor where you want to insert a special character.
2. Click the Insert Special Character icon (). The Select Special Character window opens:
3. Select the special character you want to insert within the text. The system inserts the special character at the specified location.

Insert/Edit Resource

1. Place the cursor where you want to insert or edit a resource.
2. Click the Insert/Edit Resource icon (). The Resource Properties window opens:
3. Click the Choose button to select a resource from the Site Tree.
4. Select a Render Mode from the drop-down list.
5. Select a Decoration from the drop-down list.
6. Enter a Width and Height in the spaces provided.
7. Click OK.

TIP: If you want an image to have a lightbox effect, insert it as a resource rather than inserting as an image.

Maximize the Editor Size

1. Click the Maximize the Editor Size icon (). The system renders only the toolbar and content area in the window.
2. Click the Maximize the Editor Size icon () again to restore the Content tab to its default view.

Show Blocks
This function is helpful for exposing formatting problems.

1. Click the Show Blocks icon (). The system displays the content in paragraph blocks.
2. Click the Show Blocks icon () again to restore the Content tab to its default view.

Custom Forms

Custom forms are created using the Custom Form template. The special custom form toolbar will display in the body content area of a custom form article.

Check the security settings of the user (ie. contentpublisher, contenteditor) to ensure s/he has the AdvancedCMS privilege. See Security for more information.

1. Create a Custom Form article using the Custom Form template.
2. In Content Body, insert a table.
   • In column 1 of the table, list the labels.
     • Labels are entered in normal text.
     • A mandatory field is typically marked with an '*' after the label.
   • In column 2 of the table, insert the fields.
     • Choose the field from checkbox, radio button, text field, textarea, selection field or hidden field.
3. At the bottom of the content, insert a button that will submit the form.
   • Click the Button icon on the formatting toolbar.
   • Fill in the fields.
     • A Saved Contact is saved to a database. A Contact will not be saved to the database.
4. Fill out the other Content areas (ie. Admin notification, Thank you).

Custom Form Functions

The functions are only available when a Custom Form template is chosen.

Insert Checkbox

1. Place the cursor where you want to insert the checkbox.
2. Click the Insert Checkbox icon (). The Insert checkbox window opens:
3. Provide a Name for the checkbox.
4. Tick the Selected checkbox if you want it to be selected by default.
5. Insert the Css Class.
6. Insert the Style.
7. Click OK.

Insert Radio Button

1. Place the cursor where you want to insert the radio button.
2. Click the Insert Radio Button icon (). The Insert radio button window opens:
   
3. Provide a Name for the checkbox.
   If you require the buttons to be mutually exclusive, buttons must have the same Name but different Values.
4. Provide a Value for the checkbox.
5. Tick the Selected checkbox if you want the radio button to be selected by default.
6. Insert the Css Class.
7. Insert the Style.
8. Click OK.

Text Field

1. Place the cursor where you want to insert the text field.
2. Click the Text Field icon (). The Text Field window opens:
3. Provide a Name for the text field.
4. Provide a Value for the text field.
   The Value is the default for the field. Only enter a Value if you want the Value accepted as an entered field.
5. Provide a Character Width for the text field.
6. Provide the number off Maximum Characters for the text field.
7. Select a Type of text field from the drop-down list.
8. Select a Sub-type for the text field from the drop-down list.
9. Tick the Mandatory checkbox if you want the field to be required.
10. Insert the Css Class.
11. Insert the Style.
12. Click OK.

Textarea

1. Place the cursor where you want to insert the text area.
2. Click the Textarea icon (). The Textarea window opens:
3. Provide a Name for the text area.
4. Specify the number of Columns for the text area.
5. Specify the number of Rows for the text area.
6. Insert the Css Class.
7. Insert the Style.
8. Click OK.

Insert Selection Field

1. Place the cursor where you want to insert a selection field.
2. Click the Insert Selection Field icon (). The Insert selection field window opens:
3. Provide a Name.
4. Insert the Css Class.
5. Insert the Style.
6. Tick the Mandatory checkbox if you want the field to be required.
7. Add Text and Value information. You will need to click the Add button or Modify button after entering your information. You can use the Up and Down arrows to reorder the information.
8. Click OK.

Hidden Field

1. Place the cursor where you want to insert a hidden field. Click the Hidden Field icon (). The Hidden Field window opens:
2. Provide a Name for the hidden field.
3. Provide a Value for the hidden field.
4. Click OK.

Button

1. Place the cursor where you want to insert the button.
2. Click the Button icon (). The Button window opens:
   
3. Provide a Name for the button.
4. Provide a Text (Value) for the button. (This is the text that appears inside the button.)
5. Insert the Css Class and Style for the button.
6. Select a Type for the button from the drop-down list.
7. Click OK.

Viewing Custom Form Contacts

If your Custom Form saves contacts, the submitted information is compiled in a database. This information is viewable in the Contact Form Submissions Report. The CMS user needs two additional privileges to view the report - viewReports and viewContactSubmissions.

1. Click the Reports icon on the Home tab of the CMS.
2. Choose the Contact Form Submissions title.
3. The report will run and will appear onscreen or be exported to a spreadsheet.