From the Colors and styles screen, you can change the colors and fonts of elements that appear throughout your site. To make website customization faster and easier, the most commonly customized settings appear in a quick customization panel.
From the quick customization panel, you can change site backgrounds, colors for selected text elements, and styles for selected gadgets.
Any changes you make here will be reflected in the full colors and styles settings. To return to the full colors and styles settings, click the All settings option.
To return to the quick customization panel, click the Quick customization option within the full colors and styles settings.
Saving and undoing changes
To save the changes from your current editing session, click the Save button. To discard the changes from your current editing session, click Cancel.
To return your site to the original colors and styles settings for your website theme, click Reset all to default button at the bottom of the quick customization panel.
Clicking this button will reset all your colors and styles settings, not just the ones displayed on the quick customization panel.
To undo your most recent change within the current editing session, click the Undo icon.
You can undo a change even after saving or canceling the changes to your current editing session. You can even undo the Save, Cancel, and Reset all to default functions themselves. After undoing a change, you can use the Undo icon to undo the previous change.
To redo a change after undoing it, click the Redo icon to the right of the Undo icon.
You cannot undo or redo changes after leaving the current editing session.
Changing backgrounds
For the main site background, you can set a background image and a background color. For the header background, the content background, and the footer background, you set a background color only.
To visualize the location of a particular background, hover over the background option. The corresponding background area within the site preview on the right will appear highlighted with a thatched pattern.
Changing the main site background
For the main site background, you can choose a background image and/or background color. If you choose both a color and an image, the background color will show through if the background image has a transparent background or doesn't occupy the entire content area.
To apply a background image to your site, click the Insert image button under Background image.
You can choose from the theme-specific image library, or click the Files tab and choose an image file from your Wild Apricot account.
After you've chosen your background image, you can choose whether you want the image repeated. You can choose to repeat the background image horizontally or vertically, or both horizontally and vertically (tiled), or not at all.
If you select the Automatic repeat option, then the repeat option will be set by your website theme.
To remove a background image, click the Remove option above the image preview.
To replace the image with a different image, click the Replace image button below the image preview.
Changing background colors
For all backgrounds, you can set a background color. If you don't know which background is which, hover over the background option and the corresponding background area will appear highlighted within the site preview on the right.
To choose a background color, click the square beside the background option.
Within the color panel that appears, you can pick a color from the theme palette at the top of the panel, or enter RGB values or a hexadecimal value for the color you want to use.
If a question mark appears in the square beside a background option, that means the background has been not customized and is still using the default setting. If a color appears in the square, that means the background has been customized to display that color.
After you've set a background color, you can reset it back to its default value by clicking the Reset to default option for that background.
Changing text colors
From the quick customization panel, you can change the colors of the most commonly customized text elements:
- Body text, which corresponds to the Text element in the full colors and styles settings
- Headings, which corresponds to Heading 1-5 in the full colors and styles settings
- Links normal, which corresponds to Link in the full colors and style settings
- Links on hover
If you're not sure which text elements are which, hover over an element and the corresponding text in the site preview on the site will appear highlighted.
To change the color of a text element, click the square beside the text element.
Within the color panel that appears, you can pick a color from the theme palette at the top of the panel, or enter RGB values or a hexadecimal value for the color you want to use.
If a question mark appears in the square beside a text element, that means the element has been not customized and is still using the default setting. If a color appears in the square, that means the element has been customized to display that color.
After you've set the color for a text element, you can reset it back to its default value by clicking the Reset to default option for that element.
Changing gadget styles
For the most commonly customized gadgets, you can adjust gadget styles within the quick customization panel. Currently, you can customize styles for navigation gadgets and the log in gadget.
To customize the styles for any of these gadgets, click the appropriate option within the quick customization option. On the screen that appears, you can adjust the colors and fonts for each gadget.
For information on individual style options for each theme, click one of the following links:
- Color and style settings for Blueprint themes
- Color and style settings for Bookshelf and Whiteboard themes
- Color and style settings for Business Casual themes
- Color and style settings for Clean Lines, White Space, Dark Impact themes
- Color and style settings for Fiesta themes
- Color and style settings for Homestead themes
- Color and style settings for Kaleidoscope themes
- Color and style settings for Showcase themes
- Color and style settings for Skyline themes
- Color and style settings for Terra and Firma themes
- Color and style settings for Tinted Tiles and Building Blocks themes
- Color and style settings for Treehouse themes