Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • Creating Parent Child theme in Wordpress

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 116
    Comment on it

    Hello readers, In this tutorial I will guide you to "Create Parent Child theme in Wordpress".

    The web that modifying a theme and even slightly prevents you from updating it to more recent version in the future, because in case you try to update, you lose your entire changes.

    So, Child styles solve this by allowing you to use all of the functionality of your selected theme by allowing you to bring updated parent theme without the apprehension of losing your alterations. Hence this is the reason why we create child theme.


    Child Themes Work

    Child themes are separate styles that rely on a parent theme for their functionality. If you are using child theme, WordPress will look at your child theme first to verify if a specific operation exists. If it doesn't found any specific function it will use the parent or guardian theme. This is great because it allows you to modify only what you need.


    Updating Parent Theme

    If you modify a theme without using a child theme you have two alternatives: One is you will not be able to update your theme in future, second do not create child theme and write your whole code into your parent theme but doing so you will lose custom theme code you've made to your parent theme before.

    It is important to update your theme because if you are not updating your theme their will be more chance that "your website can get hacked" because the lists contains out-of-date plugins which is a high cause for security issues. It is best to keep WordPress, your styles and plugins up to date.

    Creating A Child Theme

    Creating a child theme is very simple, you can copy and paste my example below.

    1. Create a child theme directory in your WordPress theme folder   

    Parent Theme Name = pinboard
    Child Theme Name = pinboard-child

     

    2. Create a stylesheet with information about your child theme

    @charset "utf-8";
    /*
    Theme Name: Pinboard Child
    Theme URI: http://evontech.com
    Description: Its a first theme Developed by Evon Tech.
    Version: 1.1.1
    Author: Nitish Rawat
    Template: pinboard
    Tags: blue, gray, silver, white, light, one-column, two-columns, left-sidebar, right-sidebar, fixed-layout, fluid-layout, responsive-layout, custom-background, custom-colors, custom-header, custom-menu, editor-style, featured-images, flexible-header, full-width-template, microformats, post-formats, sticky-post, theme-options, threaded-comments, translation-ready, photoblogging
    
    License: GNU General Public License v2.0
    License URI: license.txt
    */
    
    @import url("../pinboard/style.css");

    The two important code in the above lines are starting with “Theme Name" and “Template".

    3. Now your child theme will works fine. If you activate it and reload the page your entire content will be there but it will have no design information. I discussed before that WordPress first searches for functionality in the child theme and if it is not present it comes back on the parent or guardian theme.

    In our circumstance we do have a stylesheet, so in results it will not load the parent file's. To make sure it loads the parent file's stylesheet, we will need to enqueue it. This can be done in the theme's functions. php file, so go ahead and create that file now. In this file, copy-paste the following code:

    add_action( 'wp_enqueue_scripts', 'get_parent_styles' );
    function get_parent_styles() {
        wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );
    }

    Hope it helps you.

 0 Comment(s)

Sign In
                           OR                           
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: