Wednesday, November 5, 2014

Child Themes

A child theme is a theme that inherits the functionality of another theme, called the parent theme. Child themes allow you to modify, or add to the functionality of that parent theme. A child theme is the best, safest, and easiest way to modify an existing theme, whether you want to make a few tiny changes or extensive changes. Instead of modifying the theme files directly, you can create a child theme and override within.

Directly editing files in the parent theme will reset to default when you update your theme in future. But if you use a Child Theme then you can retain your changes even after update your theme (which might be important for security or functionality). It also can speed up development time.


How to create a Child theme

1. You need to create a new folder under your theme folder placed at .../wp-content/themes.
2. Rename the New Folder you have created to yourthemename-child.
3.Then open the folder and add a file with .css extension (CSS file) there with these contents in between that:
/* Theme Name: YourThemeName Child Theme URI: http://example.com/yourthemename-child/ Description: Your Theme Name Child Theme Author: Your name Author URI: http://example.com Template: yourthemename Version: 1.0.0 Text Domain: youtthemename-child */ /* =Theme customization starts here -------------------------------------------------------------- */
Here you can replace the your theme name with the name of your theme. The only required lines are the Theme Name, the Template. But you can add others also for better understanding. 

If you want to create a child theme without the name of the parent theme say ABC. then you need to use the template in the above comments as abc.

You can also add other files there which you want to customize. The process is to copy the original file from the parent theme to the Child and then make customizations there in the Child Theme so that the code in the parent theme gets untouched. 

@import should not be used to import the parent stylesheet into the child theme. The correct method is to use wp_enqueue_style() to enqueue the parent stylesheet, using this code in your child theme's "functions.php". You will need to create a functions.php in your child theme's root folder (This is the only two files needed to create a child theme). Right at the start, on the first line, you should add an opening php tag. All other code will follow after this opening php tag


<?php add_action( 'wp_enqueue_scripts', 'enqueue_child_theme_styles', PHP_INT_MAX); function enqueue_child_theme_styles() { wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' ); wp_enqueue_style( 'child-style', get_stylesheet_uri(), array('parent-style') ); }

You can activate the Child Theme in your Dashboard by going to Appearance > Themes > Yourthemenamechild  >Activate.

If you need more information regarding that, then please visit: Codex