|
|
|
|
|
|
|
When you create or select the component, the window will switch to the RTE Editor window. In the section provided, enter in the text that you would like to display on the Web page. Edit existing text as you wish; any formatting applied to it will not be lost. HTML code will not be interpreted in this section, so the HTML code will actually appear on the Web page itself. If you want to use HTML code, you must use a Literal Component.
The text entered in to the text area will be displayed as formatted. You may type new text and then format it, or set the formatting first.
When typing in the RTE window, the text will be given the Paragraph Format, meaning that when you hit Enter/Return to move to the next line, there will be an empty line between your lines of text. You can avoid this by holding the Shift key while clicking Enter/Return.
The remainder of this tutorial is about how to format your text.
Back to Add/Edit Text
Back to the Top of the Page
To apply a format option, you click the appropriate icon. If you are unsure what an icon does, hover your mouse over it. A brief description will appear. Following is an example of the RTE editor control bar.
Click on an icon in this control bar to find out what it does:
Or if you know the kind of formatting that you wish to perform, click its link in the following list:
To remove a link, simply select the linked text and then click the Unlink icon.
Back to Formatting
Insert an Anchor (A Named Location)
You insert an "anchor" (also called "bookmark") so that other pages or sections of the page can link directly to that part of the page. You may have reached this help subtopic by clicking such a link. Each anchor name needs to occur only once on its page; otherwise, it will not work. When you create a link to the anchor, remember to begin the link with a pound sign ("#").
Back to Formatting
Clean up formatting (useful after making many changes)
As you change the formatting of text in your RTE component, invisible control codes accummulate. These can create clashes so that your text does not display as expected, and it will make the page a bit slower to load. Fix this by clicking the Cleanup Messy Code icon. Don't worry if nothing seems to happen. Cleanup improves the behind-the-scenes functioning of the component.
Back to Formatting
Edit the Underlying HTML Code (Advanced Use Only)
Advanced users can clean up messy formatting manually, by clicking the HTML icon. A window will appear displaying the underlying HTML code. Add or remove basic tags. Advanced tags such as MARQUEE will be discarded as will any HTML tags that contain errors. Click the "Update" button to confirm your HTML changes and close the HTML window. The editor will refresh based on your changes.
Back to Formatting
Insert and Edit Image
An image can be inserted into your rich text component by clicking the Add/Edit Image icon. A new window
will open. Click the "General" tab to identify the location of the image that you wish to use and to set the image's title and description. Click the linked text next to "Image" to bring up the Select Image window. Once you have selected your image, it will appear full-sized in the preview area of the General section. Scrollbars are provided to see the entire image, if it is larger than the preview area.
Click the "Appearance" tab to set the image's alignment, display dimensions, horizontal and vertical space (blank space around the image), and more. Note that the image preview that appears in the General section is full sized; it will not reflect the display height and width that you specify in the Appearance section.
Click the "Advanced" tab to set a "swap" image (also called mouseover or rollover). You need to enter the addresses of two images: the image that will appear when a visitor hovers the mouse over the original image's location (called "mouse over"), and the image that will appear when the visitor moves the mouse to another location on the page (called "mouse out"). Advanced users may wish to take advantage of the other Advanced settings such as using an image map. We cannot offer technical support for how to create image maps. Note simply that you would put the image map code into a literal component on the same page on which the RTE is located. Then in the Advanced section of the RTE image, enter the name that you assigned to your image map.
The initial Insert Image window |
Selecting an image |
The image is previewed |
The image is now displayed in the editor |
Important Notes:
The easiest way to insert the date and time into a page is via the RTE component. Click the location in the RTE where the date or time is to appear. Then click the Date icon to insert the date, or the Time icon to insert the time. The inserted date or time will be normal editable text, once you insert it. No spaces or line breaks will be inserted before or after the date and time, so be sure to enter those manually.
Back to Formatting
Set the Text and Background Font Colors
You can change the color or your text and of the background against which it appears, via the color icons. The picture of a palette sets the text color, and the picture next to it containing the letters "ab" sets the background color. These colors are also used for horizontal lines, table border and background colors, and much more.
Set the color by clicking the Text Color or Background Color icon. A list of the site's palette colors will appear. Select a color from the list by clicking on the desired colored box, or scroll to the end of the list and click "Add Color" to use a color not yet in the list. Click here for more information about selecting colors.
Back to Formatting
Insert a New Table or Edit the Properties of the Current Table
You can insert tables into your RTE component as a way of organizing its content. Begin by clicking the New Table icon. A window will appear. Use its options to set the table's properties (border, cell padding, etc.). Then use the other table icons located on the same row of the editor, to fine tune your table. Add content to the table by clicking in the cell in which you want the content to appear. If your table doesn't have a border, you can turn on hidden guidelines to see where it is. To delete a table, select all of its content and click the keyboard delete key.
Important Notes:
Notice the menu in the bottom left corner of the General section. Use it to apply the changes not only to the current cell but to others in the same row or all cells in the table, if desired.
If you make a mistake, use the Undo icon to undo your changes until the table is back the way you had it.
Back to Formatting
Add and Delete Table Columns
When you add a table, you specify how many columns and rows you want it to contain. You may add more columns later by clicking in a cell of the table, and then clicking one of the icons to add a new column. If you click the Insert Column Before icon, the new column will appear just to the left of the cell that your cursor is in. If you click Insert Column After, then the new column will appear just to the right of the cell that your cursor is in. To remove a column from the table, click any cell in that column, and then click the Remove Column icon.
If you make a mistake, use the Undo icon to undo your changes until the table is back the way you had it.
Back to Formatting
Merge Table Cells
Normally, a table has the same number of cells in every row and column, like a chessboard. You can create a more interesting arrangement by merging some cells so that they span several rows or columns. Click in the starting cell and then click the Merge Cells icon. Enter the number of rows or columns to merge, including the starting cell. Click the update button. The window will close and the editor will display the table with the new cell arrangement. All content that had been in the individual cells will occupy the same cell now.
To remove formatting from text, select it and then click the Remove Formatting icon. All formatting will be removed; clicking the icon again will not put it back. Instead, use the Undo icon to put the formatting back if you clear it by mistake.
Back to Formatting
Show or Hide Controls Such as the Table Guidelines
The Guidelines icon is handy for displaying the edges of a table and its cells, if the table has no border. Click the icon once to display the guidelines, and then click it again to hide them. The guidelines will not appear on the published page.
Back to Formatting
Insert Subscripts and Superscripts
To turn text into subscripts or superscripts, use the Subscript and Superscript icons. Subscripts display slightly lower on a line than normal text. Superscripts appear slightly higher on the line. Proceed by clicking the subscript or superscript icon (depending upon the effect that you wish to achieve), and then type the text. Or type the text, select it, and then click the icon. Toggle back to normal text by clicking the icon again while the subscripted or superscripted text is selected.
Back to Formatting
Insert Special Characters
To insert special characters such as the copyright symbol into your rich text, click the Custom Character icon. A character map window will appear. Hover your mouse over the characters, and they will appear in a larger preview in the upper right section of the map window. Click on a character once to add it. You may continue clicking on characters to add them from the map. When finished, click the "X" at the top right of the map window to close it.
Back to Formatting
Print the text
The Print icon opens your browser's standard print dialog. Use it to print the contents of the RTE
component.
Back to Formatting
Check Your Spelling
Once you have entered your text, click the Spellcheck icon to check for errors. This option is
unavailable for Netscape and Mozilla users
Back to Formatting
Open the RTE Editor Help Window
While you are in the RTE editor, you can open its help window by clicking the Question Mark icon.
Back to Formatting
Save Your Changes
When you are all done formatting this rich text component, click on the Disk icon to save your new text and formatting to the Web page. You can also save by clicking the Update button at the bottom of the window. You will still need to Publish the Web page in order for visitors to see your changes.
Back to Formatting
Example of Completed RTE
Here is an example of a completed rich text component (RTE) with its text and image arranged within a table. The table's border width is set to zero (no border). For convenience while editing, guidelines are turned on. They will not appear on the published page.