The Custom CSS feature will aid any web developer with the freedom to write any styling rule to further customize the module elements. All that’s required is that you know how to write standard CSS.
- As a starting point and as a reference if you haven’t already download the default stylesheet, it’s recommended that you briefly review all of the default ID’s and Classes.
Download the CSS for Ver3Modules
- On each module page, you should be able to use your choice of any browser debugging tools by pressing F12 on your keyboard. You are then able to inspect any element to target the name of the specific ID or Class and you’ll be able to at least make “browser/client side” previews of your changes.
- Copy and paste your CSS changes to the Custom CSS box within the Integration Settings Control Panel > Appearance tab and click Save.
- Refresh the module page, and you should see your changes. Note that if you don’t see any of your changes, you may want to click the “Clear all Template Cache” button in the top left hand corner of the Integration Settings Control Panel, as the dynamic stylesheet engine may be holding on to a cached version.
For basic changes to color, font, and sizing, you can also make CSS changes using the Generic Style Preferences section.
Style/CSS is where you can add overriding CSS code to style the module pages. In GrowthZone, go to Setup > GrowthZone Pages > Actions > Style/CSS.