How to Add Schema Markup to WordPress

The way your pages show up in Search Engine Result Pages (SERPs) play a significant role in how much organic traffic you get. If you don’t hook viewers in, they’ll ignore your website and move on to the next option without a second thought.

Fortunately, there are a lot of ways you can improve your meta descriptions. For example, by using schema markup you can overhaul their style and transform simple descriptions into ‘rich snippets’. In this article, we’re going to talk about what schema markup is and show you a few examples of how it works. Then we’ll teach you two ways to add schema markup to WordPress.

Let’s get to it!

An Introduction to Schema Markup (And Why You Should Use It)

Schema markup is a type of code you can add to your pages to help search engines better understand their contents. Using schema markup, you transform your regular meta descriptions into rich snippets.

To give you an example, imagine that you’ve published a recipe on your WordPress blog. The standard route would be to use a normal meta description, which appears in search results as plain text:

By adding schema markup to the page, you can transform it into a rich snippet to make it stand out, like this:

To make this possible, you must add markup to our recipe. You can either do this with a plugin, or adding the necessary code to your pages manually using microdata, RDFa, or JSON-LD. We’ll discuss both of these methods in more detail later on.

Creating rich snippets for your pages may seem like a hassle, but it can benefit you in a lot of ways. First off, rich snippets makes your pages stand out in search results, which will help you get more clicks. Secondly, there are almost 600 types of schemas to use, so chances are no matter what your content is, you’ll find markup to match. This enables you to do many exciting things with your rich snippets, which we’ll take a look at next.

What You Can Do With Schema Markup

As we mentioned earlier, there are hundreds of types of schema you can use on your pages depending on what their contents are. We’ve already looked at how you can use this with a recipe, so let’s look at other ways you can use schema for your WordPress content.

For example, if you’re running a blog, you’ll probably get a lot of mileage out of the article schema markup. This enables you to include elements such as images and author names right next to your meta descriptions:

A lot of blogs also focus on reviewing products or services. Here’s an example of a product review rich snippet, which enables you to display rating scores:

Another example is the event schema. This type can show dates, times, and locations so people can have easy access to all the information they might need:

We could go on and on about all the types of schema you can use, but this should give you an idea of the possibilities. WordPress enables you to implement any type of schema markup you want, you just need to know how.

How to Add Schema Markup to WordPress (With and Without Plugins)

To use schema markup in WordPress you can either use a plugin or do it manually. We’re going to cover both approaches and explain why you might want to use either method.

The All In One Schema Rich Snippets plugin enables you to add schema markup to WordPress without the need to use any code. Once you enable the plugin, a new widget will show up below the WordPress editor. To start, all you need to do is choose the type of content you’re working on:

Once you’ve done this, you’ll be shown extra fields where you can add information regarding the rich snippet:

The fields will vary depending on what class of content you choose. It shouldn’t take you more than a couple of minutes to fill out all the necessary schema data for your rich snippets.

Unfortunately, this plugin doesn’t enable you to preview how your snippets will look. To do that, you’ll need to publish your post or page after adding the necessary data and use Google’s Structured Data Testing Tool. When you access the testing tool, it’ll ask you to either enter a URL or a code snippet. If the post to which you’ve added the schema markup is live, you can test it by entering its URL:

Google will pull the markup from the page and show it to you on the right side of the page:

From here, you can click on the Preview button to check out what your rich snippet will look like when someone sees it in the search results:

If there are any errors in your markup, the tool will let you know at this stage. However, you shouldn’t run into any problems while using the All In One Schema Rich Snippets plugin as it handles all the coding for you.

2. Add Schema Markup to Your Posts Using WordPress Custom Fields

If you’re an advanced user and want more control over the markup you use in WordPress, you can use custom fields to add the schema markup manually. This approach will enable you to use schema classes that aren’t available using the plugin. However, it does require an additional bit of work.

To get started, open the editor for the page or post where you want to add the markup. Look for the Screen Options tab at the top of the screen and click on it. You’ll be able to choose which widgets you want to show up alongside the WordPress editor. Go ahead and enable the Custom Fields option and a new widget will show up under the editor:

You’ll need to create a new custom field, so set a name for it in the field to the left. To the right, you have an empty field where you can add the code you want. For example, if you want to showcase an event, here’s an example of how that JSON-LD code could look like:

