Product Documentation

The HTML Area is available as an editor for HTML Area fields, custom email composition and several other utilities, allowing the user to enter rich text or HTML into a field without knowing the HTML code set. It offers many features similar to a word processor, and allows the user to switch to directly edit the HTML.   The editor uses the open source CKEditor software and is fully integrated into ExtraView.

There are three available pre-customized toolbars asshown in the following screenshots.  The selection is site-wide, and made via the behavior setting named EDITOR_TOOLBAR.  Set the value to BASIC, STANDARD or FULL according to the needs of your configuration.  The HTML Area utility makes use of scriJavaScript that runs within the browser, and according to the security settings of the browser, the user may need to acknowledge that it is OK to run these scripts.

Basic Toolbar

Standard Toolbar

Full Toolbar

The use of the HTML Area field is intuitive.  The user simply enters text and uses the buttons on the toolbar to provide the formatting. 

As an administrator, you may customize your own toolbar via the UserJavaScript.js file.  See the User Custom Guide for information.

The available toolbar buttons are:

Basic	Standard	Full	Button	Function
✓	✓	✓		Toggle bold on and off for the selected text
✓	✓	✓		Toggle italic text on and off for the selected text
✓	✓	✓		Toggle underlined text on and off for the selected text
✓	✓	✓		Remove text formatting from the selected text
✓	✓	✓		Toggle a numbered list for the selected text
✓	✓	✓		Togle a bulleted list for the selected text
✓	✓	✓		Add a link to the selected text
✓	✓	✓		Remove the link from the selected text
✓	✓	✓		Print the contents of the HTML Area
	✓	✓		Toggle the display mode between "what-you-see-is-what-you-get" and HTML source views
	✓	✓		Cut the selected text to the clipboard
	✓	✓		Copy the selected text to the clipboard
	✓	✓		Paste the text from the clipboard to the cursor position
	✓	✓		Paste the text, as plain unformatted text, from the clipboard to the cursor position
	✓	✓		Paste text from Microsoft Office documents - this will remove the obscure formatting that Microsoft Office documents often contain
	✓	✓		Undo the last operation
	✓	✓		Redo the last operation that was undone
	✓	✓		Use a style from the list.  Note that there are interdependencies with the Style, Format, Font and Size lists.  Not all combinations work with all computers, as your browser, or computer operating system may not support the combination you choose
	✓	✓		Format the text from the selections within the list.  Note that there are interdependencies with the Style, Format, Font and Size lists.  Not all combinations work with all computers, as your browser, or computer operating system may not support the combination you choose
	✓	✓		Select a font from the selections within the list.  Note that there are interdependencies with the Style, Format, Font and Size lists.  Not all combinations work with all computers, as your browser, or computer operating system may not support the combination you choose
	✓	✓		Set a size for the text from the selections within the list.  Note that there are interdependencies with the Style, Format, Font and Size lists.  Not all combinations work with all computers, as your browser, or computer operating system may not support the combination you choose
	✓	✓		Set a color for the selected text
	✓	✓		Set a background color for the selected text
	✓	✓		Mximize / Restore the size of the HTML Area within the browser
	✓	✓		Strikeout the selected text
	✓	✓		Subscript the selected text
	✓	✓		Superscript the selected text
	✓	✓		Outdent the selected text
	✓	✓		Indent the selected text
	✓	✓		Place the selected text in blockquotes
	✓	✓		Place the selected text in an HTML DIV
	✓	✓		Left-justify the selected text
	✓	✓		Center-justify the selected text
	✓	✓		Right-justify the selected text
	✓	✓		Full-justify the selected text
	✓	✓		Insert an HTML text anchor tag
	✓	✓		Insert an image
	✓	✓		Insert a table
	✓	✓		Insert a horizontal rule
	✓	✓		Insert a smiley face
	✓	✓		Insert a character symbol
	✓	✓		Insert an HTML Iframe
		✓		Search for text within the HTML Area field
		✓		Search and replace text within the HTML Area field
		✓		Select all the text within the HTML Area field
		✓		Text direction goes from left-to-right (the default)
		✓		Text direction goes from right-to-left
		✓		Insert a page-break for printing