Customizr Theme Options : Advanced options

Custom CSS

For the Beginner in particular, this is where the Custom CSS Panel comes into its own and provides a really powerful tool for applying CSS changes and seeing the effect immediately. 

Just remember to click the Save & Publish button to keep your changes.

If you use a Child Theme, any conflicting selectors will be overridden by what is added to the Custom CSS panel. This is a really useful feature to test speculative CSS code before adding it to a Child Theme.

Hint : escape all single and double quotes if you need to insert some (example selector:before {content:\‘Hello\‘;} )

Further reading guide to CSS and HTML in the Customizr theme.

Website Performance

When you have completed the customization tasks, the final consideration is how your site will perform on different devices. Customizr provides two useful aids:

  • The skin stylesheet (e.g. green.css) can be presented in a minified state, ie with all whitespace removed and more optimised for performance
  • Rather than loading all images before rendering a (scrolling) page, loading can be delayed until the image becomes visible

You'll find more about performance improvements in the  guide for page load optimizations with the Customizr theme and in the  recommended plugins page of this documentation.