Show & Tell Gallery Creator Help

SUMMARY

Your Show & Tell Gallery can consist of one or more pages that you can link together. You can organize your photos by location, subject, style of photography, or even make a short story !

To build a Gallery page, you first use the File & Pages Management form to choose a name and upload any graphics you want to use.

After choosing a name, you will enter data in the Page Setup form to define background colors and patterns, the title that will display at the top of your gallery page, fonts and font sizes to use and some information for the search engines to use. You can go back and change this page later. Each of your gallery pages can use different colors & fonts if you like. This page setup is for one page only.

Now you are ready to layout your page. You fill in the Gallery Layout form with the names of your graphic files and with paragraphs of text (PLEASE READ THE RULES FOR TEXT below). You can preview your gallery page by clicking the "Page Preview" at the bottom of the page. You can save your page with the "Save Page" button. Once the page is saved, you can come back and edit it at any time.

Detailed instructions follow.

File & Pages Management Form

Create a New Page

All web page names must end in .html, for example: gallery1.html. If you name the first page you make index.html, you will be able to access your Gallery home page by going to http://www.domain.com/folder/username, without having to add the index.html to the end. After entering the page name, click 'Create Page'. The first step is the Page Setup.

Upload Graphics
You may want to upload graphic images before starting your page. Click 'Browse' and search your directories for the graphics you want to upload, select the graphic file to upload, then click 'Upload Now'.

Your Pages
After you have created one or more pages, this box will display a list of all your pages. You can choose one to edit.

Your Graphics Collection
This box lists all the graphics you uploaded to your Gallery. You can delete unwanted ones here. You might want to print this page, or cut and paste the graphic names to another window since you will have to enter them on the

Page Setup Form

To set up your page, choose a title, background colors or patterns, font styles and sizes and define links to other pages and choose META tags.

Select Background Color
The background can be a solid color, a graphic from the Graphics Library, or an image you have uploaded. Solid colors are represented by 6 character color values. To enter a solid color, view the Color Chart and select the color value of the color you want. For example: 0000FF for the color blue. For graphic backgrounds, enter the file name of the background image, for example: bg1.jpg or black.gif (no blanks or commas allowed in any image or background file name!).

There are default values for most features, so erase the data in the boxes and type in your own.

Page Title

Font for Title & Main Text
Select the size, color and font type for the title.

Select the size, color and font type for the main text of your page.

The color for both the title and main text can be any color value from the Color Chart. For example: ff0000 is the color value for the color red. Also be sure your color will be visible on the background you have chosen. If it isn't you can always come back and select new colors.

Link to Other Pages of Your Site
In order to go from one page to another of your gallery, you can put links to the other pages of your site under Site Navigation. You will be able to edit these links as your site grows. Just enter the name of the page you want to link to, then enter the .html name, or URL, of the page. For example, to link back to your main page you can enter Home for the Link Name, and index.html for the Link URL.

To make a link to your email address, enter the Link Name: Email Me!, or Contact. The URL for email links is, mailto: followed by your email address, mailto:you@youremail.com. Visitors will be able to click the link and it will open their email program with your address in the To: area.

Meta Tags
Meta Tags are used by search engines to help find your site when someone does a search with words that match your keywords or description. If you plan to submit your page to search engines, enter a short description and some keywords that describe your page.

Layout Gallery
Click "Layout Gallery" when you have finished with Page Setup.

For help on the layout options of the Gallery, click on "View Gallery Layout" at the top of the Page Setup page. The graphic images and text descriptions are laid out next to each other. You can, however, enter only the text or image in a single row and it will be displayed centered on the page. You can therefore begin a page with just a paragraph of text at the top, or put the description of a picture underneath it by putting only the picture on one row, and only the description in the row beneath.

In the Gallery Layout form, you will see your background, title, and links displayed. If you want to change them, you can either use the "Back" button on your computer, or click "Page Setup" at the bottom of the page.

