Tag Archive for: WordPress Child Theme

As more and more WordPress users now customize their themes and only few users like the themes in default mode we will learn in this article how to create a Child Theme from a WordPress Theme.

Why use a Child Theme?

You will save yourself from a lot of headache by creating a child theme. Child theme allows you to make changes without affecting the original theme, which will in turn make it easier to update your parent theme to latest versions without loosing all the changes you made. In the child theme you create a completely separate set of files that you can use to customize the theme without affecting the original theme. This way you will make sure that your original theme is intact as you are not making any changes to it.

Getting Started

1. Create a new folder/directory in your themes folder. This new folder will contain you child theme. For our reference we will create a child theme of WordPress Twenty Fourteen Theme.
2. In the child theme folder create a stylesheet file named style.css. This is the only required file for a Child Theme. Open the newly creates file and put the following code at the top.
   /* Theme Name: Twenty Fourteen Child Theme URI: https://www.webtamarin.com Description: Put the theme description here Author: Author Name Author URI: https://www.webtamarin.com Template: twentyfourteen Version: 1.0.0 Tags: light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready Text Domain: twenty-fourteen-child */ @import url("../twentyfourteen/style.css");

   1 2 3 4 5 6 7 8 9 10 11 12

   /* Theme Name:   Twenty Fourteen Child Theme URI:    https://www.webtamarin.com Description:  Put the theme description here Author:       Author Name Author URI:   https://www.webtamarin.com Template:     twentyfourteen Version:      1.0.0 Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready Text Domain:  twenty-fourteen-child */ @import url("../twentyfourteen/style.css");

   You can make changes to the above code according to your suitability. Only Theme Name and Template are required, all the rest are optional. The Template value is the name of the directory of the parent theme.

3. Go to your website’s dashboard, and go to Administrator Panel -> Appearance -> Themes. Here you will now see your newly create theme among the list of other themes. Activate the Child Theme.

Editing the functions.php File

The functions.php of a child theme does not override its counterpart in the parent them unlike style.css. It is loaded in addition to the parents function.php not in place of it. Your child theme’s functions.php file should start with a php opening tag and end with a php closing tag. In between, you can add your desired php code.

 For example, you want to add a new function to you theme, the fastest way is that you open your theme’s function.php and add the new function. But now if you update your theme the new function added by you will be removed. The better way is that you add the new function toy your child theme’s function.php. 

Editing Other Templates

If you want to make structural changes to your theme by changing PHP template files, this can be done by replacing the file entirely with a new one  in your child theme. Your child theme can override any file in the parent theme: simply include a file of the same name in the child theme directory, and it will override the equivalent file in the parent theme directory when your site loads. For instance, if you want to change the PHP code for the site header, you can include a header.php in your child theme’s directory, and that file will be used instead of the parent theme’s header.php.