Anyone who is serious about their website wants to rank high in search engines. It’s the reason we publish a lot of SEO articles here on Torque.
To achieve this, two factors are most important: relevance and authority. You can demonstrate them to search engines by writing content for both users and search engines as well as getting your technical SEO up to snuff. Using the right keywords doesn’t hurt either.
For human visitors, the relevance of your content is especially important. That’s why in this article we want to talk about an underused way to increase it: Schema markup.
If that doesn’t ring a bell, you might recognize it as structured data or rich snippets. This is a specific group of tags that you can add to your site to more explicitly tell search engines and other entities what your content is about. Get picked up by Google and greatly improve how your pages are displayed inside SERPs.
In the following, we will talk about what Schema markup is, why it matters, and how to implement structured data on your WordPress website. Ready to learn how this microdata can improve your site’s SEO? Then let’s get started right away.
The Benefits Of Schema Markup For SEO
Alright, before talking about how to implement Schema markup in WordPress, let’s first talk about what it is and how it helps your site.
Structured Data Offers Additional Information
Schema.org is a project sponsored by some of the world’s biggest search engines: Google, Microsoft, Yahoo, and Yandex. They have agreed on a standardized set of data tags that help users provide additional information on their content. By adding them to your HTML, you can greatly improve the way your pages look in search results.
Facebook has similar a markup called Open Graph that, when added to your content, lets the social network know which image to use, the title of your content, what description to display etc.
Schema.org markup works the same way only for search engines. Chances are you have already seen it in action before. Ever seen ratings, recipes or events in search results like below?
These so-called rich snippets are created from Schema markup. They are meant to provide additional information for the content that pops up in your search results.
Why should you care about it? Well, let’s talk about it for a second.
Rich Snippets Help Your SEO
As mentioned in the beginning, rich snippets are a good investment into your SEO efforts. While they don’t actually boost organic search rankings, they do help with traffic generation by increasing click-through rates.
Makes sense, doesn’t it? Users get more important information such as how other people rate a recipe or product, which influences their decision to click on a search result.
Rich snippets are also a way of distinguishing yourself in the SERPs and gain more clicks without having to improve your ranking. At the same time, with more clicks, you might still move upward over time. That way, Schema markup can still help with organic traffic indirectly.
(Also, Google has hinted that in the future structured markup could become a ranking factor. For that reason, it might be a good idea to start using it now.)
What Types of Schema Markup Are Available?
There are loads of schema tags and you can see a full list on Schema.org. However, it is not necessary to know all of them since, for example, Google only supports a chosen few.
Here are a few examples of what types of Schema you can add to your web pages:
- Breadcrumbs — Show the position of the page inside the site hierarchy with a breadcrumb trail.
- Sitelinks Searchbox — Provide a search box underneath the search result to find additional information on your site directly from the SERPs.
- Sitename — Display your preferred website name in Google.
- Corporate Contacts — Add contact information directly to your page’s search snippet.
- Logos — When you add your official logo via schema, Google might use it in the search results and in Google Knowledge Graph (the field on the right that sometimes shows actor profiles etc.).
- Social Profile Links — Include social presences in Google.
- Articles — Mark important information such as title, images, publishing date, description, and more. Anyone using Yoast SEO should be familiar with this already.
- Courses — If you are offering courses on your site, you can list their title, author, and description.
- Music — Show artist, description, images, homepage links, and more. Google is also testing links for direct streaming.
- Recipes — Among others, you can add reviewer ratings, preparation times, and nutritional information.
- Reviews — Possibility to provide reviews and ratings for local businesses, books, and movies. Can contain publisher, language, author, and more.
- TV & Movies — Provide a description, trailer video, image, cast, director, duration, ratings, and more. Experimental feature: links for direct watching.
- Videos — Can be used to show a description, thumbnail, upload date, duration, view count, and other information.
- Local Businesses — Show opening hours, links to departments, possible actions (such as making a reservation), address and contact information, coordinates, and other info.
- Events — Show the type of event, venue, start date and door time, special offers etc.
- Products — Product price, availability, review ratings, brands, and more.
- Science Datasets — Provide data like average rain fall in an area or other statistics.
Quite a lot, huh? However, how does Google understand this information in the first place? Let’s have a look at that.
Structured Data Formats
Structured data can be added in several different formats. Before looking into how to implement them, let’s quickly talk about the different formats and give examples of what they look like.
Microdata
Microdata is directly embedded within existing HTML tags and can be added as <span> tags. You might have seen it before.
<div itemscope itemtype ="http://schema.org/Movie"> <h1 itemprop="name">Dances with Wolves</h1> <div itemprop="director" itemscope itemtype="http://schema.org/Person"> Director: <span itemprop="name">Kevin Costner</span> (born <span itemprop="birthDate">January 18, 1955</span>) </div> <span itemprop="genre">Drama</span> <a href="../movies/dances-with-wolves-theatrical-trailer.html" itemprop="trailer">Trailer</a> </div>
The tags inside the HTML let search engines know what the different objects mean so they can use it to create rich snippets for their SERPs.
JSON-LD
This method is JavaScript based and also Google’s recommended way of adding Schema markup to websites. Since the information for rich snippets is added as a script, it’s easier to read than HTML and thus more comfortable to debug. This format works for all Schema data except breadcrumbs.
<script type="application/ld+json"> { "@context:": "http://schema.org", "@type": "ScreeningEvent", "name": "Dances with Wolves", "location": { "@type": "MovieTheater", "name": "ACME Cinemas 10", "screenCount": 10 }, "workPresented": { "@type": "Movie", "name": "Dances with Wolves", "sameAs": "www.imdb.com/title/tt0099348/" }, "inLanguage": "en" } </script>
RDFa
RDFa is the format that Facebook’s Open Graph protocol is based on. It’s an HTML5 extension and looks similar to microdata.
<div vocab="http://schema.org/" typeof="http://schema.org/ScreeningEvent"> <h1 property="name">Dances with Wolves</h1> <p>Location: <div property="location" typeof="http://schema.org/MovieTheater"> <span property="name">ACME Cinemas 10</span> <span property="screenCount">10</span> </div></p> <div property="workPresented" typeof="http://schema.org/Movie"> <span property="name">Dances with Wolves</span> <link property="sameAs" href="www.imdb.com/title/tt0099348/"/> </div> <p>Language: <span property="inLanguage" content="en">English</span></p> </div>
Of the three above, the most commonly used are JSON-LD and microdata. For that reason, we will stick with these formats in our examples below.
How To Add Schema Markup To WordPress Manually
Of course, since we are talking about WordPress, there are already plugins out there that can automatically add structured data to your content.
However, before we get to those we first want to look at how to Schema markup manually. While it’s a little more complicated than the plugin route, it’s definitely useful in case a plugin can’t satisfy your needs.
We will show you different ways of doing this in both of the formats we mentioned above. Don’t worry if you don’t know how to write Schema markup (I don’t either). There are tools that can put it together for you such as Google’s Markup Helper and the JSON-LD Generator. Very helpful indeed!
Adding Schema Markup Using Microdata
As we said in the beginning, microdata is added inside the HTML. For that reason, if you want to implement it on your site, you will have to edit template files.
If you decide to go this route, be sure to use a child theme so as not to lose your changes to theme updates. For our example, we will use the Organization schema and take this code snippet as our basis:
<h2>Acme Organization</h2> <p>The Acme Organization has been run by the Acme family for generations.</p> <address> 667 Acme Road<br/> Neverland<br/> </address> Phone: <a href="tel:(0)12 34 56 789">(0)12 34 56 789</a>
This would typically be found in the footer of a website or inside a text widget in the sidebar.
To add Schema markup, as a first step, we have to wrap everything into an itemscope div element and give it an itemtype in order to define the entity. This lets search engines know that the content inside the div is an item and what kind of item it is.
After that, we can add the different item properties to span elements inside our div. We again do this via itemprop to define values like description and streetAddress.
Once done, our code snippet comes out looking like this:
<div itemscope itemtype="http://schema.org/Organization"> <h2><span itemprop="name">Acme Organization</span></h2> <p><span itemprop="description">The Acme Organization has been run by the Acme family for generations.</span></p> <address itemprop="address" itemscope itemtype="http://schema.org/PostalAddress"> <span itemprop="streetAddress">667 Acme Road</span> <span itemprop="addressRegion">Neverland</span> </address> Phone: <a href="tel:(0)12 34 56 789"><span itemprop="telephone">(0)12 34 56 789</span></a> </div>
That’s basically it. When this is added to your WordPress pages, Google and other search engines should now understand exactly what your content is about (we will learn how to check for errors further below).
However, you can see how it would be tedious to implement on different pages of your site, right? For that reason, the next option is probably the better one.
Implementing Structured Data Using JSON-LD
Overall, this format is a little easier to set up. First and foremost because you can do it in the WordPress backend via custom fields. No need to edit HTML files.
We will use the same example as above. As a first step, go to any page you want to add structured data to and activate the Custom Field option via the Screen Options at the top of the page.
From here, scroll down and pick Enter new to create a new custom field. Name it schemamarkup. If we want to add the following information as we did in the microdata example, in JSON-LD, it looks like this:
<script type="application/ld+json"> { "@context": "http://schema.org", "@type": "Organization", "address": { "@type": "PostalAddress", "addressRegion": "Neverland", "streetAddress": "667 Acme Road" }, "description": "The Acme Organization has been run by the Acme family for generations.", "name": "Acme Organization", "telephone": "(0)12 34 56 789" } </script>
Add the above code snippet under Value, click add custom field and then update the page. Good job. Now all you need to do is add a call to your header so that the custom fields are loaded on pages.
For that, open header.php of your (child) theme and add this before the closing </head> tag:
<?php $schemamarkup = get_post_meta(get_the_ID(), 'schemamarkup', true); if(!empty($schemamarkup)) { echo $schemamarkup; } ?>
This way, your schema code will be loaded together with your post meta data. Save the file, re-upload it to your server and you are good.
Not so hard, was it? The good news is that you can use these methods to implement any other schema you want.
How To Implement Multiple Schema Entities
Of course, you can also include several Schemas on the same page. For example, to add a video to the organization schema, you would just add a second code snippet below the first:
<script type="application/ld+json"> { "@context": "http://schema.org", "@type": "Organization", "address": { "@type": "PostalAddress", "addressRegion": "Neverland", "streetAddress": "667 Acme Road" }, "description": "The Acme Organization has been run by the Acme family for generations.", "name": "Acme Organization", "telephone": "(0)12 34 56 789" } </script> <script type="application/ld+json"> { "@context": "http://schema.org", "@type": "VideoObject", "name": "Learn About Our Work", "description": "See how Acme Organization is making Neverland a better place.", "thumbnailUrl": "http://www.mywebsite.com/thumbnail.jpg", "uploadDate": "2014-02-24T06:00:00+06:00", "contentUrl": "http://www.mywebsite.com/acme-profile.mpg" } </script>
Yes, it is that simple.
How To Test Schema Markup
After implementing your markup, all that’s left is testing it. For that, Google offers their own Structured Data Testing Tool. Just enter the URL to a page you want to check or directly paste your code. The tool will then show all the data it has been able to extract and also any errors it encountered.
The best part: you can update your code live and see the effects of your changes immediately. That way, you can easily copy and paste the corrected markup to your site.
In addition to that, Google Search Console (formerly known as Webmaster Tools) will also report any structured data it finds on your site plus any errors. That way you can test entire sites and not just single pages. So, if you haven’t signed up to Search Console yet, now is the time to do it.
How To Add Schema Markup Using A WordPress Plugin
The manual route is not the only way to add structured data to your site. Another option is to use a WordPress plugin.
Below, we have listed a number of options. When making a choice, be aware that not all plugins offer all types of schema. Make sure the one you are picking can do what you need.
All In One Schema.org Rich Snippets
The most popular plugin for adding Schema markup to WordPress websites. Easy to use and supports many types of Schemas:
- Review
- People
- Recipe
- Software application
- Articles
- Event
- Products
- Videos
Be aware, however, that this plugin can only set up one type of schema per page. If you need to set up more than that, you have to find another solution. It also doesn’t (yet) support the important Local business Schema.
WP SEO Structured Data Schema
This option is a solution to create JSON-LD structured data (Google favorite Schema markup format). It is easy to use, chock full of options and supports the following schema:
- Organization
- Local business
- Article
- Blog post
- Event
- Product
- Video
- Service
- Rating
WPSSO – Complete Meta Tags and Schema Markup for Social Sharing Optimization & SEO
The original purpose of this plugin is to provide rich snippets for social networks. However, it also comes with an extension for search engines and provides schema JSON-LD.
WPSSO can be used for the following schema:
- Image
- Video
- Organization
- Person
- Product and rating
- Recipe details
- Event information
The plugin will also override missing or incomplete Schema markup inside theme templates.
Rich Reviews
As the name suggests, our final contender can only be used to implement rich snippets for reviews. It also helps you gather feedback from visitors and display it on your site. From there, they can be picked up by search engines and used to spruce up your content’s display in the search results.
Schema Markup For WordPress In A Nutshell
Using schema markup and rich snippets are an excellent way to improve the click through rate of your web pages inside search results. The markup can make content more informative and useful by adding anything from breadcrumbs to product ratings.
Since all big search engines support this feature, it’s a great opportunity to improve your site’s SEO. It might look daunting at first but isn’t all that complicated to implement – even by hand. If manual implementation is not quite your cup of tea, you can also choose from a number of excellent plugins.
Either way, your users will thank you for making their life easier and hopefully start clicking through to your site more often.
Are you using Schema markup and rich snippets on your site? How did you implement it and what has been your experience? Let us know in the comment section below.
37 Comments