Web Page Editor

The Web Page Editor is a what-you-see-is-what-you-get (WYSIWYG) frame that offers full page editing. Page editing functions are represented as buttons in the toolbar.

Editing is performed with the same basic methods used to edit pages in a word processor. Simply typing text into the frame is all that's necessary to add new copy to a web page. Highlight existing text before applying functions such as Bold, Italic, or Insert Hyperlink. The same keyboard shortcuts users are accustom to using in most word processors also apply to the OmniUpdate Web Page Editor.

The Web Page Editor is accessed after a user has logged in to OmniUpdate, selected a page for editing.




To complete editing and save a page, simply click the Save icon in the top left corner of the toolbar.


A complete list of WYSIWYG toolbar functions follows:


The Toolbar
WYSIWYG Toolbar
OVERVIEW:
The Toolbar (shown above) offers many of the standard formatting commands used in word processors and standard web page editing products. In OmniUpdate, you are not limited to just these formatting commands. If you are familiar with HTML, you can switch to OmniUpdate's HTML editor to enter more precise commands, edit META tags, page titles, JavaScript and more.

Note: It is a good idea to save your changes often!
The following is a description of each formatting command available in the Toolbar.

 

File Functions

Save

Click the Save button to save your current file.

Save as

Click the Save As button to save your current file back to the server, with the option to rename the file

Revert

Click the Revert button to return your file back to its condition before you last saved it.

Cut, Copy, Paste Functions

Cut

Click the Cut button to cut the highlighted selection.

To cut a portion of the document, highlight the desired portion and click the 'Cut' icon (keyboard shortcut - CTRL+X).

Copy

Click the copy button to copy your selection.

To copy a portion of the document, highlight the desired portion and click the 'Copy' icon (keyboard shortcut - CTRL+C).

Paste

To paste a portion that has already been cut (or copied), click where you want to place the desired portion on the page and click the 'Paste' icon (keyboard shortcut - Ctrl+V).

To paste from Microsoft Word, click on the drop down icon next to the Paste Icon and select 'Paste From MS Word' (keyboard shortcut - Ctrl+D). To paste from Microsoft Word with Remove Text Formatting, click on the drop-down menu and select 'Paste No Text Format' (keyboard shortcut - Ctrl+E)

Paste from Microsoft Word (Ctrl + D)

To Paste from Microsoft Word: Copy your desired text from Microsoft Word and click the drop down icon next to the paste icon. Select the 'Paste from MS Word Option'. This will remove the tags that Microsoft Word automatically places around your text. It will also remove most text formatting as well.

Paste Clean (Ctrl + E)

In addition to what 'Paste from Microsoft Word' does, 'Paste Clean' removes Text Formatting tags (<font>, <em>, <strong>, <b>, <sup>, <sub>, <strike>, <u>).

Find & Replace
Find & Replace

To find and replace words or phrases within the text:
Select the search and replace feature. Enter the word or phrase you wish to replace and type it in the 'Find what' field

Select the new word or phrase you wish to replace the searched text with in the 'Replace with' field.

You can choose to 'find next' which allows you to manually replace instances of the searched text, or you can choose 'replace all' which allows you to replace all instances of the selected text.

Selecting the optional 'Match Case' tab allows you to search for a word or phrase with exactly the same upper or lower-case spelling of the word or phrase entered in 'Find What'. Not selecting this option means that a word entered in the 'Find what' field with upper case characters will return a search of upper and lower case matches of the same word.

Selecting the optional 'Match whole word only' tab allows the search to only display the words that are an exact match of the word or phrase entered in the 'Find What' field.
Text Functions

Check Spelling

To check spelling, click on the spell checker icon or right click on the mouse and scroll down to 'Check spelling'.

You will be taken to the first incorrectly spelled word. You can then choose to

- Change the incorrectly spelled word with the suggested words provided
- Ignore the incorrectly spelled word (i.e. not make any changes to it).

Remove Text Formatting

This command allows you to select a specific portion of text and remove any of the formatting which it contains. To remove any text formatting select the desired portion of text and Click the 'Remove Text Formatting' button.

Undo & Redo Functions

Undo

To undo the last change, click the 'Undo' icon (keyboard shortcut - CTRL+Z). Each consecutive click will undo the previous change to the document.

Redo

To redo the last change, click the 'Redo' icon (keyboard shortcut - CTRL+Y). Each consecutive click will repeat the last change to the document.

Basic Font Properties

Bold

Turns selected text into bold text

Italicize

Turns selected text into italicized text.

Underline

Turns selected text into underlined text. Please note that underlined text usually means that a word or phrase is a link to another web page.  In this case however, the underline formatting does not create a link (to create a link, see "Link Button" below).

