What is a child theme?
WordPress child theme is a theme that inherits functionality from another theme called parent theme. Child theme is a great way to modify existing theme without changing the original files.
When to use child theme?
You should use child theme when:
- You want to make changes to style files
- Add functionality
- Modify theme, but still want to keep original files when the theme is updated
How to Create a Child Theme Automatically
Install One-Click Child Theme WordPress Plugin.
Using the plugin
Once you have installed and activated the plugin, the themes menu will have a new sub-menu called “Child Theme”. Clicking on this gives you a form that will allow you to create a child theme based on the current active theme. Once you have followed the process you can deactivate and delete the plugin as it will not be needed anymore unless you intend to make child themes of other installed and activates themes.
How to Create a Child Theme Manually
Creating child theme is pretty easy.
Create on your server or local machine empty directory. You can name it whatever you want, but the best practice is to use parent theme directory name with “-child” appended to it. This directory should be placed under wp-content/themes. For example child theme directory for “Medicate” theme should be named “medicate-child”
Child theme requires only one file – valid child theme style.css file. Using text editor create new style.css file. This style sheet file must start with this header:
/* Theme Name: YOUR THEME NAME Theme URI: THEME URL Description: CHILD THEME DESCRIPTION Author: AUTHOR NAME Author URI: ABOUT AUTHOR URL Template: PARENT THEME DIRECTORY NAME Version: CHILD THEME VERSION */
/* Theme Name: WP Fix It Theme URI: https://www.wpfixit.com Description: WP Fix It Child theme Author: Jarrett Gucci Author URI: https://www.wpfixit.com Template: wpi Version: 1.0 */
This header is used to tell to which parent theme is your child theme related.
Child theme style.css will override parent theme style.css . If you wish to modify parent theme style.css, simply copy it inside child theme directory and add header. Now you can change colors, styles, fonts and other elements, without interfering with parent theme style.css .
If you wish to include parent theme style, you will need to include it into child theme css. To do that simply add this line just after child theme header:
Please note that all CSS definitions should be added after @import . Otherwise, CSS changes will not have any effect.
Activating child theme
Child theme can be activated as any other theme. If you have done everything correctly, your theme should be listed in “Themes” panel (“Appearance” -> “Themes”). All information (theme name, author) are displayed on this screen.