Theme Designer

The Theme Designer allows you to style all elements and content areas created by the Style Designer. The Theme Designer contains thousands of options, so this help guide will only touch on some of the important aspects of the Theme Designer. You will learn the most by selecting different options and seeing what happens!

Save New Copy

We recommend that you start with Site Wide Settings and Preview your changes as you go to understand how your changes affect the styling of your Pages. There is no UNDO once you 'Save' your Theme, so we recommend that you 'Save New Copy' to hold on to the original before you start playing around with your Themes.

Primary & Secondary Colors

The most important aspect of the Theme Designer is the concept of Primary and Secondary colors. This are similar to a school's colors, the 2-tone paint on your car, or the colors that make up your organization's logo or brand. By giving you access to set these within your Theme, all styling across your website can be based on these colors and be consistent. You can set your Primary and Secondary colors in the Site Wide General selections.

Custom Formats

The Theme Designer will automatically output a few dozen content formatting selections that are available within the Rich-text Editor for your Content Managers to use to style content. Custom Formats are created based on your Primary and Secondary color selections.

Software Styling

Styled elements like submit buttons, calendars, form fields, search boxes, etc. are all created by the Theme Designer for you, based on your Primary and Secondary color selections.

Rounded Corners & Shadows

The Theme Designer allows you to create rounded corners and shadowing without images, but this is a CSS3 feature that works with Mozilla (Firefox) browsers, but not with Microsoft Explorer. In IE, these features will be ignored so you can still use them, but be aware it is not supported by IE yet.

Advanced Styling

If you are an experienced HTML and CSS programmer, you can override any styling that is created by the Theme Designer by adding the appropriate CSS elements and inheritance to the Advanced Styling text area.

You can even create Custom Page Styles that will work with the Theme Designer. View a Page that uses a System Page Style in your browser to see what HTML/CSS structure is required for the Theme Designer to interact successfully with your own HTML.