Do you want to make changes to the code of the WordPress theme you are using?
You might think that you can just go into the files of that particular theme and make changes directly.
But what happens if that theme gets updated by the author? Well, your modifications could be lost, and all your hard work would be gone!
This is why it is best practice to create something called a “child theme“.
“What is a child theme?” I hear you ask. A child theme is a theme that inherits the styling and functionality of another theme known as the “parent theme”. So ultimately the child theme looks and functions in exactly the same way as the parent theme.
But the beauty of a child theme is that you can make changes to styling, layouts and functionality within the files of the child theme without even messing with the code of the parent theme. The changes you make in the child theme files work in conjunction with or override the files of the parent theme.
Ultimately, what this means is if the theme author does push updates to the parent theme, you won’t lose your modifications.
Also, creating child themes can be a great way to learn to code and to learn all about how WordPress themes work without any risk of damaging the parent theme.
There are two main ways to set up a child theme. The first is using a plugin, which is perfect if you aren’t confident with coding. The second is doing it manually by editing the theme files directly.
In this post, I’m going to show you how to set up a new child theme using a plugin.
1 | Install the Child Theme Configurator plugin
The easiest way of creating a child theme is using a plugin called Child Theme Configurator which currently has over 200,000 active installations.
To install this plugin, log into your WordPress admin area and go to Plugins then Add New. If you search for “Child Theme Configurator”, you will find a plugin that looks like this:
Click Install Now and then Activate.
2 | Create a child theme
Once this plugin has been installed, go to Tools and then Child Themes.
On this page, we are going to be working within the Parent/Child tab (which should already be selected) and we will work through step by step.
Step 1, choose the CREATE a new Child Theme option. If you’ve never set up a child theme before then this will be the only option to select. However, if you already have a child theme in your theme files then you will see a few more options here.
Step 2, select the theme that you would like to create a child theme for. In this example, I’m going to use the Twenty Seventeen theme that comes pre-installed on WordPress. Then click Analyze. This will check to make sure that a child theme can be created for the theme you have selected.
If everything is OK, step 4 will be to choose a name for your child theme directory. A name will be automatically generated for you with the name of parent theme plus “-child” on the end. I’d recommend leaving this name as it is.
Step 5, choose where to save new styles. If you would just like to put all your new styles in a new style.css file, choose Primary Stylesheet, but if you want to use a separate stylesheet, choose Separate Stylesheet. I personally always choose the first option.
Step 6, choose Parent Theme stylesheet handling. It is best practice to choose the Use the WordPress style queue option.
Step 7 is optional. If you click Show/Hide Child Theme Attributes then you will be able to see the theme information that is imported from the parent theme’s style.css file. You can update these attributes if you wish, but they will have been automatically updated ready for your child theme.
Step 8, choose whether or not you would like to copy the menus, widgets and other settings that you have set up for the parent theme to your new child theme. It is entirely up to you whether you tick this box, but if you don’t it will mean settings up your menus and widgets from scratch.
Step 9 is the final step in the setup of a child theme. Click Create New Child Theme when you are ready.
And that’s it! Your child theme has now been set up.
3 | Activate your child theme
To make it live, go to Appearance then Themes, and select your new child theme.
To add your own styling, go to Appearance the Editor and add your styling into the style.css file. If you need any styling help, I recommend you check out the CSS section of W3Schools.
Get access to my freebies library!
My exclusive freebies library contains cheat sheets, checklists and other resources to help you to create and run your dream website.
To access my freebies library and join my community just fill in the form below. Find out more information about my community right here.
If you have edited your main theme directly, don’t worry! I’ve got a tutorial coming very soon that will show you how to create a new child theme from a theme you have already made modifications to. Stay tuned for that!
And if you are looking for someone to help you develop a theme from scratch then please do check out my services page. I’d love to get involved with your next project!
Leave a comment