By: Prem Tiwari | Last Updated: | In: WordPress, WordPress Themes
In this tutorials i will share How to create child theme in wordpress step by step, which will help you to more customization of your current wordpress theme.
Why use a Child Theme, There are lots of reason to create child theme, here i have describe few of them. If you edited a theme and may be it will updated after some time, then all your changes will be lost. But by using child theme your changes will not lost. Second thing is you can speed up your development time by using child theme and also it is recommended by wordpress standard.
Below is the step to create a child theme of your existing wordpress theme. There are at least two files are required to create a child theme i.e style.css and functions.php files.
The next step is define child theme descriptions in style.css. Add below code at the top of the style.css file. You can replace the header information as per your requirement.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 | /* Theme Name: Twenty Seventeen Child Theme URI: https://www.freewebmentor.com/2016/12/say-hello-twenty-seventeen-wordpress-theme.html Description: Twenty Seventeen Child theme Author: Prem Tiwari Author URI: https://freewebmentor.com Template: twentyseventeen Version: 1.0.0 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Tags: light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready Text Domain: twenty-seventeen-child */ |
After that add below code in your functions.php file. Alway avoid to call the parent theme stylesheet using @import in your style.css file, because it will load style.css file every time. The best way to call your parent stylesheet file by using a wp_enqueue_scripts action and use wp_enqueue_style() in your child theme’s functions.php file.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 | <?php function my_theme_enqueue_styles() { $parent_style = 'parent-style'; // This is 'twentyseventeen-style' for the Twenty seventeen theme. wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' ); wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/style.css', array( $parent_style ), wp_get_theme()->get('Version') ); } add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' ); ?> |
After done all above changes, login in admin dashboard and click on Appearance => Themes. Select Twenty seventeen theme and click on activate button.
Please make sure to re-save your menu (Appearance > Menus, or Appearance > Customize > Menus) and also change the background & header images after activating the twenty seventeen child theme.
Prem Tiwari is the founder of FreeWebMentor.com and also a professional developer who has vast experience in PHP and open source technologies. Apart from this, he is a blogger by hobby and also he has been a regular speaker of WordPress sessions in various IT Companies. View all posts by Prem Tiwari
child theme, child theme wordpress, how to create child theme, responsive child theme, responsive child theme wordpress, wordpress child theme, wordpress responsive child theme
