To insure your pages render properly on all browsers, not just yours, all tag errors must be corrected. Also, keep your text neat and orderly so that other editors can readily understand your intentions.
Rendering of lines and paragraphs generally will be the same as they appear in the edit box. Titles, centering and bulletins are centered.
"Tags" are special instructions for the user's browser and consist of starting and, generally [there are exceptions as noted], ending elements [e.g., <blue>Blue Text</blue>] EditPage's "tags" are described below. "Tag names can be lower or upper case. Two word tags can be connected with an underscore or a dash. [e.g. <big_blue> or <big-blue>]
Emphasize text like this:
<red>Red Text</red>
<blue>Blue Text</blue>
<big_blue>Blue Text</big_blue>
<yel>Yellow</yel>
<bold>bold text</bold> [or the html <b>bold text</b>]
<i>italic</i> <u>underline</u>
Headers: Headers are used as paragraph lead-ins and are always left justified. Three colors are provided. <header>Header</header>, <red-header>Header</red-header> and <blue-header>Header</blue-header>. Do not use emphasizing tags as paragraph lead-ins.
Bolding and Headers: Occassionally, you may want to start a single line or sentence with a bolded word, or so. EditPage may give you a warning; if it does, use a header tag instead of a <bold> or <b> tag. It will render almost the same.
Terminating Lines: Occasionally, you may need prevent browsers from wrapping text and/or to terminate a line [e.g., when making a list]. Simple add a "\" [w/o the quotes] where you want the line to end and key enter to start the new line.
Titles: Titles are centered when rendered. You can use this tag for blue titles <blue_title>Title</blue_title> and <blue_subtitle>Blue Subtitle</blue_subtitle>; this for normal titles <title>Title</title> and <subtitle>Subtitle</subtitle>. Titles should be on separate lines.
Lists: The list feature is very effective, simply place one of these tags just before the start of your list: <list> [plain] <bul_list> [bullets] or <num_list> [numbered] [You can use the html codes also: <ul> or <ol>] and </list> </bul_list> or </num_list> [</ol> or </ul>] following it. For example, a bullet list:
<bul_list>
first line
second line
etc.
</bul_list>
The program will automatically add <li> to the start of and </li> to the end of each line item.
List Problems: A word of caution, if you paste-in long text lines that may be "wrapped" it can be difficult to determine where the actual lines end. The program can have the same problem. If <li> and </li> tags are not delineating your lines correctly, add this tag inside of the list block <clr li> or <clear li>. This will clear all <li> tags so you can correct the problem. The best way to solve this problem is to add a blank line between line items. Your next "Save" will restore the list tags.
List Left Margins: Set the left margin of your list with this syntax: <list left=16%> or <bul_list margin16%> Actually, only the tag name, a space and the numerical value are needed, e.g., <list 16>, any characters and symbols other than tag name are ignored. The default is 10%.
Compress and Expand Lists: Check the appropriate box to compress or expand your list(s) on Save. This is simply a helpful tool to use when you have a large, or several, lists and want to minimize the content size of the edit window. It does not affect how your lists are rendered on the user's browser.
Center text with <center>Blah.....</center> [Do not use for images.]
Photos: Photos and other images can be rendered at the left margin with text wrapped around them. Just use this tag <photo>photo-filename</photo> [e.g., <photo>john_mug.jpg</photo>]
A note about Photos and Images: The only difference is that photos are rendered on the left margin, with text wrapped around them on the right, captions are not used. Images are rendered in a "container", as described below and can have an optional caption.
Images: Place images, typically photos, using this format. IMPORTANT, images placed using the <img> tag must be including within the
<images>.... </images> tags, even if there is only one.
<images>{border size frame}
<img>filename1</img> [e.g., <img>john_mug.jpg1</img>]
<img>filename2<cap>your caption1</img> [e.g., <img>john_mug.jpg<cap>John Henry1</img>]
etc.....
</images>
{border size frame}; "border" if wanted, container sizes are "small", "medium" and "large". [e.g., medium size without a border: {medium}], "noframe" if frame on image is to be supressed; Defaults [i.e., nothing specified] are no border, medium size, image has a black frame. There is no order for these attributes, just the words are required.
<cap>followed by the image caption
The images are arranged horizontally in a container. You can place any number of images in a container; however, rendering will be uncontrolled if the images do not fit on one row. Simply add additional containers as needed.
Centering wide images: If you want to simply center a wide image, then use {small noframe}
Thumbnails of all images and pdfs: This link will take you to a page that shows thumbnails and lists of all the previously uploaded images and pdf files. The lists are formated so you can simply copy the file including its tags for pasting in your edit window.
Uploading Images [photos, etc.]: The is a very powerful feature for uploading photos, images and pdf files. To use it, click the "Browse" button to open a browser on your computer, and select the file to be uploaded [you can double click the file name or key "Open"]. Next select the intended image size, "As is" [not recommended], VerySmall [120pixels], Small [200pixels], Medium [400px] and Large [600px]. Then key "Upload" and wait for the page to refresh. A new box will appear; "Uploaded Image Report" or "Uploaded File Report", with details for the operation.
Permissable file types: png, gif, jpg, pdf, . Maximum image file size: 300kb; maximum pdf file size: 2000kb; and the maximum characters for file names is 24, including the extension.
A horizontal blue line can be inserted with <blue-line> or <blue_line>
Bulletins can inserted anywhere in your text; but are generally placed near the top.
Use this syntax: <bull-title>bulletin name</bull-title> and <bull-text>your text</bull-text> or for a red box <bull-alert>your text</bull-alert>.
Page Banners and Nav Bars: Depending on a configuration file setting, the default can be either to render or not to render. This setting can be overridden by using <no_banner> or <banner> as needed. The tag can be anywhere in your text. This feature is particularly useful for pages to be printed, etc.
Indexes on Index Pages can be suppressed with this tag anywhere in your text <no_menu>. This is useful for situations where a calling file needs to include the word "index", yet no index is wanted [e.g., the home page index file].
For those familiar with HTML coding, tags, styles and classes can also be used,
[e.g., <i>italic</i> <span style="color:green">
blah...blah</span> etc.]
Use this syntax for:
email links: <email>recipient's email addr<name>recipient's name</email> [e.g.,<email>joe24@IBM.com<name>Joe Smith</email>]
URL links: <link>URL<label>link text</link>,
Secure URL links: <slink>URL<label>link text</slink>,
Return link: It is good design practice to provide a return link by including "<return>" at the bottom of your pages. Check or uncheck the Return checkbox as needed to automatically insert or remove it.
Poems use a special format, text is centered and the font is special. Start the poem text segment(s) with <poem> and end it with </poem>. Put your text lines together without any blank lines, except to denote paragraphs. All lines must end with a back-slash [i.e., "\"]. <center> works exactly the same, except the font is normal.
Page Title: If it [i.e., the html document title that the search engines use] requires changing, enter the new title in the textbox provided.
Tables: Can be used; however, they must be composed with HTML coding. Contact tech support for help if you need to use a table but don't know HTML coding.
Pasting in text, two issues: Immediately after pasting in your text, always key "Save" to preprocess your text. Second, typically, when you copy/paste text into the edit box, lines may be wrapped short by the program [e.g., Notepad] you used to copy the text from. EditPage attempts to correct this whenever you key "Save". Key it once and see how your text looks. If any unwanted short lines still exist, remove all spaces and punctuation marks at the line end. If you purposely want a short line, simply add a back-slash [i.e., "\"] to the end of the line.
Spelling Checker: Provides a list of suspect spellings, generally proper names. Please add new words, especially proper names, to the dictionary by selecting the little checkbox beside the word and keying "Save". Once added to the dictionary, tech support must remove them; so be careful about adding improperly spelled words. Don't worry about adding concocted words you've used for effect and color.
HTML Styles: A report on all the html styles used is provided below. This can be of great help solving rendering problems.
Note: You can place a Post-It type "Note" anywhere in your text text. There is no limit to the number and position. They are not sent to the visitor's browser.
Contact Tech Support if there is a new rendering feature you would like, [e.g. highlighting, header, title, etc.]
IMPORTANT, Tags.. Be very careful that all start tags have a corresponding end tag [e.g., <red>Red Text</red>] and that tags are nested properly [e.g., <red><bold>Red Text</bold> </red>]. Note that <bold> and </bold> are both inside of <red> and </red>. Note that <bold> and </bold> are both inside of <red> and </red>.
IMPORTANT, Tags Check.. If your text does not render correctly, carefully check your tags. The code does a simple check but it is not foolproof.
IMPORTANT.. To help debug rendering problems, a list of styles used is just below.
CSS file.. If editpage.css exists in the current directory, it is used; otherwise, the copy in /functions is used.
Please W3C validate your file here: W3C Validator Report ALL failures to tech support.
Techie URL attributes: first one must be "?" subsequent ones "&"; "edit", "styles", "debug", "raw-debug". Debug shows html source. raw-debug shows raw file text.