Strike Through

Turns selected text into underlined text. Please note that underlined text usually means that a word or phrase is a link to another web page.  In this case however, the underline formatting does not create a link (to create a link, see "Link Button" below).

List Functions

Numbered List

Turns the selected text into a numbered list. Example:

  1. The first subject is...
  2. Next I'd like to point out that...
  3. Finally we can see that…

Bulleted List

Turns the selected text into a bulleted list.  Example:

  • Eggs
  • Milk
  • Watermelon
Indent Functions

Indent Add

To increase indent of a paragraph, click the 'Increase Indent' icon. Each consecutive click will move text further to the right.

Indent Minus

To decrease indent of a paragraph, click the 'Decrease Indent' icon. Each consecutive click will move text further to the left.

Alignment Functions

Left Align

Moves all selected text to the left.

Center Align

Centers all selected text.

Right Align

Moves all selected text to the right.

Justify

Justifies the selected text from left to right.

Script Text

Superscript

To convert text to superscript (vertically aligned higher): Select the desired portion of text and click the 'Superscript' icon. Each consecutive click will toggle this function on and off.

Subscript

To convert text to subscript (vertically aligned lower): Select the desired portion of text and click the 'Subscript' icon. Each consecutive click will toggle this function on and off.

Link Tools

Insert Link

To create a hyperlink, select the text or image to create the link on, then click the 'Create or Modify Link' icon. If applicable, the pop-up window will contain existing link information. You can use the link manager to navigate to the page you want to link to. You can also type the full URL of the page you want to link to in the URL text box. You can also enter the target window information (optional) and an anchor name (if linking to an anchor - optional).

When finished, click the 'Insert Link' button to insert the hyperLink you just created, or click 'Remove Link' to remove an existing link. Clicking 'Cancel' will close the window and take you back to the editor.

Insert Mail To Link

To create an e-mail link, select text or an image on the web page you are editing where you would like the link to appear. Click the 'Create Amyl Link' icon. In the dialogue box, type the amyl address for the link and the subject of the amyl

When finished, click the 'OK' button to insert the amyl link, or 'Cancel' to close the box.

Insert Anchor

To insert an anchor, select a desired spot on the web page you are editing and click the 'Insert / Modify Anchor' icon. In the dialogue box, type the name for the anchor.

When finished, click the 'OK' button to insert the anchor, or 'Cancel' to close the box.

To modify an anchor select the anchor (displayed as an anchor icon when guidelines are switched on) and click the 'Insert / Modify Anchor' icon. Make your changes and hit the 'OK' button or click 'Cancel' to close the window.

Help Tool

Open Help Page

To access the help for the toolbar simply click the help icon.

Font Properties

Font Family

This button gives you a drop-down list of the standard fonts recognized by most web browsers. To change the font of existing text, select the text and choose a font from the drop-down list. To start typing new text with a specific font, click the cursor where you wish to begin typing, select a font from the drop-down list, then begin typing. To use a font that is not available in the list, choose "Custom..." and a pop-up screen will ask you to enter the new font's name. Keep in mind that custom fonts may not be available for display in all browsers.

Font Size

This button lets you change the size of any selected text. Size 1 is the largest, 3 is in the middle, and 7 is the smallest. To start typing new text with a specific font size, click the cursor at the position where you wish to begin typing, select a size from the drop-down list, then begin typing. 

Font Paragraph

The Paragraph button is a drop-down list of several actions that can be used to change the formatting of a selected paragraph. To select a paragraph, simply click the cursor once anywhere inside the paragraph. The following functions can be then be used:  

Normal <p>  - Sets the selected paragraph to normal.

Headings <H1> through Heading 6 <H6> - Sets the selected paragraph to a specific heading size between 1 (the largest) and 6 (the smallest).

Pre <PRE> - Sets the selected paragraph format to no text wrap.

Font Paragraph

To apply a class simply select a span class from the drop down menu.

Please note that the page must include a list of CSS files to populate the drop down list.

Font Color

This button lets you pick the color of any selected text. There are 18 color choices and a custom option to let you enter any standard HTML color value. To start typing new text with a specific font color, click the cursor where you wish to begin typing, select a color from the drop-down list, then begin typing. 

Font Background Color

This button lets you pick the background color of any selected text. There are a range of color choices and a custom option to let you enter any standard HTML color value. To start typing new text with a specific font color, click the cursor at the position where you wish to begin typing, select a color from the drop-down list, then begin typing. 

Table Tools

Table Functions

To insert or modify a table or cell, select the 'Table Functions' icon to display a list of available Table Functions.

If a Table Function is NOT available, you will need to select, or place your cursor inside the table you wish to modify.

 

