Using WYSIWYG article editor

The default article editor on this website is the TinyMCE editor. So this is a kind of Beginners guide to using TinyMCE article editor. Please note that the following description is for the older version of this editor and some features have since changed.

TinyMCE is a WYSIWYG (what you see is what you get) editor that allows users a simple word-processing interface to use when editing articles and other content. The 3-row toolbar below provides many standard editing commands:

Getting started with TinyMCE and basic things you need to know!

If you are not familiar with html, css or web publishing, here are a few simple commands you should know that will allow you to create simple but interesting articles.

Font style - Highlight your text and use these 4 buttons to make text bold, italic, underlined, or strike-through.

Text Format for size and headings - To make your articles interesting, highlight your text and use this drop-down menu to create a variety of different styles of headings with different attributes. You can use this to quickly make text large, bold, italic and so on.

Alignment - Highlight your text or select an image and use these buttons to Align text, images or other content left, right, center, and full.

Insert/Edit Image - To insert an image, place the cursor in the desired location and press this button. A pop-up dialog box will appear that lets you enter in the Image URL and other information about how the image will display.

Insert/Edit Link - To insert or edit a link, select the linked text and press this button. A pop-up dialog displays that lets you enter details about the link. Pages from within this website can be selected from the "Link List". If you want to link to a News or Event item, then you will need to first copy the website address for that item and then paste into the "Link URL" field of the pop-up dialog.

Important note about external links! - It is important to note that any article published on this website that contains links to other websites on the Internet, the links need to open "In a new browser window" or "Target blank" for readers. This is done in the drop-down menu of the "Insert/edit link" dialog box. For target, choose the the option "Open in new window (_blank)".

To make a button or image click-able to another article or website - To make a button or image click-able to another article or website, you can use a combination of the last three explanations. First insert the image or button into your article where you want it. Then click the image to highlight it. Then click the "Insert/edit link" button in the toolbar and enter the URL of the link and update your article. This will make the image or button click-able to the other article or website!

Unlink - To remove a link, click on the linked text and press this button.

Note for new users and beginners

If you want to learn more about the basics of html, css and website publishing, you should visit http://www.w3schools.com/

If you want to edit the article html directly

You can directly edit the html for your article if you know what you are doing!

Note: This function can also be used to quickly copy an article. You can view the html and copy it for use in a second article that is very similar. This will save a lot of time if you have spent a large amount of time formatting a particular article. This is particularly useful when copying and pasting text from a PDF document since it eliminates the linebreaks at the end of each line.

Edit HTML Source - If you click this button, a pop-up displays showing the HTML source code for your article and allowing you to edit the HTML source code directly.

Short explanation for each of the buttons in the TinyMCE editor

Button	Title	Description
	Font style	Make text bold, italic, underlined, or strike-through.
	Alignment	Align text, images or other content left, right, center, and full.
	Text & Image Styles	Caption and System Pagebreak styles can be set. Highlight the desired text and select the style. This will allow this text to be formatted based on CSS rules.
	Paragraph format	Select predefined formats for Paragraph, Address, Heading1, and so on. Please do NOT use Heading 1 because this is reserved for the main title on each page.
	Text List formatting	Unordered List, Ordered list, Out-dent (move left) and Indent (indent right).
	Undo/redo	Undo (Ctrl+Z) and Re-do (Ctrl+Y) the formatting you just made to your article.
	Insert/Edit Link	To insert or edit a link, select the linked text and press this button. A pop-up dialog displays that lets you enter details about the link.
	Unlink	To remove a link, highlight the linked text and press this button.
	Insert/edit anchor	Creates a named anchored which can be used as a target to jump to when using a link.
	Insert/Edit Image	To insert an image, place the cursor in the desired location and press this button. A pop-up dialog displays that lets you enter in the Image URL and other information about how the image will display.
	Cleanup Messy Code	This button allows you to clean up HTML code, perhaps from HTML text that you copied in from another source.
	Help	Not particularly useful - you get a pop-up dialog directing you to the TinyMCE website, which is mainly aimed at developers not users.
	Edit HTML Source	A pop-up displays showing the HTML source code, allowing you to edit the HTML source code.
	Related Content Templates	To insert embedded media (such as images), place the cursor at the desired location and press this button. A pop-up dialog will display that allows you to enter the Type, File or URL, and other information about the media. This is a more flexible way to insert associated images, allowing you to select the source image rather than a resized version.
	Tools for inserting and editing tables	Insert New Table, Table Row Properties, Table Cell Properties, Insert Row Before, Insert Row After, Delete Row, Insert Column Before, Insert Column After, Delete Column, Split Merged Table Cells, Merge Table Cells.
	Insert Horizontal Line	Adds a horizontal ruler to your page.
	Remove Formatting	Removes formatting from text copied from somewhere else.
	show/hide Guidelines/Invisible elements	Toggles the invisible elements of your article.
	Subscript, Superscript	For adding scientific notation to your text.
	Insert Custom Character	Choose from a selection of custom text characters.
	Toggle Full Screen Mode	Toggles your article editing window to the full size of your screen. When you're done with fullscreen, please click again so that you can Complete the editing and save the changes. Do NOT click on the "X" in the top-right corner because this will discard your changes.
	Paste from Word	If you want to paste something from Microsoft Word, first click this button and paste into the pop-up window, then click "insert". This feature removes all the horrible code attached to Word documents.
	Paste as Plain Text	If you wish to paste something from a website, email, PDF document, or anything else, first click this button and then paste. This feature removes all the unnecessary code attached with these formats.