Documentation > Advanced

How To Create a Child Theme

1277

What is a Child Theme?

A Child theme inherits the functionality of a theme. It’s like a mirror or a copy of a theme. Suppose you bought a theme and you want to make some slight modification, but you don’t want to make changes to the original file (it can get messy). For the sake of simplicity, you just want to add certain things on top of that. This is where the child themes come in, you make a theme that inherits all the functionality of your original theme (Parent Theme) without worrying about breaking or making a mess out of the original code.

More simply put:

Parent Theme  = Main Theme
Child Theme    = An extension of main theme

Why Should Use Child Theme / Benefits of Using Child Theme

  • Make changes without modifying or messing up original theme code. (saves a lot of future headaches)
  • If you update your parent theme, the changes you made to your themes will not be lost.
  • You can always turn off your child theme and fall back on the original

 

How To Create a Child Theme

    1. Create a folder and name it optimizer-child
    2. Create a style.css in this folder
    3. Open the style.css and fill out theme information like below

/*
Theme Name: Optimizer Child
Template: optimizer_pro
*/

Template is the directory name of the parent theme. In that case themes folder name is optimizer. It’s case sensitive, means if a parent theme directory named OptimizeR Template name should have been OptimizeR  instead of optimizer. If you are using Optimizer PRO theme, you should use optimizer_pro as the Template value. If you are using the free version of  Optimizer, you should use optimizer as your Template value.

    1. Create a functions.php and write below code to Import parent themes CSS.

<?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' );

}

  1. Zip the folder and Upload
  2. Activate the theme from Appearance -> Themes

If you are still not clear about the process, you can check out this video about how to create child theme.

 

Alternatively you can download the Child themes from below:

Optimizer PRO Child Theme  Optimizer Free Child Theme