• Skip to main content
  • Skip to forum navigation

StudioPress

  • Shop for Themes
  • My StudioPress

Forum navigation

  • Home
  • General Genesis Discussions
  • StudioPress Themes
  • Genesis Blocks
    • Genesis Blocks
    • Genesis Custom Blocks
  • Retired Themes
  • FAQs
  • Forum Rules
  • Internationalization and Translations
  • Forum Bugs and Suggestions
  • Forum Log In

Are You Using The WordPress Block Editor?

Genesis now offers plugins that help you build better sites faster with the WordPress block editor (Gutenberg). Try the feature-rich free versions of each plugin for yourself!

Genesis Blocks Genesis Custom Blocks

Updating Child Themes to HTML5

Welcome!

These forums are for general discussion on WordPress and Genesis. Official support for StudioPress themes is offered exclusively at My StudioPress. Responses in this forum are not guaranteed. Please note that this forum will require a new username, separate from the one used for My.StudioPress.

Log In
Register Lost Password

Community Forums › Forums › Archived Forums › General Discussion › Updating Child Themes to HTML5

This topic is: not resolved

Tagged: css converter, html5, XHTML

  • This topic has 4 replies, 5 voices, and was last updated 12 years, 9 months ago by dev.
Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • August 7, 2013 at 9:24 pm #54807
    IanP
    Participant

    Hi

    I'm frustrated bythe lack on information on what one should do now that Genesis 2.0 is released, and the implementation of HTML5 on existing Studiopress websites I have.

    Can someone point me to a guide / walkthrough that CLEARLY marks out the steps required to update a child theme (and parent if needed) to HTML5 compatibility.

    The guides out there that I have found so far are either:
    Written for coders
    Written poorly
    Don't include ALL the information

    http://www.studiopress.com/news/genesis-2-0-resources.htm <-- Not easy to follow, understand or implement.

    Thank you.

    August 7, 2013 at 9:43 pm #54817
    Robert Neu
    Member

    We plan to tackle this issue by writing guides for updating some of the older StudioPress themes on our blog at http://genesisupdate.com

    We haven't had a chance to publish anything yet because we've been updating sites all day, but we'll have something up by next week for sure! 🙂


    Co-Founder of Audit WP, a WordPress SEO audit service and Flagship, a new WordPress theme company launching soon!

    August 8, 2013 at 1:17 am #54829
    fssbob
    Member

    I'm sure there will soon be lots of great information like the guides that FAT Media (above) will be preparing. In the meantime, here's what worked for me on a site I just upgraded in case it's helpful.

    The site uses Outreach with some additions & modifications to widget areas (and, of course, lots of modifications to style.css).

    I updated Genesis and, like advertised, the site looked fine afterward.

    I then added "add_theme_support( 'html5' );" to my functions.php, after which, as expected, the site looked like a bomb had hit it.

    Then I ran style.css through the wonderful converter at http://cobaltapps.com/genesis-xhtml-to-html5-css-converter/, after which things looked much better. There was one problem remaining: some of my widget area divs had now become children of other widget area divs--with decidedly unpleasant results.

    At that point I looked through the Genesis 2.0 code. In widgetize.php I found defaults that indicated that when laying out widget areas using genesis_widget_area, one now needs to specify "aside"s instead of "divs". So in home.php I changed my "div"s to "aside"s--and my site was back to looking exactly as it had before the upgrade!

    Flying Seal Systems


    Bob
    Flying Seal Systems

    September 9, 2013 at 5:08 pm #61597
    askdesign
    Participant

    There are 2 resources that got me on the right track:
    (1) a chart comparing the old XHTML mark-up in Genesis vs. the new HTML5 markup
    http://my.studiopress.com/docs/genesis-markup-comparison/

    (2) the CSS converter that changes the code for you:

    Genesis XHTML To HTML5 CSS Converter

    The theme I use, Optimal, had been updated to HTML5. So, I used the converter tool to update my CSS customizations, which I add to the bottom of my child theme. There was also some tweaking to my functions.php file for importing Google fonts. The theme no longer uses the @import code; the functions file now does the job.

    It did take some time for me to restore the site to its previous styling using the new coding. The header and navigation areas, in particular, required some tweaking. Good luck!


    Anne S. Katzeff
    Designer | Artist | Teacher

    September 9, 2013 at 9:30 pm #61611
    dev
    Participant

    No one has made a convincing argument to me WHY anyone should want to update a current site to HTML5? Seems to me that it might be easier to just start fresh with a theme already configured.

    The only argument I can think of for updating is:

    Just how long with the Studio Press Genesis framework support legacy (non-HTML5) themes??

    Three months? Six months? A year? I hope they will at least commit to a year... but so far I've not seen any comment about this from the company... or I missed it!

    Dev
    http://www.NewMediaWebsiteDesign.com

  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)
  • The forum ‘General Discussion’ is closed to new topics and replies.

CTA

Ready to get started? Create a site or shop for themes.

Create a site with WP EngineShop for Themes

Footer

StudioPress

© 2026 WPEngine, Inc.

Products
  • Create a Site with WP Engine
  • Shop for Themes
  • Theme Features
  • Get Started
  • Showcase
Company
  • Brand Assets
  • Terms of Service
  • Accptable Usse Policy
  • Privacy Policy
  • Refund Policy
  • Contact Us
Community
  • Find Developers
  • Forums
  • Facebook Group
  • #GenesisWP
  • Showcase
Resources
  • StudioPress Blog
  • Help & Documentation
  • FAQs
  • Code Snippets
  • Affiliates
Connect
  • StudioPress Live
  • StudioPress FM
  • Facebook
  • Twitter
  • Dribbble