Customizing the colors on your site

This lesson will show you how to customize the colors on your ScreenSteps site without having to edit any HTML or CSS code. If you would like completely customize the look of your ScreenSteps site, then you should use Custom Templates. But the method shown below is the quickest and easiest way to customize the look of your ScreenSteps site.

Click here to see which colors can be adjusted
Color Selector What it controls
Background Background color of header. This will not apply if you have added a custom HTML header.
Text The color of linkable text in the header. Will not apply if you have added a custom HTML header.
Hover The hover color of links in the header.
Color Selector What it controls
Normal Color for links
Hover Hover color for links
Visited Visited color for links

Text

Color Selector What it controls
TOC Headings
Top level heading tags on the site, manual, and chapter table of contents.

This will also control the color of the article title on the article view page.
TOC Subheadings Subheadings on site, manual,  and chapter table of contents pages
Sidebar Headings Top level headings in the sidebar
Sidebar Subheadings Subheadings in the sidebar
Article Headings Top level headings in an article
Article Subheadings Subheadings in an article. This will also control the "Comment Form" labels.
Body Normal body text
Metadata This will control meta data such as article count in a chapter, comments count, timestamps for comments, etc.

Course Tiles

Color Selector What it controls
Background Background color of the tile
Progress Color of the progress bar that fills the course tile as modules are completed
Hover Color of tile when the cursor hovers over it
Text Color of text in the tile

Click on Site Template

Adjust colors > Publish Changes

After you adjust colors, Preview Changes. When you are satisfied with the color selection, Publish Changes.

0 Comments

Add your comment

E-Mail me when someone replies to this comment