Do you have the itch to turn your WordPress theme into something unique? If so, there’ one important step you must take before you get started. Make a child theme first. Doing so will ensure that your hard work doesn’t get overwritten by a future theme update.
Be sure you need a child theme before you got to the time and effort of making one. I explain why and when to use a child theme in this post. If you have customized your design using the Theme Customizer, or a theme settings page in the WordPress admin area, then you don’t need a child theme.
Before you start, make sure you have the following. You won’t get very far without the right tools.
- An FTP program. You use this to move files to and from your web server.
- The FTP login credentials for your web server.
- A plain text editor (NOT a word processor).
Once your tools are lined-up, you’re ready to make a child theme.
Step-By-Step Guide to Making a Child Theme
In this example, I’ll create a child theme for Twenty Seventeen. This method will work for any theme.
Step 1: Create a new folder under /wp-content/themes/. This is the home folder for your child theme. Name it whatever you like, just don’t use spaces or punctuation. It’s also a good idea to using lowercase letters only. In the example below, I’ve named the folder “my-child-theme.”
Step 2: Inside of the new child theme folder, create a new file named style.css. This is the stylesheet for your child theme. This file is where most of your customizations will be made in this file.
Step 3: Using your text editor, open the style.css file in your parent theme’s folder. The parent theme is the theme you’re customizing. Copy the header portion of the parent theme style sheet.
Step 4: Open the style.css file in your child theme folder. It should be a blank file at this point. Copy the parent theme’s header information into the child theme’s style.css file.
Step 5: Edit the header information to reflect your child theme’s information. You want to change the Theme Name, so you can identify your child theme from the parent theme.
Add a new line: “Template: “ and include the name of the parent theme folder after the colon (see the example below). This “template” line tells WordPress which theme the child theme is customizing.
Step 6: Below the child theme header, add a line to import the parent theme’s styles. If you fail to do this, your child theme will look rather plain. Be sure to add all of your CSS customizations below this line.
Replace “twentyseventeen” with the folder name of your parent theme.
Step 7: Back in the WordPress dashboard, under Appearance, activate your child theme.
Step 8: Now you can modify your child theme as needed, without fear of losing your hard work.
Add your custom CSS to style.css below the import line.
To customize PHP templates, copy the appropriate template file from the parent theme to the child theme, then customize the template to meet your needs.
If you’re having trouble figuring out which template needs customization, consult the WordPress template hierarchy.
Also, be sure you copy only the PHP files that you plan to customize. Do not copy every PHP file in the parent theme.