Insert Table

To insert a table, select the desired location, then click the 'Insert Table' icon.

A new window will pop-up with the following fields: Rows - number of rows in table; Columns - number of columns in table; Width - width of table; BgColor - background color of table; Cell Padding - padding around cells; Cell Spacing - spacing between cells and Border - border around cells.

Fill in table details then click the 'OK' button to insert table, or click 'Cancel' to go back to the editor.

 

Modify Table Properties

To modify table properties, select a table or click anywhere inside the table to modify, then click the 'Modify Table Properties' icon.

A pop-up window will appear with the table's properties. Click the 'OK' button to save your changes, or click 'Cancel' to go back to the editor.

Note: this function will not work if a table has not been selected.

 

Modify Cell Properties

To modify cell properties, click inside the cell to modify, then click the 'Modify Cell Properties' icon.

A pop-up window will appear with the cells' properties.

Click the 'OK' button to save your changes, or click 'Cancel' to go back to the editor.

Note: this function will not work if a cell has not been selected and does not work across multiple cells.

 

Insert Column to the Right

To insert a column to the right of your cursor, click inside cell after which to insert a column, then click the 'Insert Column to the Right' icon.

Each consecutive click will insert another column after the selected cell.

Note: this function will not work if a cell has not been selected.

 

Insert Column to the Left

To insert column to the left of your cursor, click inside cell before which to insert a column, then click the 'Insert Column to the Left' icon.

Each consecutive click will insert another column before the selected cell.

Note: this function will not work if a cell has not been selected.

 

Insert Row Above

To insert row above, click inside cell above which to insert a row, then click the 'Insert Row Above' icon.

Each consecutive click will insert another row above the selected cell.

Note: this function will not work if a cell has not been selected.

 

Insert Row Below

To insert row below, click inside cell below which to insert a row, then click the 'Insert Row Below' icon.

Each consecutive click will insert another row below the selected cell.

Note: this function will not work if a cell has not been selected.

 

Delete Row

To delete a row, click inside cell which is in the row to be deleted, then click the 'Delete Row' icon.

Note: this function will not work if a cell has not been selected.

 

Delete Column

To delete a column, click inside cell which is in the column to be deleted, then click the 'Delete Column' icon.

Note: this function will not work if a cell has not been selected.

 

Insert Column

To insert a column, click inside cell which is in the column to be inserted, then click the 'Insert Column' icon.

Note: this function will not work if a cell has not been selected.

 

Decrease Column Span

To decrease column span, click inside cell who's span is to be decreased, then click the 'Decrease Column Span' icon.

Each consecutive click will further decrease the column span of the selected cell. Note: this function will not work if a cell has not been selected.

Form Tools

Form Functions

To insert or modify a form, select the 'Form Functions' icon to display a list of available form functions. If a form function is NOT available, you will need to place your cursor inside the form you wish to modify.

Insert Form

To insert a form, select desired position then click the 'Insert Form' icon. A new window will pop-up with the following fields: Name - name of form; Action - location of script that processes the form and Method - post, get or none. Fill in form details or leave blank for a blank form. When finished, click the 'OK' button to insert form, or click 'Cancel' to go back to the editor.

Modify Form Properties

To modify form properties, click anywhere inside the form to modify, then click the 'Modify Form Properties' icon. A pop-up window will appear with the form's properties. Click the 'OK' button to save your changes, or click 'Cancel' to go back to the editor. Note: this function will not work if a form has not been selected.

Insert / Modify Text Field

To insert a text field, select the desired position then click the 'Insert/Modify Text Field' icon.

A pop-up window will appear with the following attributes: Name - name of text field; Character width - the width of the text field, in characters; Type - type of text field (Text or Password); Initial value - initial text in field and Maximum characters - maximum number of characters allowed.

Set the attributes then click the 'OK' button to insert text field, or click 'Cancel' to go back to the editor.

To modify a text field's properties, select desired text field and click the 'Insert/Modify Text Field' icon.

A pop-up window will appear with the text field's attributes.

Modify any attributes desired, then click the 'OK' button to save changes, or click 'Cancel' to go back to the editor.

Insert / Modify Text Area

To insert a text area, select the desired position then click the 'Insert/Modify Text Area' icon

A pop-up window will appear with the following attributes: Name - name of text area; Character width - the width of the text area, in characters; Initial value - initial text in area and Lines - number of lines allowed in the text area.

Set the attributes then click the 'OK' button to insert the text area, or click 'Cancel' to go back to the editor.

To modify a text area's properties, select desired text area and click the 'Insert/Modify Text Area' icon.

A pop-up window will appear with the text area's attributes.

