iThemes already includes a setting which enables you to generate a new child theme simply by clicking a button. See the following screenshot which shows you the setting:
This built in parent theme functionality enables you to either:
Activate an existing child theme or
Create a new child theme
If you’ve just installed a iThemes parent theme then you’d choose the 2nd option and Create a new child theme.
If you’ve already created a new child theme, you can select it using the 1st option.
The 1st option also allows you to select a child theme you’ve created yourself rather than using the Create a new child theme functionality. The following screenshot shows 2 child themes available for selection.
The 1st is the child theme generated when you select Create a new child theme and the 2nd is a child theme you can create manually and upload to your WordPress installations themes folder.
As you can see, there’s 2 ways to use a child theme with any iThemes parent theme.
Here’s a free child theme download which you can install after uploading any iThemes parent theme.
Note: You will need to change the Template name in the child themes style.css file to match the directory name of your parent theme.
In the child theme download, you’ll find 2 files. A functions.php file and a style.css file. The style.css file contains the following header:
Theme Name: Child Theme
Theme URI: http://wpsites.net/wordpress-themes/child-theme-for-ithemes/
Description: Child Theme for your iThemes parent theme
Author: Your Name
Author URI: http://wpsites.net/wordpress-themes/how-to-make-your-own-child-theme-for-wordpress-beginners-guide/
Make the sure the Template name used is exactly the same as the name of your parent theme folder ( directory ). In this case the parent theme folder is named new so swap that out with the name of your parent theme folder.
All other information in the child themes style.css file header can be changed.
Once you have installed the Divi parent theme, you can install this child theme.
About This Child Theme
The child theme contains 2 files.
A footer.php file which includes modified footer links which you can customize yourself or simply delete the file altogether.
It also includes a style.css file which contains CSS to customize the styling of the footer links and change the colors of the social icons in the footer. You can modify the CSS to your own liking or remove all the CSS entirely and add your own.
If you’re not going to install the Nivo slider (Lite) plugin and use it immediately after installation of 2012C, please go to your header.php file and remove the line of code from line 38 (otherwise you may get an error message which won’t be fatal)
You’ll find 3 footer widgets have been added to 2012C.
The default theme for WordPress, Twenty Eleven is one of the most popular free themes as its already included in every new WordPress installation & update.
The only problem is Twenty Eleven will be exactly the same as everyone else is using unless you customize your parent theme by adding, editing and changing both the PHP code for custom functions and the CSS code for custom styling & decoration.
Adding, editing & changing WordPress code in your parent themes files presents another problem. When you update, all your customization will be overwritten by the new files in the update.
The solution in order to avoid losing all your custom coding when updating your Twenty Eleven parent theme is to use a child theme.
Making a basic child theme is a lot easier than you think.
But why would you need your own child theme?
If you have made any design changes using CSS code or created functions in your themes functions.php file then you may want to save this work in a separate folder.
If you don’t save your custom code modifications, they will be lost when you update your parent theme!
This separate folder is called a child theme and over rides your parent theme which could be Twenty Eleven or any other parent theme.
There’s 2 ways to create a child theme in WordPress:
You can use the @import rule in your child themes style.css file
Or you can use wp_enqueue_scripts in your child themes functions.php file (This is the preferred method)
Downloads – Child Theme Examples
This child theme will only work if you have the Twenty Eleven parent theme installed. If you are using another theme, you need to modify the style.css in this child theme to import your parent themes file.
This is an example of using the @import rule in a child themes style.css file
This child works with the Twenty Sixteen child theme for WordPress which must be installed before you install this child theme.
Note: This child theme only works with WordPress 4.4 which will be released on December 4th 2015. Use the WordPress beta tester plugin if you want to use Twenty Sixteen however its not advisable to use a beta version of WordPress on a live site unless you know what you are doing.
There’s only 2 files you need to create inside your child themes root directory:
A functions.php file
And a style.css file
Here’s how to create the functions.php file which loads your child themes style.css file.
Simply create a new file using a code editor like Notepad++ named functions.php
Add the code from the Gist labelled functions.php below
Save the file in your child themes root directory
You can then create a new file named style.css in your child themes root directory and add your custom CSS modifications to the file. This custom CSS will over ride your parent themes CSS as its loaded afterwards.
Another Way To Create Child Theme
You can also use the following PHP and CSS to create a child theme.
Create a new file named functions.php and paste the PHP code into that file.
Create a new file named style.css and paste the CSS in that file.
Both files should be placed in the root directory of your child theme.
Here’s the code:
Video – Create Child Theme
This video shows you how to make your own child theme using the Twenty Sixteen parent theme as an example. You can use this video as a guide to create a child theme for any parent theme.
The video uses the wp_enqueue_scripts function to load the child themes style.css file after loading the parent themes styles.
Create a Child Theme Using @import
The contents of the style.css file will include the custom CSS code you have added to make changes to your original parent themes styling. Plus a few lines which all child themes include. Here’s how to do it:
2) Using File Manager, navigate to wp-c0ntent/themes which is where your current parent theme is located
3) Click on New Folder and name the folder the same as your parent theme but also include – child at the end
Example: thesis-child or twentyeleven-child. I’ve named mine canvas-child
4) Create a new file using notepad and name it style
5) Add this information to the top of the file
Theme Name: parenttheme-child
Author: Your name here
The 2 most important and compulsory details are:
Theme Name – The name you have given your child theme i.e canvas-child or twentyeleven-child
Template – Directory name of your parent theme (case sensitive) i.e canvas or twentyeleven or thesis
6) Add this line of code as well below the above detail in your child themes style.css file
Make sure you name the blue part the same as your parent theme i.e twentyeleven or canvas or thesis (Not the name of your child-theme).
This will import your parent themes style.css file
You can now add any custom CSS code changes you want to make into your child themes style.css file rather than use your parent themes style.css or custom.css file.
Tip: A great way to customize your site is to copy and paste CSS code from your parent themes style.css file into your new child themes style.css file and make custom changes to it there.
7) Now go to Appearance > Themes and activate your new child theme. It will only work if the parent theme is installed.
Whenever you update your parent theme, all your CSS changes will not be overwritten as they are in your new child theme directory which you have just created.
You could also add a screen shot 300 x 250 and simply name it screenshot. Import the screen shot into the child theme folder and it will show up in the backend of your WordPress admin panel like your parent theme’s image does.
Here’s what the inside of your child theme directory will look like. Pretty simple but a great start to making your own theme.