How to create a Child theme
If you make changes to a theme’s files, those changes are likely to be overwritten when you next update the theme. In order to prevent that from happening, create a child theme in which you can make create copies of a theme’s files and tweak them, without fear of it being overwritten by any future theme updates.
We recommend all of our customers to create a child theme, even if they’re not planning on modifying theme files anytime soon. It’s not hard to create one, you just need to follow the following instructions.
You can check the Child Theme Codex on WordPress.org site to see more examples and features.
Instructions:
All you need to do is create one folder, and stylesheet and functions file. And make sure that you have FTP access, before you continue reading this documentation.
Log into your website using your favorite FTP client, such as FileZilla or Total Commander, and navigate to wp-content/themes/ directory. This is the directory where all your themes are living a happy life.
Now, you need to create a new folder for your child theme. You can name it anything. For this example, we will be creating a child theme of Alpha Store PRO, so we will name it alpha-store-pro-child.
A child theme consists of at least one directory (the child theme directory) and two files (style.css and functions.php), which you will need to create:
- The child theme directory (for us in this tutorial – alpha-store-pro-child)
- style.css
- functions.php
Once you have created your folder, you need to create a style.css file inside that folder. Your stylesheet will consist some vital information inside it, so paste the following in it using your favorite text editor:
|
1 2 3 4 5 6 7 8 9 |
/* Theme Name: Alpha Store PRO child Theme URI: http://themes4wp.com/product/alpha-store-pro/ Description: Child theme for Alpha Store PRO Author: Themes4WP Author URI: http://themes4wp.com/ Template: alpha-store-pro Version: 1.0.0 */ |
Now, we need to load the stylesheet of the parent theme. Create a file named functions.php in the child theme folder, edit it, and paste the following:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
<?php /** * Function describe for Alpha Store PRO child * * @package alpha-store-pro-child */ add_action( 'wp_enqueue_scripts', 'alpha_store_child_enqueue_styles', 999 ); function alpha_store_child_enqueue_styles() { $parent_style = 'alpha-store-parent-style'; wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' ); wp_enqueue_style( 'alpha-store-child-style', get_stylesheet_directory_uri() . '/style.css', array( $parent_style ) ); } |
Don’t forget save all changes.
If you’re creating a child theme for any other theme, then you would need to replace “Template: alpha-store-pro” above with the folder name of your theme example ” Template: maxstore-pro”.
Head back to Appearance > Themes, in your WordPress dashboard, and activate the new Child theme.