How to create a WordPress Child Theme (Step by Step)

What is a WordPress child theme?

One of the key features of WordPress is its ability to use themes to control the appearance and functionality of a website. However, modifying a (parent) theme directly can be risky as any changes made will be lost when the theme is updated. For this reason, child themes exist. In this beginner’s guide, we will walk you through the process of creating a WordPress child theme from scratch. Furthermore, we will cover the basics of what child themes are, why you should use them, and how to create and customise your own child theme. By the end of this guide, you’ll be able to confidently create your own WordPress child theme and take control of your website’s design and functionality.

What are the advantages of using a child theme?

Child themes…

• make your modifications portable and replicable;
• keep customization separate from parent theme functions;
• allow parent themes to be updated without destroying your modifications;
• allow you to take advantage of the effort and testing put into parent theme;
• save on development time since you are not recreating the wheel; and
• are a great way to start learning about theme development.

(Quoted from the WordPress Developer Handbook)

Getting Started with WordPress Child Theme

If you’re not familiar with child themes, they are essentially a separate theme that inherits the design and functionality of a parent theme. This way, child themes allow you to make modifications without affecting the original theme. For this reason, you can safely update the parent theme without losing any of your customisations. All of the code you add, will simply override and extend the codebase of the parent theme.

“A child theme inherits the look and feel of the parent theme and all of its functions, but can be used to make modifications to any part of the theme. In this way, customizations are kept separate from the parent theme’s files. Using a child theme lets you upgrade the parent theme without affecting the customizations you’ve made to your site.”

WordPress Developer Handbook

To get started with creating a WordPress child theme, follow the following steps.

Parent theme and child theme setup

The first step in creating a child theme is to choose a parent theme. This will serve as the base for your child theme. You can choose any parent theme that you like, but it’s important to choose one that is well-coded, regularly updated, and has a good reputation.

Once you have chosen a parent theme, the next step is to create a new folder for your child theme. You can do this either through your website’s file manager or by using an FTP client. Name the folder something that will help you identify it as the child theme.

Creating a style.css file

Inside the child theme folder, create a new file named style.css. This file will contain all of the CSS code for your child theme. It’s important to include a header at the top of the file that includes information about the child theme, such as the name, description, author, and version.

Enqueueing parent theme stylesheet

To ensure that your child theme inherits all of the styles from the parent theme, you need to enqueue the parent theme stylesheet in your child theme’s functions.php file. This tells WordPress to load the parent theme’s stylesheet before the child theme’s stylesheet.

Customizing Your WordPress Child Theme

Now that you have set up your WordPress child theme, it’s time to customize it to match your website’s design and functionality. Here are some of the key areas that you can customize:

1. Customising the header and footer.
   The header and footer are key areas of any website and can be customised. They can include your own branding, navigation, and other important information. To customise the header and footer, you will need to modify the header.php and footer.php files in your child theme.
2. Customizing the sidebar
   The sidebar is another important area of your website that can be customized. It can include your own widgets and content. To customize the sidebar, you will need to modify the sidebar.php file in your child theme.
3. Customizing the page templates
   WordPress comes with a number of built-in page templates, such as the full-width template, the blog template, and the archive template. You can customise these templates to include your own content and styling. To customise a page template, you will need to create a new file in your child theme. The new file should have the appropriate template name, such as page-fullwidth.php, for example.
4. Customising the styles
   The style.css file in your child theme is where you will add all of your custom CSS code to modify the design of your website. This can include changing the colors, fonts, layout, and other design elements.
5. Adding custom functionality
   In addition to customising the design of your website, you can also add custom functionality using PHP code. This can include adding new custom post types, modifying existing functionality, or creating new plugins.

Extending Your WordPress Child Theme with Templates

Templates are an important part of any WordPress theme. They define the layout and functionality of your website’s pages. By creating custom templates for your child theme, you can extend the functionality of your parent theme without modifying its files directly.

To create a custom template for your child theme, you first need to understand the WordPress template hierarchy. The template hierarchy determines which template file will be rendered on a specific page or post type. WordPress looks for specific template files in your theme folder and uses the first one it finds in the hierarchy. For example, if you want to create a custom template for your blog posts, you can create a file called single.php in your child theme folder. WordPress will use this file instead of the single.php file in the parent theme folder.

Another way to extend your child theme with templates is by using the get_template_part() function. This function allows you to include a template file from another location within your child theme. For example, you could create a custom template file called custom-template.php in a subfolder of your child theme called templates. Then, in your child theme’s page.php file, you could use the get_template_part() function to include that template. This includes the custom-template.php file from the templates subfolder of your child theme:

get_template_part( 'templates/custom-template' );

Tips and Best Practices for Working with WordPress Child Themes

Working with WordPress child themes can be a great way to customize your website without modifying the parent theme files directly. However, there are some tips and best practices you should follow to ensure your child theme works as intended and is easy to maintain.

• Keep your child theme up-to-date: Just like with any software, it’s important to keep your child theme up-to-date to ensure compatibility with the latest version of WordPress and the parent theme. When a new version of the parent theme is released, check to see if any updates are needed for your child theme.
• Avoid common mistakes when creating child themes: When creating your child theme, be sure to avoid common mistakes such as not including a style.css file or not properly enqueuing the parent theme stylesheet. These mistakes can cause your child theme to not work as intended.
• Test your child theme: Before launching your website, be sure to thoroughly test your child theme to ensure everything is working as intended. Check for any styling issues, broken links, or other errors.
• Use a child theme for client projects: If you’re working on a website for a client, using a child theme can be a great way to make customizations without affecting the parent theme files. It also makes it easier to update the parent theme in the future without losing your customizations.

Conclusion

In conclusion, creating a WordPress child theme can be a powerful tool for customising your website without modifying the parent theme files directly. By following the steps outlined in this guide, you can create a fully functional child theme. We hope this guide has been helpful to you and encourages you to start creating your own WordPress child themes. With a little bit of knowledge and practice, you can create a truly unique and personalised website that stands out from the rest.