Shiba

Adventures in WordPress

  • — Home —
  • Dog
  • Art
  • Contact
  • WordPress Articles
    • WP Plugins
    • WP Programming
    • WP Admin Panels
    • WP Theme Design
    • WP How-To
    • WP Theme Images
You are here: Home / WordPress Design / Customize Your WordPress Blog with Child Themes

Customize Your WordPress Blog with Child Themes

Tweet

by ShibaShake Leave a Comment

What are WordPress child themes?

Child themes are a simple way for you to modify WordPress themes, and keep track of all your changes. With child themes you can make all of the same modifications as you would to the parent theme, but you do all of this in a separate child theme area. This allows you to update the parent theme whenever you want and still keep all of the modifications you have made in your child theme area.

There are several different levels of modifications you can make to a child theme. If you are careful with how you make your child theme modifications, you will be able to update the parent theme, and have all your theme modifications automatically transfer to the updated theme with very little effort from you.

Here we discuss how to create child themes. Once you create a child theme, you can easily –

  1. Create child theme static design styles.
  2. Create child theme dynamic design styles.

Create a Child Theme

To create a WordPress child theme all you need to do is create a new directory for your child theme in your blog wp-content/themes directory. Name the directory based on your child theme name, as well as the parent theme name so that you can easily keep track of all your WordPress themes.

For example, one of my blog child themes is called dogs-child-shiba. Dogs is the name of my child theme, child indicates that it is a child theme, and shiba is the name of the parent WordPress theme. This allows me to easily identify all of my child themes, and to quickly see what their parent themes are.

After creating a new child theme directory, create a style.css file within it, and enter the code below into your new style.css file.

/*
Theme Name: dogs-shiba-child
Theme URI: http://www.shibashake.com/wordpress-theme
Description: Child theme for Shiba.
Author: ShibaShake
Author URI: http://www.shibashake.com

Template: shiba
Version: 1.0
Tags: child theme
*/

@import url("../shiba/style.css");

The code above gives you an example child theme definition for the Shiba parent theme. To create your own child theme you want to replace each of the elements with your own child theme information.

Line 2 – Replace with the name of your child theme. (required)

Line 3 – Replace with the name of your blog homepage. (optional)

Line 4 – Replace with a description of your child theme. (optional)

Line 5 – Replace with your name. (optional)

Line 6 – Replace with your website. (optional)

Line 8 – Replace with the directory name of the parent template you are using. (required)

Line 9 – Replace with your child theme version number. You can increase your version number as you make new changes to your child theme.

Line 10 – Tags you want to associated with your child theme. This is important if you want to distribute your child theme for public use. Otherwise, you can use it to help yourself keep track of the features added to your child theme, e.g. widget ready, light, blue.

Line 13 – Includes the parent theme styles into your blog. Replace the parent theme directory name with the parent theme you are using. For example, if you are using the WordPress Classic theme as your parent theme, replace the statement with

@import url("../classic/style.css");

We use the directory name classic here because the WordPress Classic theme is located in the classic directory of your WordPress blog. If you go to Appearance >> Themes in your WordPress blog dashboard, you should be able the see the directory name for all your installed themes.

For example, if you look at the WordPress Classic theme, it should contain the following information –

All of this theme’s files are located in

/themes/classic

This means that the theme directory is called classic. Each theme will have a different theme directory. The WordPress Default theme, for example, is located in the

default

theme directory, and my Shiba WordPress theme is located in the

shiba

theme directory.

Screen-shot of your blog themes and their theme directories.

You’re Done!

And there you have it – your very own child theme. You can apply child themes the same way you apply regular themes on WordPress. Just go to Appearance >> Themes and click on the Activate link right below your child theme.

Once you have a child theme, you can start adding new design styles to your blog or override existing styles that may not suit you. You can also create dynamic styles.

Related Articles

WordPress Child Themes

Child WordPress themes are a simple way for you to make modifications to any existing WordPress theme. The main advantage of child themes is that it allows you to update the parent theme as often as you want, and still keep all of your theme modifications intact. With child themes, you make all your modifications in a separate area than the parent theme area. These modifications then get automatically transferred to new versions of the parent theme with little or no effort from you. In this way, [...]

Use WordPress Child Themes to Create Dynamic Styles

How to add dynamic CSS styles into your blog by using a child theme.

Use WordPress Child Themes to Create Static Styles

How to add static CSS styles into your blog by using a child theme.

Leave a Reply Cancel reply

Your email address will not be published.

Recent Posts

  • Screen-shot of mobile responsive Poll Daddy object, where text floats properly to the right of radio buttons.How to Make Poll Daddy Objects Mobile Responsive
  • Screen-shot of blog post with no page border (flowing design).Genesis Skins 1.5
  • Screen-shot of the media manager Create-Gallery screen, while doing a post search.Shiba Media Library 3.7
  • Screenshot of the Edit Gallery screen after we hit the Create Gallery button.How to Expand the WordPress Media Manager Interface
  • Blonde girl looking through and holding a circular picture frame.Shiba Gallery 4.3
  • Close-up of beautiful blonde holding a square picture frame.Google Authorship - Good or Bad for Search Traffic?
  • Shiba Widgets 2.0
  • Media Temple screenshot of editing my sub-domain DNS entry.Using CDN Cnames with w3tc and MultiSite
  • Shiba Skins WordPress ThemeShiba Skins WordPress Theme
  • How to add the Media Manager Menu to the Theme Preview InterfaceHow to Add the Media Manager Menu to the Theme Preview Interface

Recent Comments

  • WordPress Search Widget – How to Style It (56)
    • Nelson
      - Tanks master - Fine
    • TelFiRE
      - How do you style the "X" that shows up when you start typing?
  • Update custom inputs with the proper data using Javascript.Expand the WordPress Quick Edit Menu (58)
    • Mike G
      - This is exactly what is happening to me. It is updating the value in the database and in the column, but I have to refresh ...
    • PhoenixJP
      - Thanks for this tutorial. Does someone knows if this still work with wordpress 5.03 and 5.1.
    • Francine Carrel
      - This is a very long time away from your original comment, but did you ever work it out? I am stuck on the exact same thing ...
  • Custom meta-box with a set of radio-buttons.Add a Metabox to Your Custom Post Type Screen (27)
    • mike
      - Hi Shiba am a newbie to wordpress, I just installed a plugin with a custom post type, but has no option for discussion and ...
  • Write a Plugin for WordPress Multi-Site (45)
    • Andrew
      - Hi,action 'wpmu_new_blog' has been deprecated. Use ‘wp_insert_site’ instead.
  • Populate our Edit Gallery menu using a gallery shortcode.How to Add the WordPress 3.5 Media Manager Interface – Part 2 (29)
    • Janine
      - Still relevant in 2019.
  • WordPress Excerpt – How to Style It (36)
    • James
      - Great post. I really need some help. I have set border lines around my excerpts on my blog page/post page. The problem is ...
  • Add Custom Taxonomy Tags to Your WordPress Permalinks (123)
    • Darshan Saroya
      - Update permalinks. Go to settings > permalink and just save it.

Copyright © 2021 · Genesis Skins by ShibaShake · Terms of Service · Privacy Policy ·