Create more than you consume

I’m now writing over at my brand new site. Check it out and follow along.

How to create a WordPress Child Theme

I wanted to write a super quick blog post (so I could link to it from another article) about how to create a Child theme for your WordPress Theme. It really is a lot easier than you’d think. There’s some key things to look for. In this ‘how to’ I’m using the plugin hunt theme as an example.

First up find the ‘slug’ of your theme. This is usually the folder name of the theme. In the plugin hunt theme example this is simply ‘pluginhunt

Create a new folder in your theme directory /wp-content/themes and add ‘-child‘ to the end. So you’ll have a folder named pluginhunt-child.

Then inside this folder create the following files

  • functions.php
  • style.css

That’s all you need to have a child theme up and running.

What goes in style.css

This is the important part. This tells WordPress that this folder is a child theme (and which theme is its parent). Below is what you need to include.

/*
 Theme Name: Plugin Hunt Theme
 Theme URI: http://epicplugins.com/plugin-hunt-theme-child/
 Description: Plugin Hunt Theme Child
 Author: epicplugins
 Author URI: http://epicthemes.com
 Template: pluginhunt
 Version: 1.0.0
 License: GNU General Public License v2 or later
 License URI: http://www.gnu.org/licenses/gpl-2.0.html
 Tags: light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
 Text Domain: plugin-hunt-child
 */

Simple or what? looking at the above the key things to make sure match are the Template: pluginhunt matching the slug of the parent theme. You also should define a text domain (for any of your edits) and to make sure it’s translatable (if you intend to have your theme used elsewhere).

This stylesheet is loaded after the parents styles, so anything you add to this stylesheet will override the parent styles. Most themes give you the option for custom CSS though, so I wouldn’t create a child theme just for CSS changes (unless the parent gives no option for custom CSS)

What goes in functions.php

It’s up to you. Anything in this file is accessed by the child theme. It also uses any of the functions in the parent themes ‘functions.php’

So what’s the point of a child theme?

Any of the parent files that you copy into the child theme will be loaded instead of the parent’s versions. For example you may want to:-

  • Change the index.php file to display 4 columns instead of 2
  • You may want to change only the WooCommerce templates (like how I improved my digital product pages)
  • You may want to edit other templates (like page.php)

I hope this helps in how to get a child theme up and running 🙂

 


Comments

Leave a Reply

Your email address will not be published. Required fields are marked *