WYSIWYG stands for What You See Is What You Get. The WYSIWYG editor is a way to produce HTML without writing any code.
For example you can make text bold by highlighing it and then clicking the Bold icon. This automatically writes the HTML code:
Your text here
You must use the tools in your editor to produce correct HTML. Using the tools wrongly will produce inaccurate HTML, which can affect the appearance of your website in unpredictable ways.
Do not copy text directly into the WYSIWYG.
If you copy content directly into the WYSIWYG from another source (for example, copying it from Microsoft Word) you will also introduce the hidden code for that content. The code may conflict with your website code, and badly affect the layout of your web page.
The editor usually looks like this. In some cases certain tools may be disabled because they are unneccessary for the specific content space.
- Strike through
These tools apply basic formatting to text. They can be applied to single characters, words, or whole paragraphs.
To use them, click the tool and then type inside the editor box. Or highlight existing text within the editor box and click the tool. You can apply more than one format at the same time.
This is bold, italic, underline and all three together.
- Remove formatting
This tool can be used to remove any of the above formatting to selected text. Highlight the text and then click Remove formatting.
- Ordered list
- Unordered list
You can use these to create lists of bullet points. An unordered list uses normal bullet points. An ordered list adds bullet points with numbers.
These styles can be applied to whole paragraphs. Each paragraph becomes a bullet point.
To use these tools, click the tool and then type. Press return to create a new bullet piont. When you've finished adding bullet points, click the tool again.
Alternatively, type all of your content and then highlight the text and click the tool. Or click once anywhere within a paragraph, and click the tool to make that paragraph into a bullet point.
- Insert horizontal line
This tool adds a horizontal line across the content space. Horizontal lines appear immediately after the preceding paragraph.
- Decrease indent
- Add indent
These tools can be used to indent a paragraph of text, and then to remove the indentation. To use this tool, click once anywhere within a paragraph and then click the tool. Click the tool again to add more indentation. Click Decrease indent to reduce the indentation again.
- Align left
- Align centre
- Align right
These tools can be used to position text within the content space. To use the tool click a paragraph of text (or an image) and then click the tool.
Justify makes the text line up neatly on both sides by altering the space between letters on each line of text. It should be used carefully, because it can make text difficult to read. Remember, some users may choose to view text larger (especially users who are visually impaired). So the "character spacing" effects of justifying text may be more severe for these people.
- Paste as plain text
- Paste from Word
These tools can be used to cut, copy and paste text within the content space. Please always ensure you paste as Plain text or as Paste from Word if you are copying formated text from another source. This will remove any formatting, and maintain the integrity of the HTML on your website.
These tools can be used to redo or undo changes you make to the content within the WYSIWYG. They do not affect any other part of the page or CMS.