From the Gallery Layout area, you can Preview the page, or Save it. From the Preview area, you can return to Page Setup, or the Gallery Building area to make changes. Or you can save your finished page.


RULES FOR TEXT

You can use limited HTML tags to format your text. Some simple formatting tags are listed below.

DO NOT USE double quotes. If you want to put a double quote mark in your text, code " instead of ". You cannot use a double quote mark within HTML tags you place in your paragraph.

You can place a copyright symbol, ©, in your text by typing ©.

To begin a new paragraph within a single paragraph area, use: <p>
This is the first paragraph.<p>This is the second paragraph.

Looks like this:

This is the first paragraph.

This is the second paragraph.

To begin a new line, use: <br>
This is the first line.<br>This is the second line.

Looks like this:

This is the first line.
This is the second line.

To center text, use: <center>
End centering the text, use </center>
This is text that is not centered. <center> This is text that is centered.<br>This is a new line of centered text.</center> Here is more text that is not centered.

Looks like this:

This is text that is not centered.

This is text that is centered.
This is a new line of centered text.
Here is more text that is not centered.

To indent text, use: <blockquote>
End the indented text, use </blockquote>
This is text that is not indented. <blockquote> This is text that is indented.<br>This is a new line of indented text.</blockquote> Here is more text that is not indented.

Looks like this:

This is text that is not indented.

This is text that is indented.
This is a new line of indented text.
Here is more text that is not indented.

To change the text color, use: <font color=red>
End the new text color, use </font>
This is text the color chosen for the main text of the page. <font color=red> This is red text</font>This is the main text color <font color=blue> This text is blue.</font> Back to the main text color.

Looks like this:

This is text the color chosen for the main text of the page. This is red text This is the main text color This text is blue. Back to the main text color.

Names of colors you can use:
red, blue, white, black, green, purple, yellow, orange, gray, brown
Reds: firebrick, palevioletred, peru, salmon, lightsalmon tomato, indianred, lightcoral, pink, deeppink, hotpink, lightpink, fuchsia, chrimson, darkred, darksalmon, darkmagenta, magenta, maroon, mediumorchid, mediumvioletred, orangered, orchid
Blues: aliceblue, aqua, aquamarine, cadetblue, cornflowerblue, cyan, darkblue, darkcyan, lightskyblue, lightsteelblue, mediumaquamarine, mediumblue, mediumturquoise, midnightblue, navy, darkslateblue, darkturquoise, deepskyblue, dodgerblue, indigo, lightblue, lightcyan, paleturquoise, powderblue, royalblue, skyblue, slateblue, steelblue, teal, turquoise
Greens: chartreuse, darkkhaki, darkolivegreen, darkseagreen, lightseagreen, lime, limegreen, mediumseagreen, mediumspringgreen, olive, olivedrab, palegreen, forestgreen, greenyellow, lawngreen, lightgreen, seagreen, springgreen, yellowgreen
Purples: blueviolet, mediumpurple, darkviolet, lavender, lavenderblush
Yellows: antiquewhite, bisque, blanchedalmond, cornsilk, linen, lightyellow, moccasin, navajowhite, palegoldenrod, lemonchiffon, lightgoldenrodyellow, papayawhip, seashell, wheat
Oranges: darkorange, gold, goldenrod, peachpuff, sandybrown
Grays: darkgray, darkslategray, dimgray, lightgrey, silver, whitesmoke
Browns: burlywood, darkgoldenrod, rosybrown, saddlebrown, tan, thistle

To make text bold, use: <b>
End the bold text, use </b>
This is regular text. <b>This is bold text.</b> Back to regular text.

Looks like this:

This is regular text. This is bold text. Back to regular text.

To make text italic, use: <i>
End the italic text, use </i>
This is regular text. <i>This is italic text.</i> Back to regular text.

Looks like this:

This is regular text. This is italic text. Back to regular text.

To make text underlined, use: <u>
End the underlined text, use </u>
This is regular text. <u>This is underlined text.</u> Back to regular text.

Looks like this:

This is regular text. This is underlined text. Back to regular text.