Video Tutorial: Creating a child theme in WordPress

WordPress GrapheneI have made another video tutorial, this time giving step-by-step instructions on how to create, and use, a child theme with wordpress. This video explains the technique using the Graphene theme version 1.5.2. Please get in the practice of using a child theme TODAY, as it will save you tons of time when a new version of your theme, or WordPress, rolls out.

In this video, I will show you how to:

  • Create your files
  • Upload them to your server
  • Activate your child theme
  • Make modifications to your css

There are many advantages when using a child theme with your graphene theme. Changes made are kept when installing an update. This means that you don’t have to remember all the custom changes you made when a new update rolls out, and replaces the parent themes style and functions files.

If you haven’t already, I highly recommend you creating a child theme immediately. Especially if you are making modifications to your Graphene core files.

Enjoy, and please comment. (you don’t even have to log in… shhhhhhh)

20 thoughts on “Video Tutorial: Creating a child theme in WordPress

  • Pingback: Help! My footer is now in my sidebar? « Graphene Theme Forum

  • Pingback: How can I translate buttom "continue reading" on russian? « Graphene Theme Forum

  • Pingback: update changed me from two columns to one « Graphene Theme Forum

  • Pingback: View more button missing « Graphene Theme Forum

  • Pingback: Updating Theme « Graphene Theme Forum

  • Pingback: Blog Post Title Customization « Graphene Theme Forum

  • Pingback: Comments on Landing Page « Graphene Theme Forum

  • Pingback: Border around images and titles in posts? « Graphene Theme Forum

  • Pingback: graphene update question « Graphene Theme Forum

  • Pingback: Video Tutorial for creating a Child Theme « Graphene Theme Forum

  • April 9, 2012 at 3:46 pm

    Hey Josh, great tutorial. I’ve got a question for you regarding action hook widget placement and spacing. I’m trying to edit the style.css like you showed on the above video, but I don’t think I have it correct. What I did was added a widget to the top bar area where the twitter and facebook icons are. I just added a text widget, but I can’t seem to get the padding or margins right. It only wants to put it at the very top of the page. I finally moved it using the the editor in my browser, then I copied and pasted the code into my style.css of my child theme, but nothing happened. The code I pasted was this {
    padding-top: 17px;
    font: normal 20px Arial;
    This worked in the browser window as I did it on the fly, but once copied into the css it didn’t work. Any ideas?
    Thanks a bunch for this great blog. It has really helped me fine tune my site!

    • April 9, 2012 at 4:06 pm

      Hi Sy,

      Well, the css you are using above is inline css, rather than stylesheet css. What this means is you are defining the styles inline for that element you are wanting to adjust.

      So, let’s say the element you want to adjust is a div tag. You are probably using something like <div style=”padding-top:17px;”>

      Instead, give the div a class in your editor. Something like <div class=”my_header_image”>

      Then in your child theme stylesheet, insert this:
      .my_header_image {

      The class from your div will match the name in your stylesheet.

      • April 20, 2012 at 2:32 pm

        Worked like a charm! Thanks, Josh. If you ever venture up to Newport, I’ll buy you a beer.

  • January 24, 2012 at 6:45 am

    TY JOSH! Your tutorial really helped. I do so much better with visual aides. As a extremely new coder and site builder, I have been avoiding any work in my site. With the wonderful find of Graphene and your thoughtful aides, I am moving right along!


    • January 24, 2012 at 3:56 pm

      Thank you, Wendy. I certainly appreciate the kind words. Also, please feel free to use my contact form anytime you feel you need some pointers, advice, or whatever else!

      Good luck to you in your new endeavor!!

  • January 1, 2012 at 10:04 pm

    I am new to WordPress and have been working on my site for a while with more questions than answers–it has been an interesting adventure. Thanks for your tutorials–they will be really helpful since I have been making changes in the parent and will need to do a lot of work to upgrade to the new version. Now I understand how to get “stuff” into those “nooks and crannys” (and keep the changes going). I now have the info to create that child.

    Thanks again and Happy New Year.


    • January 2, 2012 at 12:16 am

      Thanks Nancy.

      Please feel free to contact me anytime if you need an explanation or just some advice on something. And you know… it’s just like the old saying goes… “The more you learn; the more you realize you don’t know”.

      I’ll be adding a few new videos tonight (mostly regarding my plugin); but follow my twitter or facebook if you would like to be notified of future video posts.


  • December 17, 2011 at 12:56 pm

    Great movie clips and lots of stuff to learn. Thanks for your time an effort to put this together. Helped me a lot in working on my WP sites.

    Keep up the good work and enjoy the upcoming christmas.

    Cheers Dieter

  • October 18, 2011 at 5:36 pm


    Thanks for the tutorial. When I follow your steps and activate the child theme in wordpress, the wordrpess dashboard dissapears and I have to delete the child theme folder from the ftp site before I can log back in to my wordpress account. When i type in my url in a webbrowser all i get is a blank screen.

    Hope you have some advice. Sorry, I am a bit of a novice.

    • October 18, 2011 at 11:57 pm

      Hi Tani,

      One mistake I made when creating this video is the functions.php file. It should look like this:

      < ?php ?>

      Try fixing that and see if your problem persists.


Leave a Reply

Your email address will not be published. Required fields are marked *