One of the great things about WordPress is you can edit all the files, theme files, plugin files even the WordPress Core itself. The problem is if you do then as soon as anything gets updates you loose all those changes you painstakingly made.
Below I will show you how to create a child theme so any changes you would normally make to a theme’s files you can make to the child theme files.
How does a child theme work?
A child theme inherits all the characteristics of a parent theme, which makes it easy for you to customise any code while leaving the parent theme’s functionality intact. When the parent theme gets updated, your code customisations will not be overwritten, and any changes you’ve made will remain.
In addition, using a child theme lets you easily track any edits you’ve made. Since the files of a child theme are separate from those of a parent theme, you can easily see what you’ve adjusted and undo any unwanted changes.
A WordPress child theme is stored in a directory which is separate from the parent theme. Each child theme, like its parent has its own style.css and functions.php file, you can add other files as needed but you must have these two files for your child theme to work.
With the style.css and functions.php files, you can alter anything you need to, including:
- styling
- layout parameters
- coding
- scripts
You can adjust these items within your child theme even if they are not present in the parent theme.
When someone visits your site, WordPress first loads your child theme, then retrieves any missing styles and functions using parts of your parent. This means that you get the most out of your customised child theme design without taking anything away from the parent theme’s core functionality.
How to create a child theme
Creating a child theme is really easy simply follow the instructions below:
- In the wp-content\theme folder create a new folder called theme name – child
- In the new folder you just created create a style.css file
- Now you need to enter some code, it will look similar to the code below. The most important line is Template this tells WordPress where the parent theme is an the name must match the the parent theme folder. In the example below this would create a child theme for the Twenty Twenty theme:
/* Theme Name: Twenty Twenty Child Theme URL: http://yourdomain.com Description: Twenty Twenty Child Theme Author: Your Name Author URL: http://yourdomain.com Template: twentytwenty Version: 1.0.0 Text Domain: twentytwenty-child */ - Now you need to create a functions.php file and enter the code below:
<?php add_action( 'wp_enqueue_scripts', 'enqueue_parent_styles' ); function enqueue_parent_styles() { wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' ); } ?> - Now login to your WordPress site, click Appearance, Theme and your child theme should be listed, click Activate!
- That’s it you can now edit the style.css and functions.php files to add all the additional functionality and styles you want and they won’t be overridden by the next update.
