How to Add Microdata to Posts in WordPress

Microdata makes it possible for search engines to understand important details about your site’s content.

Microdata provides Google and Bing with extra information about your content such as names, descriptions, dates and ratings. And, because search engines can understand your data more clearly, they often reward you with a higher ranking.

Some themes provide microdata support, but many do not. In this tutorial, I’m going to show you how to add microdata to your WordPress theme.

Step #1. Check if your theme uses microdata

First, let’s check to see if your theme is using microdata.

• Go to this URL.
• Paste in the URL of one of your site’s posts.
• Click the “Fetch Validate” button.

This image shows a theme that uses metadata correctly:

If you see an image like the one below, your theme is using metadata, but has errors. Check with your theme provider for a fix.

If you don’t see any results like these, your theme doesn’t use metadata. Keep reading this tutorial to know how to add it.

Step #2. Set schema

We’re going to use the schema for articles from http://schema.org/Article. There are other options for product, review, book, etc. depending on your site.

The way to add microdata to WordPress is by using a child theme. The child theme allows you to keep the customisations safe in case the original is updated in future.

Copy the necessary files from the parent into the child theme. The specific files you need depends on the theme. Every theme developer organize the files in different ways.

You can copy the files manually or by using the Child Theme Configurator plugin:

• Tools > Child Themes > Files.
• Select the files that render the single post.
• Copy Selected to Child Theme.

• In the duplicated file, look for the div that works as the container for the post.
• Add itemscope itemtype=”http://schema.org/Article” into the div, like this:

<div id="post-container" itemscope itemtype="http://schema.org/Article">
…
</div>

Step #3. Add article markup properties

Look carefully inside the child theme files to see where to add support for each property. For example, we’re going to add itemprop=”name” to the post title and we’re going to add itemprop=”datePublished” to the publication date.

name

<h2 itemprop="name">Post title</h2>

url

<a href="/post/url/" itemprop="url">Post title</a>

genre

<span itemprop="genre">Category title</span>

or:

<a href="/link/to/post/" itemprop="genre">Category title</a>

datePublished

<time datetime="2015-08-06T00:26:57-05:00" itemprop="datePublished">06 August 2015</time>

articleBody

<div itemprop="articleBody">Post full text.</div>

author

<span itemprop="author" itemscope itemtype="http://schema.org/Person">
<span itemprop="name">Author name</span>
</span>

headline

<h2 itemprop="headline">Post headline</h2>

image

<img itemprop="image" src="path/to/image.jpg" alt=""/>

Note: wrapping elements such as the category or date may require adding a span tag with the “itemprop” attribute.

For example:

<span itemprop="genre"><?php the_category(', '); ?></span>

Step #4. Test the end result

Go back to Step #1 and test your site again. Hopefully Google’s test now shows that your microdata is working correctly.