HTML editor

The Richtext HTML editor provides a word-processor interface embedded in your web page to allow you to edit text in an intuitive way, and produces normal HTML code.

In addition to formatting text, this editor provides a number of extra features you may find useful.

When you choose many functions a new small window will open. Unfortunately it can often open BEHIND the window you are in so you may miss that anything has happened. You can check new windows with [Alt]+[Tab].

Note: The HTML editor does not work in all browsers. If you are using a Mac OS X and for some reason it does not appear, try using Firefox instead of Safari as a browser.

HTML editor toolbar

HTML editor toolbar in a Lesson page

<html><head><title>Kamloops Centre for Therapy - Calendar: Mar</title></head><body onload='window.focus();'>

March 2008

<TBODY></TBODY>

Sunday	Monday	Tuesday	Wednesday	Thursday	Friday	Saturday
						1
2	3	4	5	6	7	8
9 Daylight Saving Time	10	11	12	13	14	15 The Ides of March
16 Palm Sunday	17 St. Patrick's Day	18	19	20 Spring begins (EDT) ‡	21 Good Friday	22
23 Easter Sunday	24	25	26	27	28	29
30	31

&nbsp &nbsp| &nbsp &nbsp<a href="JAN.html">January</a> | <a href="FEB.html">Febraury</a> | <a href="MAR.html">March</a> | <a href="APR.html">April</a> | <a href="MAY.html">May</a> | <a href="JUNE.html">June</a> | <a href="JULY.html">July</a> | <a href="AUG.html">August</a> | <a href="SEPT.html">September</a> | <a href="OCT.html">October</a> | <a href="NOV.html">November</a> | <a href="DEC.html">December</a> &nbsp &nbsp | &nbsp &nbsp

</head></html>

Inserting images

If you have images that are already published on a web site and accessible via a URL, you can include these images in your texts using the "Insert Image" button. Moodle recongizes JPG, GIF and PNG as image files.

Inserting tables

• To add layout to your texts, you can use the "Insert Tables" button in the toolbar.
• Most table editing tools are only visible if you click the Enlarge Editor button.

Inserting links

To make a new link,

• type the text that you want to be a link
• select the text
• click the link button in the toolbar
• Type (or paste, or browse to) the URL you want to link to
• Click OK

NOTE: This process does NOT work inside the wiki module where you need to use the Wiki link system (square brackets containing the label and the link seperated by a vertical line character)

Inserting smilies (emoticons)

To embed these small icons in your text, click on the smiley icon in the toolbar. A dialog will pop up that allows you to select from the following smiley icons. (Alternatively, you can just type the corresponding code straight into your text and it will be converted later when your text is displayed).

Shortcut keys

Keys	Action
Ctrl-C	Copy
Ctrl-V	Paste
Ctrl-X	Cut
Ctrl-O	Change the font
Ctrl-P	Change the font size
Ctrl-H	Change text format (headings etc.)
Ctrl-1	to Ctrl-6 Change heading level
Ctrl-=	Change text language for screen readers, or specify language for the Multilang filter
Ctrl-B	Make text bold
Ctrl-I	Make text italic
Ctrl-U	Underline text
Ctrl-S	Strikethrough text
Ctrl-,	Subscript
Ctrl-.	Superscript
Ctrl-0	Clean Word HTML
Ctrl-Z	Undo
Ctrl-Y	Redo
Ctrl-L	Justify left
Ctrl-E	Center
Ctrl-J	Justify full
Ctrl-/	Text runs left to right
Ctrl-|	Text runs right to left
Ctrl-;	Decrease indent
Ctrl-'	Increase indent
Ctrl-G	Change text colour
Ctrl-K	Change background colour
Ctrl-F	Search and replace
Ctrl-`	Switch to HTML source code view
Ctrl-M	Toggle fullscreen editor mode
Ctrl-Alt-O	Insert ordered list
Ctrl-Alt-U	Insert unordered list
Ctrl-Alt-R	Insert horizontal rule
Ctrl-Alt-A	Create anchor
Ctrl-Alt-L	Create link
Ctrl-Alt-D	Unlink
Ctrl-Alt-N	Turn off autolinking
Ctrl-Alt-I	Insert image
Ctrl-Alt-T	Insert table
Ctrl-Alt-S	Insert emoticon
Ctrl-Alt-C	Insert special character

Code editing

The [<>] button changes the display window to raw HTML code. This can be useful for those of you that know how to use it (or want to learn!). Most of the buttons do not work there, not even the Search and Replace unfortunately.

See also

• Page content - for more assistance on using some of above editing icons
• HTML in Moodle
• Editor settings
• Using Moodle HTML editor forum
• Using Moodle Question about insert image function in HTML editor forum discussion, including methods of enabling students to insert images using the HTML editor
• Using Moodle Need to display english special phonetic symbols for ESL students forum discussion