Custom microdata with Genesis 2.0

If you attended the recent Genesis Round Table - Genesis 2.0: A Conversation, you may have discovered how microdata may help search engines better categorize your content.

After the discussion was over, I decided to check out the microdata documentation at schema.org.  This lead me to investigate how the Genesis 2.0 framework implements microdata and how can I set my own schema.

I am not going to get into the specifics and theory of using microdata, as this is still a learning process for myself.  However, I recommend looking over the documentation and decide if the subject of your posts or custom post type will fit into a specific schema.

The Genesis Framework and microdata

If you have html5 enabled in Genesis 2.0, default microdata will be implemented by the framework.  The semantic html5 elements will have microdata attributes created by the default filters.  No extra work needed.

With 2.0, developers will have access to attribute filters.  These filters are applied within the genesis_attr() function based on the context parameter.  By using genesis_markup() in your plugins or themes, you could automatically add microdata by setting the appropriate context argument or specify your own context and custom attribute filter.

If you are interested in the new filters the markup source code is found within genesis/lib/functions/markup.php.

Specify your own microdata schema

While looking over the microdata schema documentation, the AboutPage and ContactPage schema caught my interest.  This specifies the about and contact pages for a website through microdata schema, so I decided to add this schema for my About and Services page.

With the ‘genesis_attr_body’ filter, the default schema can be changed to the AboutPage or ContactPage schema depending on the current page.

A quick note on schemas

The default itemtype of a page is WebPage.  Microdata schemas are hierarchical and inherit properties from the parent schema.  Because of inheritance, some microdata schemas will share properties with each other.  Remember to set the correct properties when switching from the default page or post schema.

Discover your microdata schema

This is just a simple example.  The microdata schemas cover many subjects.  With the new attributes filters in Genesis, this will let developers easily specify the a microdata schema based on the current context of the website.

Comments

  1. says

    Great intro, Ryan. My curiosity for schema/microdata was piqued during the 2.0 conversation, but I hadn’t had a chance to follow up much. You’ve given me a place to start within Genesis – thanks!

    • says

      Carrie,

      Glad you liked it. The new markup functions in Genesis 2.0 are pretty cool. I cannot wait to see what other ideas people generate.

  2. says

    Thanks for watching the Hangout.

    I think this topic is the most exciting part of the upcoming release of Genesis 2.0. Having HTML5 support is awesome, but the microdata is such a level beyond what was expected.

    I know that Yoast has written a good post about the microdata and its SEO value. And the fact that Brian and team included it in the update is exciting.

  3. Brad Dalton says

    Very useful and great timing Ryan.

    I know after watching the video that SP plan on releasing child themes which include specific schema for different niche themes.

    I have added your code to my own site but used the page i.d rather than page name and used the contact page i.d for ContactPage schema rather than services page.

    Not sure what to use for the services page but did see CreativeWork already included by default in Genesis. http://schema.org/docs/full.html

    • says

      Brad,

      I tend to get a little confused too.

      Genesis, by default, will attribute the body element as a http://schema.org/WebPage, which inherits from CreativeWork. You could probably leave it as WebPage and maybe find a business schema for services within the page?

      It’s hard to say. There is not a lot of documentation for whole page mark-up with microdata.

  4. Steve Horn says

    Thank you Ryan for sharing your work. This will be very helpful for targeting specific pages and bringing them into the Schema.Org fold. As huge and overwhelming as that is, this is a clear step in the right direction.

  5. says

    Schema Microdata is a fantastic tool, and I’ve found to work in the Search Engines for well over a year. The challenge has been writing schema in XHTML, specifically in WordPress. Many resources said that Schema would not work, but I found that to be incorrect, however extremely challenging.

    Schema is not new to the coding world, as I’ve found out over the last year and a half, and I’ve been able to get results from Google and other search engines, even though they said it wouldn’t work.

    Schema is extremely flexible, even allowing you to create your own libraries, and you aren’t limited to to a specific itemscope on a page. In fact, you don’t have to write Schema exactly like the examples provided.

    If you nest your Schema outside the examples, you’re likely to get a message that Google doesn’t recognize your code. If that happens, don’t be as concerned about it as I was.

    I spent 17 hours straight working on a schema layout as it made sense for my particular niche application. Upon completion, I tested on Google which did not recognize my code. I was beat, so I went to bed and when I got up, I tested again, and discovered that Google recognized and accepted my code as valid. That was eye opening because what I wrote didn’t agree with either Schema.org or Google, but was properly formatted for the application. I ended up with great results, and that was almost a year ago.

    It’s a challenge to understand, especially with so many different ways to implement, and theories on how it works. The key is you have to test and experiment, and you’ll find a really great tool.

Trackbacks

Leave a Reply

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

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>