Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

  • Main body colors
  • Secondary body colors
  • Strong body colors

Main Body Colors

The image below is the screen that opens when you click the Main Body Colors link from the top of the page. It shows the options for the main colors. See the explanations for each below.

...

Using the color picker

Tapping the icon to the right of each field that looks like a checkerboard of colors, opens the the Color Picker. Simply tap in within the main bars of the color picker to select a color.

...

In the bottom of the color picker, you'll see the Current Color field field. The letters and numbers in that field are the HTML code for the color currently in use. Notice that as your cursor hovers over the bars of color, the top square on the right changes color to the color you are viewing, while the bottom square shows the color you clicked. Neither of these colors is in use until you click Save Color. In the example below, we tapped the green color on the bottom and then hovered over the blue color on top. However, you'll see that the Current Color field  field still shows the color in use is white.

Main Body Colors

The image below is the screen that opens when you click the Main Body Colors link from the top of the page. It shows the options for the main colors. See the explanations for each below.

Image Added

Background Color

Select or type in the HTML code for the main body background color you would like to use in the background of your pages. 

Font Color

Select or type in the HTML code for the main body font color you would like to use. The font color should contrast enough with the background color to make it easy to read. You can always scroll down to the lower left of the colors and fonts page and preview your color selections. Incidentally, the boxes to the left of the color options list shows show you the existing colors.

Link Color

Select or type in the HTML code for the main body link color you would like to use. This is the color that will be used when you add a link to a page or file.

Visited Link Color

Select or type in the HTML code for the  main body the visited link color you would like to use in the main body.  The visited link color is used on links that the visitor has click clicked in the recent past.

Active Link Color

Select or type in the HTML code for the  main the main body active link color you would like to use.  The active link color is used on a link to the current (active) page.

Hover Link Color

Select or type in the HTML code for the  main the main body hover link color you would like to use.  The hover link color is used when the visitor hovers their the mouse over the link.

Secondary Body Colors

Secondary body colors are the colors used outside the main page of your web sitewebsite. For instance, in the example below, the color white is in the middle of the webpage, the strong color purple is used in a bar on either side, and the lighter purple is a highlight color, not for text, but for the page. The dark color of purple is secondary to the main color, which is white. The lighter purple color in the Subscribe! box is a Strong color.

Background Color

Select or type in the HTML code for  secondary for the secondary body background color you would like to use.

Font Color

Select or type in the HTML code for  secondary body font for the secondary body font color you would like to use for the text in the secondary background color spaces on your web site. In our example, the font color is white on the dark purple background.

Link Color

Select or type in the HTML code for  secondary body link for the secondary body link color you would like to use.

Visited Link Color

Select or type in the HTML code for  secondary body visited for the secondary body visited link color you would like to use.  The visited link color is used on links that the visitor has click in the recent past.

Active Link Color

Select or type in the HTML code for secondary body active for the secondary body active link color you would like to use.  The active link color is used on
a link to the current (active) page.

Hover Link Color

Select or type in the HTML code for  secondary body hover for the secondary body hover link color you would like to use.  The hover link color is used when the visitor hovers their mouse over the link.

Strong Body Colors

In the example above, the lighter color of purple is a strong color box.

Background Color

Select or type in the HTML code for  strong for the strong body background color you would like to use.

Font Color

Select or type in the HTML code for  strong for the strong body font color you would like to use.

Link Color

Select or type in the HTML code for  strong body link for the strong body link color you would like to use.

Visited Link Color

Select or type in the HTML code for  strong for the strong body visited link color you would like to use.  The visited link color is used on links that the visitor has clicked in the recent past.

Active Link Color

Select or type in the HTML code for  strong body active for the strong body active link color you would like to use.  The active link color is used on a link to the current (active) page.

Hover Link Color

Select or type in the HTML code for  strong body hover for the strong body hover link color you would like to use.  The hover link color is used when the visitor hovers their mouse over the link.

...

Experiment with a color, then scroll to the bottom to click the Preview Colors button to see the color you changed in use on your website.

Font family and size

Font Family

Select the font family you would like to use from the drop-down menu.  Only web browser-friendly (compatible) fonts are listed. As you make a selection to the Font Family at the top of the section, the font changes in the field at the bottom.

Base Font Size

Select the font size you would like to use from the drop-down menu. Again, you can preview your selection in the field at the bottom of the selection.

...