Frontier Web Editor Using HTML and Linking
Basic editing
Editing text
If you just type, allowing your text to wrap naturally, the WebEditor will take care of everything for you, inserting the necessary HTML codes to make your page display properly on the web. Press return twice between paragraphs to insert a blank line.
Save and publish
When you have finished editing your text, press the "Save and Publish Page" button and your page will be published to the web server.
Formatting options
Headlines
Within the text of your page you can create several levels of headlines by including special characters. Please use these markings rather than fussing around with HTML heading and bold tags. By using these markings you are describing the structure of your document, not just the formatting. This makes your documents more portable and easier to automatically reformat for different uses.
The Page Title
will automatically appear at the top of your page, formatted according to the master stylesheet. You can edit the text of the page title at the very top of the editing page where it says PageTitle. Do not include any punctuation or HTML within the title.
If for some reason you do not want the page title to appear on a page, insert this line at the very top of the page text window:
#noHeadline "true"
This is often desirable on the home page of a site, where the name of the department is already included in the page banner image and it would look silly to then repeat the department name as the page title.
Primary titles.
For titles of the (few) main divisions of the page, put the title on a line by itself. At the very beginning and very end of the line put two ampersands. Make sure there are no stray spaces before or after the ampersands.
Section titles.
For titles of sections, use two asterisks instead of the ampersands -- at the very beginning and very end of the line put two asterisks.
Item titles.
For titles, use two percent signs instead of the ampersands. These do not have to stand alone on a line as the other titles do, there may be text following them. For example,
Emphasis
You can include standard HTML tags for bold ("strong") and italic ("em"). Do not use "font" tags.
Centering
Do not use "center" tags, as they interact very badly with our stylesheets and will make a mess.
Including HTML
If you know what you are doing, you are welcome to insert HTML tags into the body of your document. In general this should not be necessary, so before going down this path please make certain that what you are trying to achieve cannot be accomplished more simply.
Within an HTML block the Web Editor assumes you know what you are doing, and it stops providing any automatic formatting for you. In particular you must take care of all your own line breaks. Do not use unmatched paragraph tags: either make your line breaks with break tags or enclose your paragraph in a matched pair of paragraph tags.
There are some limitations to the HTML that you can include, because your page text is embedded in a larger web page. In particular, you cannot include an HTML block within another HTML block of the same kind. For instance, you cannot include a table block within another table, or a DIV within a DIV.
Templates
The Web Editor can publish your page in one of a family of related templates. All of the templates have a banner image across the top, a dividing bar and a background. Wheaton standard banner images are available for your department or program. The choice of template is one of the initial design choices you make when setting up your site. It is normally set by the Web Strategy Team site administrator when he or she creates the shell of the site for you.
Navigation
Links to an external url
You can include links in your page text by including a standard HTML link tag. For instance, to make the word "LINK" into a link to Google.com we would cut and paste the html that is next to link example at the bottom of this page. Where it says "paste url here" you would past google.com. Where it says "paste text here" type what word you want to be able to click on to bring you to google.com
Links to pages on the Wheaton web server
Links to other Wheaton pages do not need to include the "http://wheatoncollege.edu" at the beginning. A link to the About Wheaton home page should be written where it says "paste url here" in the html next to the link example at the bottom of the page. It should look like this, beginning with a slash:
/about/home.html
Images
You can include images by placing the image file in the "Images" folder in your top-level folder on the web server (through Fetch/FTP), then including a standard HTML image tag that refers to the image. For instance, if you have an image file named "bigpicture.jpg" in the Images folder for the Web group you would paste the html found at the bottom of this page next to "Image example" and where it says to "paste URL here" you would type in the file path from Fetch/FTP. In this case bigpicture.jpg would be in /web/images/bigpicture.jpg
You can also right click (or control click on a Mac) on your image inside of Fetch/FTP and choose copy link location and paste it into the html here. Just remember to remove extraneous information before the first slash and folder (usually it will say the word Frontier and have your WID).
Additional subtleties are possible, including adding space around the image and flowing the text in different ways around the image, by using standard HTML options on the image tag.
Note: At this time, images must be transferred to the server via FTP.
Menus
The menus (large blue rectangle on the top right and submenus down the right side of the page) are controlled by separate files. There is some planning and set up required to use these menus -- talk with the Web Strategy Team before attempting to change a menu.
Crumbs
You can also provide navigation through "bread crumbs" or a "crumb trail" below the page banner. (Think of Hansel and Gretel leaving a trail of crumbs so they can find their way home.) The crumbs allow your visitors to navigate back up your site after they have drilled down through one or more levels of folders.
Setting up a system of crumbs is a site design decision you should make with your site administrator. Crumbs can be turned on or off for whole sites, for individual folders or for single pages.
Tables
The web editor can lay out text into tables in a variety of formats. The full range of possiblities is beyond the scope of this document -- call for a tutorial.
For a simple table consisting of rows of data elements, follow this example. The data elements on each line must be separated by tab characters (which you cannot type in the web editor) or by backquote characters (top left of most keyboards, above the tab key.) Enclosing a row in pairs of asterisks (like a section title) will make it into a bolded heading row.
| Name | Position | Weight |
| John Smith | forward | 165 lbs |
| Mary Jones | center | 122 lbs |
| Sam Snead | forward | 145 lbs |
| Emma Peel | center | 127 lbs |
which produces:
| Name | Position | Weight |
|---|---|---|
| John Smith | forward | 165 lbs |
| Mary Jones | center | 122 lbs |
| Sam Snead | forward | 145 lbs |
| Emma Peel | center | 127 lbs |
