Guide to Update Existing genesis Child themes With Html5 features

After Genesis framework 2.0 and 2.0.1+ back to back Update , It comes With Several new features and updates, Genesis framework update via  admin directly,  But There is no direct update genesis child themes. They Introduce new Child themes which Updated But not existing child theme update Directly But the major advantages of using Genesis framework and Child theme is that you can update your old version child theme with new feature manually.

What’s New Genesis 2.0+ Update Features?

  • Completely Mobile Responsive
  • HTML5 Markup
  • Update Security
  • Inline HTML Comment and many more minor but effective updates.

How To Update Existing Genesis Child Theme?

It’s Very Easy to Update Your Existing Child Theme With new Features, Simply just follow four steps

 Note: Before Follow This Steps and Copy/paste any code from this site as Description. Must Backup your Website’s functions.php and style.css file 
  1. Enable HTML5 Markup
  2. Copy Existing CSS
  3. Convert Existing Child Theme XHTML to HTML5 CSS
  4. Replace Existing CSS to New Converted CSS

1.Enable HTML5 Markup Into Existing Genesis Child Themes

It’s very easy to Enable Html5 in Genesis theme,

Copy Below Code and Paste Into your functions.php file

[Note: This Php Code is Copy From Studiopress Snippet Code repository ]

Enable html5 Markup in Genesis Child theme Image

Now, After Successful paste HTML5 code,

2. Copy Genesis Child Themes CSS

Select below Stylesheet (style.css) and Copy your Whole CSS Codes.

Update Genesis Child Theme Image

 3 Convert Existing Genesis Child Themes Xhtml to html5 css

Now we have to convert Genesis Child themes XHTML file to HTML5 CSS, So Your template can support html5 functions, For this convert I use Cobalt XHTML to HTML5 CSS Converter tool which is specially made for genesis.

Go Cobalt Converter, and scroll down at the end of page you will see tool box with two buttons,  paste whole css which we copy existing template css.

Now Press Convert CSS Button You will see popup with message your css convert successfully press o.k and select Whole converted CSS code from tool box.

Xhtml to Html Css Convertor Image

4. Replace Existing CSS To New CSS

Now Again go your WordPress Dashboard and Appearance –> Editor.

Choose Stylesheet and first delete existing css and then paste converted CSS and update CSS.

Genesis Child theme Css Update Image

Test Your Genesis theme

Finally, Your Theme Updated and Html5 Markups are enable. enjoy!

I hope this guide will help you to update your Genesis Child Themes, If you have any questions feel free to comment 🙂


Subscribe and Get Free Daily Wordpress Tips and Tutorial Free!

About Mitul Shah

I just love to working with WordPress and i like to share my knowledge to all over world using this website hope my articles as help to build your blog powerful.


  1. Thanks for this tutorial. I have just upgraded a Genesis child theme.

  2. Hello Mitul. Thanks for this guide, it was just what I was looking for. I just have one question. Don’t I need to upgrade the Genesis theme to 2.0 before I can do this to the child theme? Also for some reason I don’t have any update inside my dashboard telling me to upgrade to newest version of Genesis. Thanks for your help.

    • Hey james You must have to update Genesis Framework theme first then you have to update Child theme Without Update theme HTML5 not support may be your theme messed up.

Tell us what you're thinking...

All comments are moderated.

* Denotes required field.


Notify via Email Only if someone replies to My Comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.