Site Design
This guide will help you learn how to customize the design of your site.

1. Choose a new layout
2. Customizing your colors
• Custom colors
• Color scheme generator
• Advanced color selection
3. Setup your site header & title
• Change the site banner
• Upload your own logo
• Change your logo
4. Change your menu buttons
5. Setup your default site font
6. Set your page width

Choose a new layout

1. Login to your site.
2. Click the "edit site" tab.
3. Click the "design" button from the main edit menu.
4. Click the "select layout" icon or the "layout tab" to view a list of available designs.
5. To view more designs click the "more designs" link.
6. Click a design picture to change the layout of your site.
7. Click "OK" to confirm that you want to change your layout.
8. A "generating graphics" window will open while the system is creating your new layout.

NOTE: You can change your layout at any time. All of the content from your pages will be preserved.

Customizing your colors

The site editor gives you full control to customize all of the colors on your site.

Custom colors

1. Click the "design" button from the main edit menu.
2. Click the "site colors" icon or the "colors" tab to display the color selection page.
3. The six colors of your color scheme will be displayed along with the background and text colors.
4. Click the color square that you want to change.
5. Use the color selector to change the selected color.
   • HLS: select color by hue
   • RGB: select color by RGB color values
   • GRID: Select from a list of pre-defined colors
6. Select each of the colors that you want to change.
7. Click "Apply Changes" at the bottom of the pages.

NOTE: You match the colors on the selection screen to your site by looking at how they are used.

Color scheme generator

Use the color scheme generator to quickly create a coordinated color scheme for your site.

1. Click the "design" button from the main edit menu.
2. Click the "site colors" icon or the "colors" tab to display the color selection page.
3. Click the "Color Scheme" link.
4. Click one of the available base colors to display a list of color options.
5. Click the arrow next to the color combination that you want to preview.
6. Click "Apply Changes" to select the color scheme.

Advanced color selection

Advanced color selection lets you customize the default text link colors and menu button colors on your site.

1. Click the "design" button from the main edit menu.
2. Click the "site colors" icon or the "colors" tab to display the color selection page.
3. Click the "advanced color selector" link.
4. Click one of the color types to change that color.
5. Use the color selector to change the selected color.
6. Click "Apply Changes" to select the color scheme.

Available Colors:

Link: This is the default color for hyper links on your site.

Link Visited: The visited color is used for links that have been clicked on by visitors.

Menu Text: Main menu text color.

Menu Over: Main menu text color when you move the mouse over the menu button.

Menu Selected: Main menu text color that is displayed for the current page.

Sub-menu: Sub menu text color.

Sub-menu Selected: Sub menu text color that is displayed for the current page.

Sub-menu Over: Sub menu text color when you move the mouse over the menu button.

Setup your site header & title

Change the site banner

1. Click the "design" button from the main edit menu.
2. Click the "Header & Images" icon or the "header & images" tab to display the header customization page.
3. Click the "Select Banner" button to display a list of available banners.
4. Click a banner preview to select it or click a preview page to show more banners.
5. Click the color icons below the banner to change the base color for the banner.
6. Choose the banner height.
7. Click "Apply Changes".

Upload your own logo

1. Click the "design" button from the main edit menu.
2. Click the "Header & Images" icon or the "header & images" tab to display the header customization page.
3. Click the "click here to upload your image" link.
4. Click the "browse" button from the image editor.
5. Find the logo graphic file on your computer and select it from the appropriate place on your computer.
6. Click the "upload" button to transfer the file from your computer to your web site.
7. Click "OK at the bottom of the image selection page.
8. Click "Apply Changes" to update your site.

NOTE: Your logo will be displayed on the left side of the banner and the height will be adjusted to match the height that you have selected for your banner. To customize the entire banner area, upload a logo that is as wide as the full banner area.

Change your logo

1. Click the "design" button from the main edit menu.
2. Click the "Logo Builder" icon or the "Logo" tab to display the logo settings page.
3. Enter the text for the title
4. Use the Title Style selection to customize the size, font style, color, and title effects.
5. Click "Apply Changes" to save your updates.

Change your menu buttons

1. Click the "design" button from the main edit menu.
2. Click the "Menu Style" icon or the "menu" tab to display the menu settings page.
3. Select either the "main menu" or "sub menu" tab to change the button style for that menu.
4. Select the font name, font size, and font style.
5. To change the menu button style being used, click the "click here to change" link on the right side of the page, then select the new style by clicking the appropriate button.
6. Click "Apply Changes".

Setup your default site font

1. Click the "Design" button from the main edit menu.
2. Click the "text & styles" icon or click the "text & styles" tab.
3. Select a font name from the drop down list.
4. Click "Apply Changes".

Set your page width

1. Click the "Design" button from the main edit menu.
2. Click the "text & styles" icon or click the "text & styles" tab.
3. Click the "Layout" link.
4. Select your page width by choosing one of the options.
5. Click "Apply Changes".

NOTE: The appearance of your site depends on the type of computer that a visitor to your site is using. If they have a higher screen resolution your pages will appear wider. If they have a low screen resolution your pages will be narrower.