Tweet about this on TwitterShare on FacebookShare on Google+Share on LinkedIn

Child ThemeBefore I get into how to create and make a WordPress Child theme, let me explain why you should consider using one.

The main reason that you would create one is to preserve original theme files so that your customizations are not lost when your theme gets an update.

For example, if you make changes to the layout, design, styling, etc. of your website by editing your theme files (.php, .css, .js, etc.) what happens is when you update your theme all the files that you have changed will be overwritten with new ones. Basically wiping out all your hard work in one pop.

To prevent that from happening and to keep your changes you can create what WordPress calls a Child Theme. You need to create a child theme folder/directory with a minimum of 2 files to make it work (functions.php and style.css along along with a few lines of additional code). After you are done you can add custom functions, css styling, etc. to those files for example.

If you want to make changes to other files such as: header.php, footer.php, sidebar.php, etc. you would just copy them from the original parent theme folder to the child theme folder, and then edit them.

In other words WordPress will look in the child theme folder (your edited/changed files) first. If it finds what it needs, it will use it. If it doesn’t it will look in the parent theme. Same thing for custom css. It will check your child style.css first. If it finds what it’s looking for it will use it. If not it will look to the parent style.css.

*Before continuing you may want to download a back up of your files and database first.

I will be using the twentyfifteen theme as an example. If you are using another theme, then replace twentyfifteen with the name of your theme.

Navigate to your theme folder with your host account file manager (in cPanel,etc.), or with a ftp client (FileZilla, etc.)

For example:
yourdomain/wp-content/themes
Or,
/home/your-account-name/public_html/wp-content/themes
(depending on your hosts control panel)

Create a new folder/directory called twentyfifteen-child

So, you end up with:
yourdomain.com/wp-content/themes/twentyfifteen-child
or
/home/your-account-name/public_html/wp-content/themes/twentyfifteen-child

Note:
You will have both a twentyfifteen folder and a twentyfifteen-child folder after doing so.

Go into the twentyfifteen-child folder and make a new file called:
functions.php

Open/edit the new blank functions.php file and add the following to the top:

Then, save the changes and close it.

Now make a new file in the twentyfifteen-child folder and name it:
style.css

Open/edit the new blank style.css file and at the top add:

Once you are done save the changes and close the file.

Theme Name is the name of your child theme.
Template is the folder name of the parent theme.
Text Domain is the folder name of the child theme folder.

(Remember to use your real theme names.)

WordPress Child Theme

Copy:
yourdomain/wp-content/themes/twentyfifteen/screenshot.png
Or,
/home/your-account-name/public_html/wp-content/themes/twentyfifteen/screenshot.png

To the new child theme folder:
yourdomain/wp-content/themes/twentyfifteen-child/screenshot.png
Or,
/home/your-account-name/public_html/wp-content/themes/twentyfifteen-child/screenshot.png

Now you need to activate your new child theme in the WordPress Administration Dashboard.

Login to your WordPress Dashboard and go to:
-> Appearance
–> Themes

Find and activate your new Child Theme in the list.

From now on you can add your custom .css to your newly created child-theme style.css file with either your hosting file manager, or directly in the WordPress Dashboard here:
-> Appearance
–> Editor
—>Stylesheet (style.css)

Same with functions. Any custom functions that you want to add you can either use your hosting file manager, or directly in WordPress Dashboard:
-> Appearance
–> Editor
—> Theme Functions (functions.php)

If you want to customize specific theme .php files, copy them from the parent theme to your child-theme folder and edit them.
IE:
Copy: parent-theme/sidebar.php
To: child-theme/sidebar.php

Then, edit the child-theme/sidebar.php file with your hosting file manager, or in the WordPress Dashboard Editor.

Now if the parent-theme has an update you can safely apply the update without losing any customizations because your changes are stored in the child-theme. The parent-theme folder will get the new updates, and your child-theme files will not. Meaning your customizations will remain intact.

Just make sure you are really editing: child-theme/file-name(.php/.css) and not the original parent theme files.

About: Jeremy LeSarge - AKA: Ray (211 Posts)

I am the site owner and administrator of DialMe.com. I provide help and tips for Boonex Dolphin on the main part of this website where you will also find an assortment of other resources. Here, on the blog I write about a variety of topics surrounding WordPress, technology, social media/networking, SEO, and webmaster resources.