Portfolio Sites/ Services/ Tools/ Calendar/ Contact Us/ Site Map/ Search
Home > Tools > Manuals > Page Editor
The Page Editor

Contents:

Paragraph StyleBoldItalic|Left JustifyCenterRight Justify|Bullet ListNumbered List|LinkImagesAnchor|TableTable Cell Background|Horizontal BarHorizontal Bar Color|View AnchorsView Table Grid Lines|Side MenuPreviewSaveExit


Introduction

The Page Editor is the main tool for editing webpage content. Use it to define a page's Title, Short Title, Side Menu Graphics, and body text. If the page is an index.htm file, use it to define the Side Menu links.

The Page Editor can be opened in "what-you-see-is-what-you-get" mode using the [Edit] commands on the Edit Contents, the Spell, the Local Links, and the Off-Site Links Checker pages. It can be opened in Markup mode using the corresponding [MEdit] commands.

The Page Editor opens in a separate browser window. The image below shows what an early version of this page looked like in the Page Editor (shown here possibly with different colors and fonts than those on your site):

 Page Editor

Page Lock

When the Page Editor is opened, it places an Edit Lock on the file it is editing to prevent others from editing it at the same time. If the file is open for edit by another user (or by you in another editor window) it asks if you want to delete the edit lock. Delete locks only when a browser crash has left stale edit locks or another user has accidentally failed to close an editor. Deleting a lock automatically sends mail to the other user to report that the lock was removed.

Titles

The top of the Page Editor displays the Title and Short Title of the page being edited. The Title appears in large type at the top of the page itself and on the Site Map page. The Short Title is shown on Side Menus that link to the page and on various Administrative pages. Click on either to open the Page Titles dialog:

Page Titles Dialog

Enter titles in the text boxes.

Control Bar Contents

A variety of controls are available on the top menu bar. They are enabled or disabled depending on the position of the cursor and the nature of the text selection; some only work on a range of text and some only work when no text is selected.

Paragraph Style

Sets paragraph style of the selection from a pull down menu:

Ctrl+9

Normal : A normal paragraph. The first line isn't indented. Extra space above it separates it from preceding page contents.

Ctrl+0

Zero Space : A normal paragraph with no extra space above it. Useful in tables and immediately following section headings.

Ctrl+1

Heading 1 : A section heading paragraph.

Ctrl+2

Heading 2 : A second-level section heading paragraph or a custom style defined for a template on your site.

Ctrl+3

Heading 3 : A third-level section heading paragraph or a custom style defined for a template on your site.

Ctrl+4

Heading 4 : A fourth-level section heading paragraph or a custom style defined for a template on your site.

Ctrl+5

Heading 5 : A fifth-level section heading paragraph or a custom style defined for a template on your site.


All paragraphs types set from the pull down menu can optionally be left justified, centered, or right justified using the Left JustifyCenterRight Justify controls.

The pull down menu automatically displays the style of the paragraph with the cursor. If a range of text is selected, then the style of the paragraph under the left edge of the selection is displayed.


Bold

Ctrl+B

Toggles selected text to or from bold . Can be used with italic.


 Italic

Ctrl+I

Toggles selected text to or from italic . Can be used with bold.


Left Justify

Ctrl+L

Left justifies non-list paragraphs and images.


 Center

Ctrl+E

Centers non-list paragraphs and images.


 Right Justify

Ctrl+R 

Right justifies non-list paragraphs and images.


Bullet List

Ctrl+7

Toggles selected paragraphs to or from a Bullet list. Bullet lists are always indented and left-justified.


 Numbered List

Ctrl+8

Toggles selected paragraphs to or from a Numbered list. Numbered lists are always indented and left-justified.

Link

Opens the Hyperlink dialog, which can be used to turn selected text into a hyperlink , remove hyperlinks from selected text, or to edit hyperlink properties:

Hyperlink Dialog

Enter the URL for the hyperlink in the text box. Press one of the Type buttons to insert or change the prefix of the URL:

  • On-Site : URLs for other pages on this site start with "/", where "/" represents the root directory (the directory of the home page). For example, a link to this page would be "/tools/man/wedit.htm".
  • Anchor : URLs for anchors on the same page on this site start with "#" followed immediately by the label of the anchor (for example, "#my_tag").
  • Off-Site : URLs for pages on other sites start with "http://". For example, the URL for a link to Google is: http://www.google.com
  • Email : URLs for Email links start with "mailto:".

If a hyperlink is selected when the dialog is opened, the hyperlink's URL will appear in the text box.

To automatically load an existing link address into the URL box, select a link from the Links select list.

Press the Remove hyperlink button to remove the hyperlink from the selected text. (The dialog closes immediately when you press this button.)


Images

Opens the Images dialog, which can be used to insert images on the page, to change the Alternate Text and Text Flow of existing images:

Images Dialog

Select the image from the Image pull down menu, which shows all of the images that have been uploaded to the General Images Directory on the Edit Content page. A thumbnail of the selected image is shown on the dialog.

Enter alternate text for the image in the Alternate Text text box. (Alternate text displays as a tooltip in most browsers when the cursor hovers over the image.)

The Text Flow radio buttons control how text flows around the image:

  • Left : flows text around the left side of the image. The image shifts to the right edge. To align an image without flowing text, align the containing paragraph or table cell.
  • Right : flows text around the right side of the image. To align an image without flowing text, align the containing paragraph or table cell.
  • None : does not flow text around the image. Adjoining text starts aligned with the bottom of the image.

If an existing image is selected when the dialog is opened, the image's name will be selected on the pull down menu, the image's Alternate Text will appear in the textbox, and the image's Text Flow setting will appear on the radio buttons. Upon completion, that image's settings will be modified.


Anchor

Opens the Anchor dialog, which can be used to insert invisible on-page link anchors on the page and to change the name of existing anchors:

Anchor Dialog

Anchors are used as targets of on-page links, like the "Content" links seen at the top of this page.

Enter the Anchor Name in the textbox. (The '#' is there to remind you that hyperlinks to Anchors must start with a #.) Anchor Names should be alphanumeric characters and must not contain spaces.

If an existing Anchor is selected when the dialog is opened, the Anchor's name will appear in the textbox.

Anchors are invisible on normal pages and are only visible in the Page Editor when the Anchors Display command is on.


Table

Opens the Table Row dialog, which is used to insert tables on the page and to change the properties of existing tables:

Table Dialog

Set the number of cells in the table using the Cells pull down menu. Set the alignment of the contents of the cells using the Align radio buttons. Set the width of the cells by entering Width s (1-100) into the text boxes. Cell sizes should add up to (approximately) 100.

If the row contains more than one cell, two automatic sizing buttons appear on the dialog:

  • All the same width: Makes all the cells the same width.
  • Adjust Sum: adjusts the value of the last cell so the sum of all the cells is 100.

The Replace check box appears whenever the cursor is in a table row when the dialog is opened. It controls how the settings in the dialog are applied:

  1. If Replace is checked, the settings will replace the existing row. If the number of cells decreases, then the contents of the extra cells will be discarded.
  2. If the Replace is not checked, then a new table row will be added above the current row.

Tables are always inserted above the line containing the cursor.

Special Sorted Tables are available on some sites. Read more about them here.


Table Cell Background

Ctrl+K

The "bucket" icon sets the background of the selected table cell to the color shown below the bucket.

The down arrow opens a color palette for choosing the background color of table cells:

Table Cell Color Palette Dialog

Both Site-Coordinated and Generic colors are shown. Click on a color to select it. If you want to remove all color, letting the background show through, click on "None".

If a colored cell is selected when the dialog is opened, the cell's color will be marked with a black border. For example, the fifth "gray" color is marked in the dialog shown above.

Sorted Tables do not use the background colors set in the Page Editor.


Horizontal Bar

Opens the horizontal rule dialog, which is used to add horizontal rules and edit their properties:

Horizontal Rule Dialog

Set the alignment of the rule using the Align radio buttons. Set the width of the rule by entering a Width (1-100) into the text box.

If a horizontal rule is selected when the dialog is opened, the settings for that rule will be displayed. Upon completion, that rule will be modified.


 Horizontal Bar Color

The "paint brush" icon sets the color of the selected horizontal rule to the color shown below the brush.

The down arrow opens a color palette for choosing the color of the horizontal rule:

Horizontal Rule Color Palette Dialog

Both Site-Coordinated and Generic colors are shown. Click on a color to select it.

If a horizontal rule is selected when the dialog is opened, the rule's color will be marked with a black border. For example, the second "line" color is marked in the dialog shown above.


View Anchors

Toggles the display of link anchors. Link anchors, which are invisible on normal pages, are displayed as small red anchors : Anchor Flag


 View Table Grid Lines

Displays grid lines on tables.


Side Menu

Sets the contents of the Banner and the Side Menu:

Side Menu Dialog

The page's Banner Image can be set to:

  • Default site banner : the default banner shared by all pages on the site.
  • Parent directory's banner : the banner shown in the directory that contains this directory. (This option only appears when editing index.htm files.)
  • Directory banner : the banner set in this directory's index.htm file. (This option doesn't appear when editing index.htm files.)
  • Other images that have been uploaded into the site's the Banner Graphics directory.

Side Menus can optionally have images above and/or below them. The Top Image and Bottom Image pull downs list the images that have been uploaded to the Menu Graphics directory via the Edit Content Page. See the Basic Requirements page for restrictions on the size of Menu Graphics.