This code example contains placeholder information, which you’ll need to replace with your own information. Once the code is ready, click on the Add Custom Field button to save it. The data is now added to your content, but you still need to configure your theme to load it. Save your post or page now and open your FTP client.

Connect to your website via FTP and go to the public_html/wp-content/themes folder. You’ll find folders for each of your themes inside. To implement the functionality we need, you’ll have to edit one of your theme’s core files. If you haven’t done so yet, you’ll want to set up a child theme before you make the changes we’ll discuss below. Once your child theme is ready to go, return to the themes directory and look for its folder:

Open that folder now and locate the header.php file within. Right-click on it and choose the View/Edit option. This will enable you to edit the file and add the following PHP code within the <head> tags, near the top of the document:

This code tells your child theme to load the information in the custom field you created earlier when it’s available. You’ll still need to add that field for each post if you want to use schema markup for it. Without this code, search engines won’t be able to access your posts’ schema markup.

Before you save the file, you’ll notice the nameofyourcustomfield placeholder shows up three times. You need to replace this with the same name you set for your custom field a minute ago. When that’s done, you cansave the changes to your header.php file. Afterward, go ahead and check your schema markup loads properly using Google’s Structured Data Testing Tool, as we showed you how to in the previous section.

Conclusion

Your website’s content is paramount, but so is the way it appears in search results. Using schema markup can help you enable rich snippets for your content, which will raise visibility of your content and help lead more traffic to your site. All you have to do is add schema markup to your content, and you’re off to the races.

When it comes to adding schema markup to WordPress, we’ve shown you two methods of doing this:

Hi Bruce, this is Andrea from WordLift. We are happy to provide a 30 days trial to the users of this forum and a 10% off for all Elegant Theme subscribers. Just drop me an email at [email protected] and I will send you the key.

It’s not simple, but using Google Tag Manager to target all or specific pages, you can add and manage custom schema markup via json script. The process is too complicated to describe here, but yoast has a training course on structured data that will take you through the process.

Willie Chieves
April 28, 2018

John, nicely done. I was just going to have this done on a website and now I’m confident that I can do it myself.

John Hughes
May 1, 2018

You’re welcome. Glad you found it useful. 🙂

Tim Gilbert
April 28, 2018

Great, informative article! Thank you.

Anna
April 28, 2018

Is there a library of the different schema markups and the code that would be needed to implement each of them? I know that’s asking a lot, but if I can get past programming I’m happy. 🙂

Hi Anna. I wouldn’t add the mark-up manually if I were you. It is a ton of work and it has very little advantage compared to using a plug-in that handles that natively, especially for non-techie people 😉

Great article and has me really enthused but am I the only one confused by this one fact? There are, you say, over 600 types of Schema. I want to get started right away. Most readers of this blog will I imagine be web designers. I am a web designer and want to implement it on my own site. What type of Schema should I use?

Hey John,
thanks a lot for this comprehensive article. I really enjoyed to read it 🙂

Maybe as an addition: For me, Schema Pro from brainstormforce works great. Especially, because i do not have to set the schema settings on every article again. I simply configure it per post-type and it gets the data.

It also is not perfect, but for me and my site about hypnotic speech and storytelling, i would not want to miss it.

Thanks, John for the great article but what type of rich snippets displayed for Blog articles?

John Hughes
May 4, 2018

Hello Varun. Thanks for your question. There’s a variety of rich snippet types that can be displayed for a blog article. You can find out more about the different types in a previous article we’ve written. You can access this via the following link:

Great article. Sorry for my newbie question, but if I manually add the JSON-LD to the Divi child theme, will the schema data be visible to visitors? My understanding is that you’ll get a Google penalty if the schema data is not visible to visitors. So if I use the manual method, do I also have to make sure all the schema data is actually visible on the page and visible to visitors? Thanks,

This has been super helpful on my quest to understand this schema stuff! I have a question though. A google search revealed that the description of my site went TWD when I implemented JSON-LD using custom fields on two of my pages (the schema testing tool showed no errors). I have since left the schema markup on the two pages in question but changed my header.php file back to the original version to see if that changed how google read my site description. Where did I go wrong? What could be messing me up or conflicting? Thanks