Modify any attributes desired, then click the 'OK' button to save changes, or click 'Cancel' to go back to the editor.

Insert / Modify Hidden Area

To insert a hidden field, select desired position then click the 'Insert/Modify Hidden Field' icon.

A pop-up window will appear with the following attributes: Name - name of hidden field and Initial value - initial value of hidden field.

Set the attributes then click the 'OK' button to insert the hidden field, or click 'Cancel' to go back to the editor.

To modify a hidden field's properties, select desired hidden field and click the 'OK' icon.

A pop-up window will appear with the hidden field's attributes.

Modify any attributes desired, then click the 'OK' button to save changes or click 'Cancel' to go back to the editor.

Insert / Modify Button

To insert a button, select desired position then click the 'Insert/Modify Button' icon.

A pop-up window will appear with the following attributes: Name - name of text area; Type - type of button (Submit, Reset or Button) and Initial value - initial text on the button.

Set the attributes then click 'OK' to insert button, or click 'Cancel' to go back to the editor.

To modify a button's properties, select desired button and click the 'Insert/Modify Button' icon.

A pop-up window will appear with the button's attributes.

Modify any attributes desired, then click the 'OK' button to save changes or click 'Cancel' to go back to the editor.

Insert / Modify Checkbox

To insert a checkbox, select desired position then click the 'Insert/Modify Checkbox' icon.

A pop-up window will appear with the following attributes: Name - name of checkbox; Initial state - checked or unchecked and Initial value - value of checkbox.

Set the attributes then click the 'OK' button to insert the checkbox, or click 'Cancel' to go back to the editor.

To modify a checkbox' properties, select desired checkbox and click the 'Insert/Modify Checkbox' icon.

A pop-up window will appear with the checkbox' attributes.

Modify any attributes desired, then click the 'OK' button to save changes or click 'Cancel' to go back to the editor.

Insert / Modify Radio Button

To insert a radio button, select desired position then click the 'Insert/Modify Radio Button' icon.

A pop-up window will appear with the following attributes: Name - name of radio button; Initial state - checked or unchecked and Initial value - value of radio button.

Set the attributes then click 'OK' to insert the radio button, or click 'Cancel' to go back to the editor.

To modify a checkbox' properties, select desired checkbox and click the 'Insert/Modify Radio Button' icon.

A pop-up window will appear with the checkbox' attributes.

Modify any attributes desired, then click the 'OK' button to save changes or click 'Cancel' to go back to the editor.

Insert / Modify Select Field

To insert a select field, select the desired position then click the 'Insert/Modify Select Field' icon.

A pop-up window will appear with the following attributes: Name - name of the select list; Current Options - The options available for selection in the list; Type - how the list will be displayed (a single option, or multiple options); Size - how many list items will be shown; Style - The style to be applied to this select field, if any.

To add options to the select list, use the text, value and selected boxes under the 'Maintain Options' heading.

To modify a select lists properties, select the desired list and click the 'Insert/Modify Select List' button. A pop-up window will appear with the select lists attributes.

Modify the desired attributes, then click the 'OK' button to save changes or click 'Cancel' to go back to the editor.

Misc. Graphics Tools

Insert / Modify Image

If an image is NOT selected, clicking this icon will open the Image Manager.

If an image IS selected, then clicking this icon will open the 'Modify Image Properties' pop-up window.

To modify the image properties of the selected image, set the required attributes and click the 'Modify' button.

Horizontal Line

Horizontal Line is clicked to create a horizontal line break with a relative size (100%).  To change the horizontal line break to a fixed width, simply click and drag either end of the line.

Break

Insert Break - Same as hitting the keys shift and return at the same time. This creates a single line return.

Special Character

To insert a special character, click the 'Insert Special Character' icon.

A pop-up window will appear with a list of special characters.

Click the icon of the character to insert into your web page.

Clean HTML Code

To clean HTML code, click the 'Clean HTML Code' icon.

This will remove any empty span and paragraph tags, all xml tags, all tags that have a colon in the tag name (i.e. ) and remove style and class attributes.

This is useful when copying and pasting from Microsoft Word documents to remove unnecessary HTML code.

Show Borders

To show or hide guidelines, click the 'Show/Hide Guidelines' icon.

This will toggle between displaying table and form guidelines and not showing any guidelines at all.

Tables and cells will have a broken gray line around them, forms will have a broken red line around them, while hidden fields will be a pink square when showing guidelines.

Note that the status bar (at the bottom of the window) will reflect the guidelines mode currently in use.

Zoom

To zoom the page in or out you can use the zoom button.

Show HTML Code

To Edit HTML code click the HTML Button.

 

 

Your browser combination will load the Internet Explorer Editor
To switch to applet help

click here