Editing with Blue Toolbar Buttons

Which one are you using?

The newer editor has fewer buttons.

If your editor looks like this, use the help page for Blue Button Editor

The older editor looks more-or-less like this.

If your editor looks like this, use the help page for Older CK editor

Each page of your website is made up of one or more Articles. After you log in, you'll see a couple of links: Edit and Photo below each article.

An article may or may not have a Title. An article with no title looks like a continuation of the previous article. An article with no title needs to have a Note so you can see what it's about.

Each article can have an image or photo attached to it. You can place the photo across the top of the article or to the left or the right. A photo can have a caption, as well.

Special pages such as a photo album, calendar or list of documents might also contain other elements.

Login from the link in the lower right of any page of your site.

The Admin Menu will be visible in the upper right corner of your site. It floats on the page so you can always get at it. If the Admin Menu is covering the spot where you need to work, make the window wider to give it more room.

After you log in, below each article you'll see an "Edit" and a "Photo" link. Click "Edit" on the article you want to edit.

Site Manager uses an editor that is very much like a word processor - you type your content into the text area.

The toolbar buttons are:
undo and re-do
bold, italic, underline, and remove formattingstyles
Styles (for consistent styling)
insert, edit or remove a link
paragraph alignment left , centre, right align and justify
put in a horizontal line
bulletted list, numbered list, outdent and indent
html code source (you only use this if you want to)

To remind yourself what a button does, hold your mouse over it.

When you hit Enter to go to a new line, the editor creates a new paragraph. Paragraphs are separated by some extra space, like the space below this paragraph.

To make a new line without making a new paragraph, use Shift-Enter. This will move the cursor to a new line without leaving extra space.
This text is on a new line, but there is no space between. You might want to use this technique in a list of items.

Simple formatting is applied with the Bold, Italic, and Underline buttons in the toolbar. Or you can use the keyboard shortcuts: Ctrl-B, Ctrl-I, and Ctrl-U.

In order to apply formatting, use the mouse or keyboard to highlight the text you want to format. Then click the button or use the keyboard shortcut.

Tip: To highlight with the keyboard, hold the Shift key while moving the cursor with the arrow keys. Using the keyboard to highlight can be easier and more precise than highlighting with the mouse.

To remove formatting, highlight the text and click the Clear button.

To apply formatting as you type, use the shortcut or click the button before you start to type the text you want to format. Use the same shortcut or click the eraser button to turn off the formatting.

You can apply two (bold-italic) or even three (bold-italic-underline) formats to the same text.

Styles are an easer and better way to apply more complex formatting. The font weight, colour and size are "bundled" so all are applied in one step and the Styles will be consistent across the site, so your site will continue to look professional.

Paragraph Styles & Headings.

The first three Styles in the top part of the Styles drop-down are applied to the whole paragraph, and are used for headings and titles.

To apply a paragraph Style, place your cursor in the paragraph and chose the style you want from the drop-down.

To remove a paragraph Style, place your cursor in the paragraph and chose Normal Text.

You can also apply a paragraph Style when you start typing a paragraph. When you hit Enter to move to the next paragraph, the style will revert to Normal Text.

Inline Styles

The rest of the Styles in the lower part of the Styles drop-down are called inline Styles and are applied to highlighted text.

To apply an Inline Style, highlight the text you want to format and chose the format you want from the drop-down.

To remove an Inline Style, highlight the text you want to remove formatting from and click the Clear button.

Link to another website

• Go to the page you want to link to.
• Copy the address from the address bar in the browser
• In the article where you want the link, type the text for the link (e.g. "More info here") and highlight it.
• Click the link button and choose Insert Link.
• Paste the address into the URL field
• If you want to change the text of the link, click on it, choose "Edit" and change the text in the Text field.

Link to another page in this website

• Go to the page you want to link to.
• Copy the address from the address bar in the browser, but don't pick up the first part of the address. Only copy from "index.php?" to the end of the address
• Type the text you want to put the link on - like "The document is here" - and highlight it.
• Click the Link button in the toolbar and choose Insert Link
• Paste the address into the URL field
• If you want to change the text of the link, click on it, choose "Edit" and change the text in the Text field.

Email Link

• Copy the email address you want to link to
• In the Editor, paste the address and highlight it, or type the text you want for the link and highlight it.
• Click the Link button
• Paste the email address into the URL field.

Cut, copy and paste work much the same way as in a Word Processor. Use the toolbar buttons or the keyboard shortucuts:

• Copy Ctrl-C
• Cut Ctrl-X
• Paste Ctrl-V
• Paste plain text Ctrl-Shift-V

Unfortunately, the editor can get cranky when you paste text - it will bring in formatting in a way that is very difficult to edit. So this editor is set up to paste as plain text only.