Sometimes, while working on a website, you’re gonna need to make some changes to the theme you’re using. For our themes, we have special places where you can do that, such as the custom.css and functions.php files, but the best practice to modify how a theme looks or works is doing it through a Child Theme.

A Child Theme is a theme that inherits the same functionality and styling of another theme, called the parent theme. By creating and working on a child theme, you can add, modify or disable parts of your site without changing the original files of the parent theme. You don’t have to worry anymore about updates to the parent theme, since there is no need to exclude your modified files from the updating process, or to re-add your changes to fit the new version. After the creation of a Child Theme, you end up significantly speeding up your development time.

Creating a child theme

1. Download and install your parent theme inside your wp-content/themes folder.
2. Create a new directory for your Child Theme besides the one for your parent theme. It’s recommended to name it as the folder of your parent theme and append “-child” to it (for example, if the folder of your parent theme is called my-theme, name your Child Theme’s folder as my-theme-child).
3. Inside your Child Theme’s folder, create a file called style.css, with the following contents:

   /*
   Theme Name: My Theme Child
   Template: my-theme
   */
   

   You’re gonna need to modify that code to fit your actual child and parent themes. Notice that the “Theme Name” property will be the name of your new Child Theme, while “Template” is the name of the folder of your parent theme. Once you completed this step, you can see that your Child Theme appears listed in your Dashboard, under Appearance > Themes.

4. Still in your Child Theme’s folder, create a file called functions.php, and put the following code inside it:

   <?php 
   add_action( 'wp_enqueue_scripts', 'my_theme_child_enqueue_styles' );
   function my_theme_child_enqueue_styles() {
       wp_enqueue_style( 'my—theme-style', get_template_directory_uri() . '/style.css' );
   }
   

   This code will load the styles of your parent theme inside your Child Theme once you activate it.

5. Activate your Child Theme in Appearance > Themes.

That’s all. Now you can start adding your custom styles inside styles.css and your custom functionality inside functions.php. This way, once there’s a new version available for your parent theme, you can update it without worrying about losing any changes you have made to it.

Using custom files

For our themes, if you want to replace any of their files in order to have your own version of them, you just need to create new files with the same names and in the same relative locations as the originals. Some examples:

• If you want a custom version of my-theme/index.php, just copy that file to my-theme-child/index.php and modify it as you need.
• If you want a custom version of my-theme/includes/options.php, just copy that file to my-theme-child/includes/options.php and modify it as you need.

The only exception to this rule are the functions.php files in the root folder of both your child and parent themes. WordPress will always load both files when using a Child Theme: the one inside the child first, then the parent’s one.

Further reading

This is just a very simple introduction to what you can do and accomplish by using a child theme. If you want to know more about advantages, features, practices and methods, you can read the article about Child Themes in the WordPress Codex.