Builder Style Manager: Creating Styles

From iThemes Codex
Revision as of 20:25, 29 July 2013 by Kristen (talk | contribs) (Tip: Expand the Preview Section)
Jump to: navigation, search

To create a new style, click Create Style from the Styles page.


The Style Editor

The Style Editor page will appear.


Tip: Expand the Preview Section

Tip: Drag the Preview Section to the top to expand it full-width.

Style Manager Options

From here, add any styles to the corresponding sections:

  • Site Background - Modify the main site background with a background color, image, attachement, repeat and positioning.
  • Site Font - Modify the base font on the site by choosing the font family, size and color.
  • Links - These options are for global styling of links. Choose Link color, decoration, hover color and hover decoration.
  • Headings - These styles are mostly-useful for modifying styling of content as different sections allow for styling specific headings (such as h1, h2, h3, etc.).
  • Container - These options style the Container. The container is the wrapper div that contains all the modules.
  • Post/Page Content Styling - These options style the page and post content.
  • Comments Styling - Styling for the wrapper around all the comments and styles for individual comments.
  • Basic Module Styling - These options set some basic module styling options that apply to all modules. The background options can be overridden for specific modules in each modules' options.
  • Module Sidebars (and Widgets) - These options style the background behind the modules in all module sidebars. Note that Widget Bar module sidebars are styled separately in the Widget Bar Modules section.
  • Header Module - These options control the styling of the Header Module.
  • Content Module - These options control the styling of the Content Module. The post and page content can be styled in the Post/Page Content Styling section. Comments can be styled in the Comments Styling section.
  • Navigation Module - These settings style the unhovered, hovered and active styling appearance of the Navigation Modules.
  • Image Module - These options control the styling of the Image Module.
  • Widget Bar Module - These options style the Widget Bar module container that holds all the widget areas, the Widgets and Widget titles
  • HTML Module - These options control the styling of the HTML Module.
  • Footer Module - These options control the styling of the Footer Module.

See also

← Back to Builder Codex Home