This screen displays all the Cascaded Style Sheet (CSS) files that you can use to define the look and feel of your entire website.
Themes allow your Site Designers to maintain control of the consistency of the design and content of the website.
Themes require compatible Page Styles that reference the CSS elements from the Theme file.
Only one Theme can be "active" at any one time on the website. You can preview Themes within your browser session if you are a Site Designer.
You can enter a search term in the box on this screen and search for any Theme by it's properties.
To create a new Theme, click on "Create Theme". Before you activate a Theme, we recommend that you preview it first.
NOTE: You will need knowledge of HTML and Cascaded Style Sheets (CSS) in order to make changes to the custom Theme files.
To further control the consistency of the content added by Content Managers, you can add a CSS comment area to your Theme file and these CSS selectors will be made available to your Content Managers when editing content using the Rich-text Editor's "Format" selections.
If are using the built-in stylesheet-driven website themes, then you have access to a series of styling for different types of content we have created for you. Each style becomes a Custom Format that you can apply them to your content.
So that your content would be portable from one theme to another, we devised a system based on a two-tone color scheme. In a two-tone color scheme, there is a "primary" and "secondary" color. We have taken that concept to develop primary and secondary buttons, boxes, links, and other common website styles. This allows you to extend this concept to your own website designs and style guides so that all content will work across all themes!
TIP: You should use these custom formats instead of "Fonts", "Font Styles", and "Font Sizes" which are disabled by default and are not compatible with the system themes and web content standards.
NOTE: We have included several custom formats within the the system provided themes to help you add more pazazz to your content. We have also added a Tag Picker to help you more easily "grab" content to style.
To enable this feature, add the <custom_formats></custom_formats> tags within comments in your Theme files, like this:
/* <custom_formats> */NOTE: Be sure that the <custom format> and </custom_format> comments are spelled correctly and appear around the styles you want to make available to the Rich-text Editor or they will be ignored.
TIP: Once you have defined all necessary Custom Formats in your Theme, we recommend that you disable the Rich-text Editor menu buttons from the Site Settings to prevent your Content Managers from using fonts, colors, and styling that is inconsistent with the website's intended design.
You can apply any Theme to you website without activating it first. This means that you can browse your actual public website Pages through the new Theme, without any other website Visitor being affected. All other Visitors will see the active Theme. This "Theme Preview Mode" is enabled until you close your browser (end your session), or activate a Theme.
TIP: Use Theme Preview Mode to help you develop and test new Themes them without affecting your "live" website.
When a Theme is active, it is inserted automatically every Page Style that has the <stylesheet></stylesheet> tag defined within it. If you use this tag in all of your Page Styles, you can instantly change the look and feel of you entire website to a new Theme with a click of a button by activating a Theme from this screen.
WARNING: If you activate a Theme that doesn't work with your HTML Page Styles correctly, you could render your website unreadable. If this happens, activate another Theme until you can fix the problematic Theme.
To delete a Theme from the web server, click on the Theme you wish to delete and click "Delete".
WARNING: Take care when deleting Theme files, there is no undo. Don't delete an activate Theme or you will render your website unreadable (if you are using Themes in your Page Styles. If this happens, activate another Theme.
A System Theme is a Theme that was created using the Theme Designer.
In order to edit a System Theme, click on the System Theme you want to edit, and then click on the "Edit Theme" button. This will open the Theme you are viewing in the Theme Designer.
To export a System Theme click on the System Theme you want to edit, and then click on the "Export" button. You will then be prompted to download the Theme CSV file.
If you need to backup, or transport a Theme to a different site, then when you export the Theme you will also need to download all of the Design Files that are associated with the Theme.