Please Note: The following screencast was created using Dynamik Website Builder, but is completely relevant to Genesis Extender since it shares this same feature.
Powerful Custom CSS Tools
To add Custom CSS to your Genesis Powered website just add it to the Extender Custom > Custom CSS textarea or Activate the Front-end CSS Builder feature. This will display a "Show/Hide CSS Builder" tab on the front-end of your website where you can click to display the CSS Builder Tool included with Genesis Extender.
With this tool displaying on your site's front-end you will be able to utilize both the CSS Builder Tool as well as the Custom CSS Editor. But what makes this feature so intuitive and powerful is the fact that your CSS will result in real-time changes to the style of your website. Just add your Custom Styles and watch the changes take place as you type in the code!
CSS Builder vs Custom CSS
The "CSS Builder" section is only for helping you create the CSS. It is the "Custom CSS Editor" popup that actually provides a place to add/edit/save Custom CSS that will effect your site's design for all visitors.
The CSS Builder changes are only temporary and the Custom CSS Editor changes are temporary until you click "Save Changes" to write them to your actual Custom Stylesheet. So no one but you will see these changes until you save them in the Custom CSS Editor.
Just want a simple Front-end CSS Editor? Then select this option.
Who Sees The CSS Builder Tool
To be able to see the "Show/Hide CSS Builder" tab, let alone be able to display and use the CSS Builder Tool, the "Activate Front-end CSS Builder" option must be selected and you must be currently logged in as an Administrator. So basically, no one but you will see these items.