Child Themes Demystified
Posted on December 12, 2014
Building a WordPress Site?
That’s wonderful – we love WordPress! Creating your site using the WordPress CMS platform is kind of like building a car. Not everyone knows how to build one, but most people can drive! In the same way, customizing a WordPress theme the right way can be quite confusing, so today I am going to demystify Child Theming so you can build custom WordPress sites of your own!
First you’ll need to have an installation of WordPress and a theme you’d like to customize picked out & installed. You can do this through the Appearance -> Themes Interface.
Next hover over Plugins and select ‘Add New’. Search for ‘Duplicate Theme’, install and activate.
Head back to Appearance -> themes and click on the theme you wish to Customize. Click on the Duplicate link on the bottom of the Theme inspection popup.
Select the theme you’d like to create a Child Theme for and then give it a name. Now, go back to Appearance -> Themes and activate your newly created Child Theme.
Now you can add CSS to overwrite the CSS in the parent theme. The easiest way to begin with this is by using Firefox or Chrome to ‘Inspect Elements’ on the front face of the website (right-click and select inspect element), copy their CSS tags and then overwrite the rules you find there to change color, size, location, fonts, etc.
Don’t forget the all powerful “!important” tag. If your theme uses additional CSS files beyond the default style.css, you may have to use the “!important” tag to make sure that the browser uses the rules you’re writing over the rules existing elsewhere in the parent theme. This should also work for Plugin customizations!!
If you found this helpful, please share!