Search engines like Google, Bing, Yahoo, and Yandex want to be in the know. They want to know what your content means, not just what it says. As a result, Google, Microsoft, and Yahoo came together in June, 2011 to announce a collaboration to create and support a standard set of schemas for structured data markup on web pages. The site they developed is Schema.org.
Schema markup is one of the latest evolutions in Search Engine Optimization (SEO). Schema markup is a vocabulary—a semantic vocabulary. It is code that you put on your website to help search engines return more illuminating results for users. These vocabularies represent entities, and the relationships between entities and actions. Schema markup can easily be extended through a well-documented extension model.
Why Good Schema Markup is Important
Websites that use schema markup rank better on Search Engine Results Pages (SERPs) than sites without markup. One study published by Searchmetrics determined that websites with markup rank an average of four positions higher in the SERPs than those without schema markup. This evidence may turn out to be anecdotal though and these results should be treated with caution. While there is apparently some correlation, it is not entirely clear that this higher result is due to the markup alone. However, if I can rank my sites four positions higher than my competitors by having proper schema markup, I'll take that any day of the week.
WordPress and Schema.org
There's no doubt that WordPress is the world's most popular web platform. Unfortunately for the millions of WordPress powered websites, it does not directly support schema markup. However, WordPress can be extended to include schema markup through plugins, or themes, or popular theme frameworks such as the Genesis Framework.
Genesis and Schema.org
Just as WordPress is the world's #1 web platform, the Genesis Framework is the #1 professional web developers' tool for building custom themes. There's good reason for its wide spread support. It's code is progressive, tight, and fast executing. It generates the latest standards of schema markup, and as of the Version 2.2.2 release, is fully Section 508, WCAG 2.0, and A11Y compliant. This means your content, when processed through the Genesis Framework, is accessible to a wider range of people with disabilities, including blindness and low vision, deafness and hearing loss, learning disabilities, cognitive limitations, limited movement, speech disabilities, photosensitivity and combinations of these.
So What Problem Are We Trying To Solve?
While Genesis is superior in every way when it comes to adding schema markup to your content, there is one thing it doesn't do. It might be best to let Genesis lead developer Nathan Rice explain:
Images that are inserted into the content of a post will need to have that property [itemprop=“image”] added manually. Genesis doesn’t generate the markup for anything in the post content, so that bit is up to you.
With that being said, if you are using the Genesis Framework on your site, you have three options.
- You can edit all of your posts and pages to manually add the schema markup to every one of your image tags.
- You can update the wp_posts table directly with SQL to add the schema markup to your content's image tags
- You can add the little snippet of code below to your theme's functions.php file and not worry about it again
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
/** * Add itemprop image markup to img tags * @author Victor M. Font Jr. * @link //victorfont.com/ */ add_filter('the_content', 'vmf_add_itemprop_image_markup', 2); function vmf_add_itemprop_image_markup($content) { //Replace the instance with the itemprop image markup. $string = '<img'; $replace = '<img itemprop="image"'; $content = str_replace( $string, $replace, $content ); return $content; } |
stunomatic
May 18, 2017 at 4:23 amHi,
I create the content box using ACF. Now I am confused how I can do the same on ACF content editor.
Victor M. Font Jr.
May 18, 2017 at 8:22 amThis article has nothing to do with creating content boxes or using ACF. the_content referenced in this article is a WordPress filter.
Alexander Bock
February 14, 2016 at 5:34 amHow to add itemprop=“image” to featured image on archive/category and on widgets?
Is it possible to modify your code?
Victor M. Font Jr.
February 14, 2016 at 6:33 amThank you for asking Alexander,
I am using the Genesis Framework and itemprop=”image” already appears on archive pages. As for widgets, the following will work for the text of the WordPress Text widget. It may also apply to some third party widgets as well. Please see this filter reference: https://codex.wordpress.org/Plugin_API/Filter_Reference#Widgets
Berrada
January 24, 2016 at 10:21 amThank you a lot for this solution +1
Shalin TJ
January 2, 2016 at 10:17 amThanks for that awesome post Victor. That was quite of a help.. For the article schema, I’m getting the following 3 other errors too:
image: missing and required (this I can fix with your code now)
publisher: missing and required
dateModified: missing and recommended
mainEntityOfPage: missing and recommended
https://developers.google.com/structured-data/testing-tool?url=https%253A%252F%252Fwww.blogmehow.com%252Fnew-blog-journey-to-10000-a-month-639
How do I fix them?
Shalin
Victor M. Font Jr.
January 7, 2016 at 7:31 amHi Shalin,
This has been fixed in the Genesis 2.2.6 release. Please see these links:
http://www.studiopress.com/releases/genesis-2-2-6.htm
https://gist.github.com/nathanrice/b90388e6b8052bf60583
Jane Sherratt
December 8, 2015 at 11:25 amThank you for this. Agree with Todd don’t know why this isn’t in the framework but your few lines of code did the job for me. Good stuff!
Cathy Tibbles
October 19, 2015 at 5:09 pmon thevacationgals.com, I need to do this very thing. But the new html5 markup is using a genesis_entry_content hook – is it using WordPress the_content hook? I switched the hooks just to see – but nothing…
https://developers.google.com/structured-data/testing-tool?url=http%253A%252F%252Fthevacationgals.com%252Fthings-to-do-outdoors-in-vancouver%252F
Victor M. Font Jr.
October 19, 2015 at 6:04 pmThis uses the WordPress “the_content” hook so it works for any theme. The genesis_entry_content_hook simply calls the WordPress the_content hook. I haven’t seen a theme this doesn’t work with yet. What I have seen is that if you are using memcache such as might be activated on Site Ground, the cache needs to be cleared. I would clear any and all caches.
Todd Lohenry
October 16, 2015 at 9:37 amCould you please comment on the forum? It appears the fix caused more problems than it created or perhaps it was another plugin I added: http://www.studiopress.com/forums/topic/schema-image-error-with-enterprise-pro/
Victor M. Font Jr.
October 17, 2015 at 5:22 amTodd,
I checked your home page and the sample post you linked to in the Studio Press forum with the Google Structured Data testing tool. Neither page is producing errors. In fact, everything thing is good on both pages. Please post a link to a page with which you are having trouble and I’m very happy to help you resolve it.
Todd Lohenry
October 14, 2015 at 3:31 pmThank you for the excellent information, Victor. Curious that Genesis would not include this in the framework but I appreciate that you did the work for them…