Builder Style Manager: Introduction
The Builder Style Manager - BETA is a plugin for iThemes Builder that provides an easy-to-use interface to adjust basic styling of various site elements. Style Manger generates the CSS code and gives a preview of changes in real time to easily assign colors, change fonts, add borders or change spacing specifications for various site components.
Styling options available in Style Manager include:
- 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.
Style Manager Formats: Responsive vs. Non-Responsive
Style Manager supports two different formats: a format for the newer, responsive-ready child themes and a format for the older, non-responsive child themes. These formats are not compatible with one another, meaning that you will only have access to the Styles that are usable by your current child theme.
If you are running a responsive-ready child theme, a notice will appear after installing Style Manager with a list of Styles created in this format. Any Styles in the other format still exist and can still be used if you switch back to a non-responsive child theme.
- Download the Builder Style Manager - Beta plugin from iThemes Member Panel.
- From the WordPress dashboard, navigate to Plugins > Add New.
- Install and Activate the builder-style-manager zip file.
Once Builder Audio Block has been installed, you'll notice a new menu item has been added to the My Theme left-hand navigation of your WordPress dashboard for Style Manager.
Creating a New Style
To create a new style, click Create Style from the Styles page.
The Style Editor
The Style Editor page will appear.
Tip: Drag the Preview Section to the top to expand it full-width.