Create a WordPress Child Theme

In this tutorial I show you how to create a WordPress child theme. Setting up a child theme can be accomplished in a few minutes. One of the most important reasons to use a child theme is to avoid losing your customization during your theme update.

How it's done

1. Create a new folder with 2 key files. (style.css and screenshot.png)
2. Use a text editor to create a new document and save it as style.css. Open the style.css file, copy and paste the content below, add your own info and save. (I use notepad++) as my text editor. It's great for development and everyday use on your PC.

/*
Theme Name: This is the Title
Theme URL: http://www.yourwebsite.net
Author: Your name
Author URL: http://www.yourwebsite.net
Template: Template Name
Version: 1.0
*/

@import url ("../yourthemename/style.css");

Note: If you have any CSS customizations add them below this line - @import url ("../yourthemename/style.css");
3. Open Photoshop or any image editor. Create a new thumbnail image for your child theme. Make it as pretty as you like and save as an optimized .jpg, .gif or .png in this size (300px by 225px).

Two ways to upload your child theme

 

1. File Manager

Every web host has a file manager. In this case you would need to zip up the child theme folder. Then log into your web host and locate the file manager. Once inside the file manager, upload the zip file to your theme folder. Once your zip file is uploaded into your theme folder you can now extract the contents. Once confirmed, delete the zip file.

2. FTP

In this case you don't have to zip it. Simply open your FTP client, locate your WordPress theme folder on your web host. Create a new folder. Since my theme is Headway, in this example I will call it "headway-child". Now open the new child theme folder and upload the contents to it - (style.css and screenshot.png) If you did everything correctly you should be cleared to update your theme without losing your css customizations.



%d bloggers like this: