The tool bar located in stories and widgets is called the Online Editor. The Online Editor is used for editing content in ClubRunner, such as stories, bulletins, widgets, and more. This powerful editor can be used for expert users or can be easily used by new members.
Row 1 Icons
|
|
Cut - Cuts the highlighted text. |
|
|
Copy - Copies the highlighted text. |
|
|
Paste - Pastes the cut or copied text. |
|
|
Paste as plain text - Pastes the cut or copied text and removes all formatting and non-text content. |
 |
Paste from Word - Pastes the cut or copied text from Microsoft Word and removes extra code that Microsoft Word uses which ClubRunner does not need. |
 |
Undo - Undoes the last change you made. |
 |
Redo - Redoes the last undo. |
 |
Insert/Remove numbered list - Inserts or removes a numbered list. |
 |
Insert/Remove bulleted list - Inserts or removes a bulleted list. |
 |
Increase indent - Increases the indent. |
 |
Decrease indent - Decrease the indent. |
 |
Link - Highlight the text or image and then click on the Link icon on the toolbar. A dialog box will open to create a link. |
 |
|
 |
Unlink - Highlight the image or text that you want to unlink and then click the unlink icon. |
 |
Spell checker - Click on the spell checker icon and then select Check Spelling. A dialog box will open that will help you spell check. |
 |
|
 |
Table - Opens a dialog box that will help you create a table. |
 |
|
 |
Find - Opens a dialog box that lets you find text in your content. |
 |
|
 |
Replace - Opens a dialog box that lets you find text and then replace it in your content. |
 |
|
 |
Select all - Selects all content. |
Row 2 Icons
 |
Image - Opens a dialog box that lets you insert an image. To learn more please read How to Add an Image to a Story. |
 |
|
 |
Add an image - Opens a window that lets you select an image from your computer to insert into the content. |
 |
Flash - Opens a dialog box that lets you embed flash. |
 |
|
 |
IFrame - Opens a dialog box that inserts or edits inline frames. |
 |
|
 |
Embed Media - Opens a dialog box that allows you to embed content hosted by other services such as Twitter, YouTube, Imgur, Google Maps and more. To learn more please read one of the follow articles: How do I embed a Youtube video into a story? or How do I embed a Vimeo video into a story?. |
 |
|
 |
Embed Media from External Sites - Opens a dialog box that allows you to embed photo, video, audio or rich content hosted by other services with more options. |
 |
|
 |
Templates - Opens a dialog box where you can select a template to insert into your content. |
 |
|
 |
Insert Horizontal Line - Inserts a horizontal line. |
 |
Smiley - Opens a dialog box where you can select an emoticon to insert. |
 |
|
 |
Insert Special Character - Opens a dialog box that allows you to pick a special character to insert. |
 |
|
 |
Insert Page Break for Printing - Inserts a page break for printing purposes. |
 |
Show Blocks - Displays all block-level elements by surrounding them with a outline and displaying their element name at the top-left. |
 |
Maximize - Maximizes the window of the section you are editing. |
Row 3 Icons
 |
Paragraph Format - Opens a drop down box where you can select a format. The options are: normal, heading 1, heading 2, heading 3, heading 4, heading 5, heading 6, formatted, address, and normal (DIV). |
 |
Font Name - Opens a drop down box where you can select the font. |
 |
Font Size - Opens a drop down box where you can select the size of font. |
 |
Bold - Bolds the text. Eg: Bold |
 |
Italics - Italics the text. Eg: Italics |
 |
Underline - Underlines the text. Eg: Underline |
 |
Strike Through - Strike Through the text. |
 |
Subscript - Allows you to enter subscript. Eg: Subscript |
 |
Superscript - Allows you to enter superscript. Eg: 10th |
 |
Remove Format - Removes the formatting of text. |
 |
Align Left - Aligns the content to the left margin. |
 |
Align Center - Aligns the content to the center. |
 |
Align Right - Aligns the content to the right margin. |
 |
Justify - Aligns the text along the left margin, and letter and word-spacing is adjusted so that the text falls flush with both margins. |
 |
Background Color - Changes the background color of the text. Eg: Background color |
 |
Text Color - Changes the text color of the text. Eg: Text color |
 |
Block quote - Indents the line for you to enter in a quote. Once done hit enter and click on the Block quote icon again. |
 |
Text Direction - When inputting text, the text will be inputted from left to right. |
 |
Text Direction - When inputting text, the text will be inputted from right to left. |
 |
Source - Displays the HTML code of the content. |