Home

Download this help site
(PDF 80MB)

Download

Color and style settings for Aurora, Glass, Keynote, Memo, Nature, and Notebook themes

Icon

These themes are no longer supported by Wild Apricot's content management systems (CMS) and will no longer appear as options within the theme gallery

From the Colors and styles screen , you can change the colors and fonts of elements that appear throughout your site. Settings for different elements are grouped into categories. The categories vary depending on the website theme you have chosen.

Some elements on your site can be controlled by more than one setting. For example, a heading formatted using the H4 style that's also a link can be controlled using either the General formatting > H4 setting or the General formatting > Link setting.

Some elements are general settings than be overridden or superseded by more specific elements. For example, the General formatting > Link setting can be overridden for login boxes by the Login box > Link setting.

Icon

The settings appearing on the Color and Styles screen, and their order and default values, can be customized for a particular theme using theme overrides. For more information, see Customizing Colors and Styles options for themes.

You can modify the following elements for Aurora, Glass, Keynote, Memo, Nature, and Notebook themes.

Site

Your site's background.

Attribute

Description

Background color

The background color of your site. You can select a color from the drop-down palette or enter the hexadecimal code for the color (e.g. #FF0000 for red).

Background image

An image to be displayed as the background for your site. You can select an image by clicking the ellipsis button ( ... ), or remove an image by clicking the X button. Using the Background repeat setting (below), you can control whether and how the image is repeated.

Background repeat

Controls whether the background is repeated horizontally or vertically, or both (tiled) or not at all.

Content

The background color of the content area of your site. You can select a color from the drop-down palette or enter the hexadecimal code for the color (e.g. #FF0000 for red).

General formatting

Typography

Element

Controls...

Text

Appearance of most – but not all – body text and text labels throughout your site. For linked text, the Link setting (below) will override the Text setting.

Link

Appearance of text links. The Link setting will supercede the Text setting above for text links.

Link on hover

Appearance of the text links and menu items when a mouse pointer hovers over them.

H1

Appearance of headings formatted using the H1 style. These headings appear in HTML code within <h1> tags and can be applied using the Text style drop-down when editing a content gadget.

H1 Alternative

Appearance of headings formatted using the H1 Alternative style. These headings appear in HTML code within <h1 class="contStyleExcHeadingColored"> tags.

H2

Appearance of headings formatted using the H2 style. These headings appear in HTML code within <h1> tags.

H2 Alternative

Appearance of headings formatted using the H2 Alternative style. These headings appear in HTML code within <h2 class="contStyleExcHeadingColored"> tags.

H3

Appearance of headings formatted using the H3 style.

H3 Alternative

Appearance of headings formatted using the H3 Alternative style. These headings appear in HTML code within <h3 class="contStyleExcHeadingColored"> tags.

H4

Appearance of headings formatted using the H4 style.

H4 Alternative

Appearance of headings formatted using the H4 Alternative style. These headings appear in HTML code within <h4 class="contStyleExcHeadingColored"> tags.

Text alt color 1

Appearance of text formatted using the Alt color 1 style. The text will appear in the HTML code within <span class="contStyleExcInlineColored1"> tags.

Text alt color 2

Appearance of text formatted using the Alt color 2 style. The text will appear in the HTML code within <span class="contStyleExcInlineColored2"> tags.

Text alt highlighted

Appearance of text formatted using the Alt highlighted style. The text will appear in the HTML code within <span class="contStyleExcInlineHighlighted"> tags.

Page title

Appearance of text formatted using the Page title style. The text will appear in the HTML code within <span class="pageTitle"> tags.

Quoted

Appearance of text formatted using the Quoted style. The text will appear in the HTML code within <span class="quotedText"> tags.

Section title

Appearance of text formatted using the Section title style. The text will appear in the HTML code within <span class="sectionTitle"> tags.

Examples: Upcoming events heading on event calendar

Label

Appearance of labels. If you do not specify settings here, the Text settings (above) will be applied.

Disabled items

Appearance of disabled items.

Example: member only pricing for non-members

Box

Element

Controls...

Background color

Background color of boxes appearing on certain gadgets (e.g. blog gadgets).

Header

Appearance of the header area at the top of the box.

Header link

Appearance of links within the header area at the top of the box.

Header link on hover

Appearance of links within the header area at the top of the box when a mouse pointer hovers over them.

Label

Appearance of labels within the box.

Text

Appearance of text within the box.

Link

Appearance of links within the box.

Link on hover

Appearance of links within the box when a mouse pointer hovers over them.

Footer

Background color of the area at the bottom of the box.

Footer link on hover

Appearance of links at the bottom the box.

Outline box

Element

Controls...

Outline color

Outline color of boxes used in certain gadgets.

Background color

Background color of the box.

Header

Appearance of the header area at the top of the box.

Header link

Appearance of links within the header area at the top of the box.

Header link on hover

Appearance of links within the header area at the top of the box when a mouse pointer hovers over them.

Label

Appearance of labels within the box.

Label alternative

Appearance of other labels within the box.

Text

Appearance of text within the box.

Link

Appearance of links within the box.

Link on hover

Appearance of links within the box when a mouse pointer hovers over them.

Footer

Background color of the area at the bottom of the box.

Footer link on hover

Appearance of links at the bottom the box.

Colored box

Element

Controls...

Background color

Background color of colored boxes used in certain gadgets (e.g. event details).

Info box

Background color of event detail area within the box.

Label

Appearance of labels within the box.

Label alternative

Appearance of other labels within the box.

Text

Appearance of text within the box.

Link

Appearance of links within the box.

Link on hover

Appearance of links within the box when a mouse pointer hovers over them.

Disabled items

Appearance of disabled items within the box.

Example: member only pricing for non-members

List

Element

Controls...

Background color

Background color of table used in certain gadget to list items.

Header

Appearance of the header area at the top of the table.

Header link

Appearance of links within the table.

Header link on hover

Appearance of links within the table when a mouse pointer hovers over them.

Row

Background color of rows within the table

Highlighted row

Background color of highlighted row within the table

Text

Appearance of text within the table.

Link

Appearance of links within the table.

Link on hover

Appearance of links within the table when a mouse pointer hovers over them.

Disabled items

Appearance of disabled items within the table.

Form

Element

Controls...

Background color

Background color of forms such as event registration, email subscription, and membership application.

Title

Appearance of headings within the forms.

Section title

Appearance of section titles within the forms.

Label

Appearance of labels within the forms. If you do not specify settings here, the Text settings (below) will be applied.

Mandatory label

Appearance of mandatory field labels within the forms. Your settings here will be added to the Label settings.

Field explanation

Appearance of field instructions added to form fields.

Mandatory asterisk

Appearance of the asterisk that precedes the phrase Mandatory fields on forms.

Text

Appearance of text within the forms. If you specify both Text and Label settings (above), the Label settings will take precedence.

Link

Appearance of links within the forms.

Link on hover

Appearance of links within the forms when a mouse pointer hovers over them.

Disabled items

Appearance of disabled items within the forms.

Menu (static)

Element

Controls...

Level 1 - Normal

Appearance of top level static menu items, other than the currently active item.

Level 1 - Hover

Appearance of top level static menu items when a mouse pointer hovers over them.

Level 1 - Current

Appearance of the currently active top level menu item.

Level 2 - Normal

Appearance of second level static menu items, other than the currently active item.

Level 2 - Hover

Appearance of second level static menu items when a mouse pointer hovers over them.

Level 2 - Current

Appearance of the currently active second level menu item.

Level 3 - Normal

Appearance of third level static menu items, other than the currently active item.

Level 3 - Hover

Appearance of third level static menu items when a mouse pointer hovers over them.

Level 3 - Current

Appearance of the currently active second level menu item.

Menu (dynamic)

Element

Controls...

Level 2 - Normal

Appearance of second level dynamic menu items.

Level 2 - Hover

Appearance of second level dynamic menu items when a mouse pointer hovers over them.

Login box

Element

Controls...

Labels when logged in

Appearance of text labels within the login area when a user is logged in. Does not affect text links.

Links

Appearance of the text links within the login area. If you do not specify settings here, any changes to the General formatting >  Link settings (above) will be applied to login box links.

Example: the Forgot password link

Links when logged in

Appearance of the text links within the login area when a user is logged in.

Links on hover

Appearance of the login links when a mouse pointer hovers over them. If you do not specify settings here, any changes to the General formatting > Link on hover settings (above) will be applied to login box links.

Links on hover when logged in

Appearance of the login links when a mouse pointer hovers over them and a user is logged in.

"Remember me" label

Appearance of the Remember me checkbox label.

See also

On this page: 

See also:

  • No labels
 
Wild Apricot Inc. 144 Front Street West Suite 725, Toronto, Ontario, Canada M5J 2L7