Side Menus can optionally have a "Printer Version" link which opens a new window with a predominantly black-and-white version of the page formatted for printing. Check the Enable 'Printer Version' checkbox to display the link.

Side Menus can optionally have an "Email this page" link which opens a page with a form to send email with a link to this page to an associate. Check the Enable Page Mail checkbox to display the link.

If the page being edited is the index.htm page for its directory, this dialog sets the contents of the Side Menus of all the pages contained in the directory:

  • The Used Menu Items list shows the contents of the Side Menus. The Short Title of each item is displayed. Position the cursor over an item to see a tooltip displaying the local URL of the associated page. Click on a Used Menu Items entry to activate the corresponding Shift buttons. Use the Remove Item button to remove an item from the Used Menu Items. Use the Shift Up and Shift Down buttons to position items in the Used Menu Items list.
  • The Available Menu Items list displays the Short Titles of the all the other pages and directories in the directory. Click on an available item to activate the Add Item Shift button. Use the Add Item button to add available items to the the Used Menu Items list.
  • The Extra Links select list adds additional links to the Available Menu Items list to other pages and directories not in the directory. Use this judiciously to add menu links that jump across your site hierarchy.

Preview

Previews your changes by opening the page you are editing a new window.


 Save

Ctrl+S

Saves your changes. The page is scrolled to its top. The Undo history is cleared. If spelling or link errors are highlighted, the highlighting is cleared.


Exit

Ctrl+Q

Exits the Page Editor and removes the file Lock. If changes haven't been saved, prompts to make sure you want to exit without saving.

Always use this control to exit the Page Editor! Closing the window directly is unreliable and may lose changes and leave file locks in place!

Status Bar

The Status Bar appears at the bottom of the Page Editor window:

Status Bar

The name of the file being edited is shown on the right. The type of paragraph under the cursor (or on the left edge of text selections) is shown on the left. If a link is selected, the URL of the link is shown. If an Anchor is selected, the Anchor Name is shown. If an Image is selected, the name of the Image and its Alternate Text is shown.

Undo

The typing and changes since the last mouse click that moved the cursor can be undo using Ctrl+Z . A single level of undo is provided. The undo can be undone with another Ctrl+Z . The selection is not preserved. The undo history is cleared when the document is saved.

Cut, Copy, Paste, Find, and Drag

The usual commands for Ctrl+X cutting , Ctrl+C copying , Ctrl+V pasting , and Ctrl+F finding text all work.

Special precautions must be taken if copying text from Microsoft Word or from another browser window. Such copies carry hidden HTML formatting with them. The formatting will appear at first in the Page Editor but then be removed when the page is saved. If you are copying from such sources, first paste the text into Notepad (a standard Windows Accessory), which removes all formatting, and then copy from there into the Page editor.

Dragging within the Page Editor window works. Dragging from other windows does not.

Special Embedded Markup Commands

Two special Markup commands can be inserted in the Page Editor. These two optional commands appear as normal editable text in the Page Editor. The Slide Show command inserts a slide show. The Body Link command "symbolically links" the text from the body of another page on the site into the page in which the command appears.

Browser Dependencies

The Page Editor works with the latest version of Internet Explorer and Mozilla's Firefox. The Content Management System's editor relies on features not present in older versions of these browsers or in other browsers. Each browser has its own idiosyncrasies:

Internet Explorer

  1. When you backspace to delete lines, Internet Explorer sometimes removes the paragraph format.
  2. When you change paragraph format to Zero Space, Internet Explorer removes bold & italic from the paragraph.
  3. Although Internet Explorer usually assigns paragraph types, it sometimes doesn't. Paragraphs without types appear in colored text in the Page Editor.
  4. Table cells with horizontal rules sometimes appear taller in the editor than they do on the finished page. Use the Preview command to see how they will appear.

Mozilla (Firefox)

  1. Links in the editor always appear dark blue in Mozilla, regardless of the color that will appear on the finished page.
  2. Mozilla sometimes doesn't assign paragraph types. Paragraphs without types appear in colored text in the Page Editor.
  3. When you backspace to delete lines, Mozilla sometimes inserts empty paragraphs or removes paragraph styles.
  4. When removing a link, the selection sometimes grows so additional text is selected.
  5. If you type Ctrl+T and get a new blank tab window over the editor, type Ctrl+W to close the tab.
  6. Selecting table rows is sometimes difficult in Mozilla.  Internet Explorer's selection usually works better.
Portfolio Sites/ Services/ Tools/ Calendar/ Contact Us/ Site Map/ Search
 
 
© 2001-2018 FreeOrbit.com
Site Design & Content Management Tools by FreeOrbit