How to Add Schema Markup to a WordPress Theme

Published On June 25, 2015
261 Comments Leave a Comment

schema-markup-add-wordpress

In the world of computer programming, schema can be defined as the overall structure for a database. As per the Schema.org website, Schema markup is the code that you integrate with your website to help the search engines return more informative results for your users. If someone has ever used rich snippets, they’ll understand exactly what schema markup is all about. When you include content in your HTML pages, the search engines see it as plain textual content. They don’t know the content’s relevance or what the content is all about.

Schema tells the search engines what your data means and also helps structure your data. For example, when you post an article on your website and include the author’s name in the meta data, only you will know that the mentioned person is the author of the article. In order to make the search engines identify the author, you must include some kind of markup code around the author’s name and this is exactly what Schema.org empowers you with. Schema is a type of ‘rich snippet’ or HTML markup that adds extra information to the relevant content in a search result.

“In general, the more markup there is – schema, video or whatever – the easier it is for search engines to be able to interpret what really matters on a page,” – Matt Cutts.

schema-funny-cat

To better explain the Schema concept, here is a funny image of a cat. I and you know it’s a cat, but a person who has never seen a cat in his life, doesn’t know anything about it. Consider the search engines as this novice person. The search engines only see it as an image and they try to pull relevant information from the ALT tag. To make this picture more search engine friendly, we have to put some indicator on the cat (a hat with”CAT” written all over it in this picture). So, when using the Schema Markup code, we are actually putting visual sensors for search engines. I hope that explains it better.

Why to Use Schema Markup?

A very small percentage of websites have integrated Schema Markup in their code till now, but despite the low number of sites carrying Schema integration, Google still delivers schema-generated markups in nearly 37% of search results. Adding the relevant Schema markup will make your website more semantic and prominent in the eyes of search engines. Also, there is a sure chance to rank higher on the search engines in the near future.

“Pages with Schema markup rank four positions higher in search results” – Searchmetrics.

Adding Schema to a WordPress Theme

A WordPress theme doesn’t contain Schema Markup by default. In order to add it to your theme, you should read the following steps and implement them.

1. First, we have to broadly define the page type for which we are adding the Schema Markup. According to the Schema.org website, a page can be an article, profile page, blog, search results page or just a general webpage. To do this, we must include this function in our functions.php file of the applied WordPress theme. With the help of this function, we can dynamically declare the page type for each kind of WordPress template.

function html_schema()
{
    $schema = 'http://schema.org/';

    // Is single post
    if(is_single())
    {
        $type = "Article";
    }
    // Is blog home, archive or category
    else if(is_home()||is_archive()||is_category())
    {
        $type = "Blog";
    }
    // Is static front page
    else if(is_front_page())
    {
        $type = "Website";
    }
    // Is a general page
     else
    {
        $type = 'WebPage';
    }

    echo 'itemscope="itemscope" itemtype="' . $schema . $type . '"';
}

The above code defines your single posts as an ‘article’ type of page. If you are using a static front page, then that will be defined as a ‘website’ and if you have your blog posts on the home page, it shall be defined as a ‘blog’ page type. If none of the conditions are true, it will be a generic ‘webpage’ type.

2. Open the header.php file from your WordPress theme and find the <html> tag at the beginning of the template. Now, call the function defined in the first step. So, your <html> tag should look something like this :-

<html <?php html_schema(); ?>>

3. In the header.php file, find the <title> tag and insert itemprop=”name” to define the name for your webpage/blog/website.

<title itemprop="name"><?php wp_title(''); ?></title>

This will set the name for your blog, website or webpage pulling it from the site title.

4. Again in the header.php file, find your logo(text or image) that is linked to your home URL. We will use the markup itemprop=”url” to set URL for the webpage/blog/website.

<a href="<?php echo get_option('home'); ?>/" itemprop="url"><?php bloginfo('name'); ?></a>

5. Now we need to define the site navigational elements. In order to do that, find the navigation menu (most probably in the header.php file) that is encapsulated in a <nav> or <div> tag  and insert itemscope itemtype=”http://schema.org/SiteNavigationElement” to make it appear somewhat like the following code. Any links wrapped in this will become the Schema Navigation Elements.

<nav itemscope itemtype="http://schema.org/SiteNavigationElement">
<!--WORDPRESS NAVIGATION MENU-->
</nav>

6. In order to mark up the navigation links using Schema, we need to add a function to the functions.php file. This will add itemprop=”url” markup to each link in the navigation menu.

add_filter( 'nav_menu_link_attributes', 'add_attribute', 10, 3 );
function add_attribute( $atts, $item, $args )
{
&nbsp; $atts['itemprop'] = 'url';
&nbsp; return $atts;
}

7. For a blog post type, you have to use the markup itemscope itemtype=”http://schema.org/BlogPosting” itemprop=”blogPost” to define it as a blog posting. Include this code in the <article> or <div> tag after your WordPress loop begins. Your post title, content, meta data etc. should be encapsulated within this markup code. Following is an example of how it should work.

<!--WORDPRESS LOOP BEGINS-->
<article itemscope itemtype="http://schema.org/BlogPosting" itemprop="blogPost">
<!--POST CONTENT-->
</article>
<!--WORDPRESS LOOP ENDS-->

8. Now in the post content we need to add markup code for the headline, URL, date of publishing, content and image. In order to do this, follow the code below.

For headline and URL (permalink) put itemprop=”headline” and itemprop=”url”.

<h2 class="post-header" itemprop="headline">
<a href="<?php the_permalink() ?>" rel="bookmark" itemprop="url"><?php the_title(); ?></a>
</h2>

For the featured image inside your post or article, add itemprop=”image” inside the <img> tag like this.

<img src="" itemprop="image" />

For the date of publishing, add  itemprop=”datePublished” around the post date.

<span itemprop="datePublished"><?php the_time('F jS, Y') ?></span>

For textual content, add itemprop=”text” in the surrounding <div> tag around your content or excerpt.

<div itemprop="text"><?php the_excerpt(); ?></div>

So, by now you should have a fair idea of how to use Schema Markup codes in your WordPress Theme. You can use the Google’s Structured Data Testing Tool to check if you have integrated Schema into your website efficiently.

For more details, you should research on Google and also visit Schema.org website. And if you need personal help in setting up Schema for your website, you can contact me.

261 replies on “How to Add Schema Markup to a WordPress Theme”

John Reply

I am also using wordpress theme on my blogs. These schema markup codes are what I really needed, Keep the great work up.
Cheers!

Peter Lonyo Reply

I was trying to put my schema in my website right now and knowing this will help me a lot! Thank you very much for sharing this article.

Molly Speaks Reply

This is a great inspiring article.I am pretty much pleased with your good work. You put really very helpful information. Keep it up. Keep blogging. Looking to reading your next post.

osssama shk Reply

Superbly written article, if only all bloggers offered the same content as you, the internet would be a far better place..

osamas shk

Great write-up, I am a big believer in commenting on blogs to inform the blog writers know that they’ve added something worthwhile to the world wide web!..

chavesarlene4 Reply

It very informative and easy to understand. It will make my wordpress website more beautiful. I was was wondering if I could use this

That’s a very good post, This post give truly quality information, I’m definitely going to look into it, Really very useful tips are provided here, Thanks for sharing.

osasma shk Reply

Great write-up, I am a big believer in commenting on blogs to inform the blog writers know that they’ve added something worthwhile to the world wide web!.

Quality articles is the secret to interest the users to pay a visit
the site, that’s what this site is providing.
I’m really enjoying the design and layout of your website.
It’s a veryy easy on the eyes which makes it much more enjoyable

malik Reply

Very useful post. This is my first time i visit here. I found so many interesting stuff in your blog especially its discussion. Really its great article. Keep it up.

farhan72 Reply

I was reading your article and wondered if you had considered creating an ebook on this subject. Your writing would sell it fast. You have a lot of writing talent.

farhan72 Reply

Interesting post. I Have Been wondering about this issue, so thanks for posting. Pretty cool post.It ‘s really very nice and Useful post.Thanks

i read a lot of stuff and i found that the way of writing to clearifing that exactly want to say was very good so i am impressed and ilike to come again in future..

farhan72 Reply

This is very educational content and written well for a change. It’s nice to see that some people still understand how to write a quality post.!

osama shks Reply

I’ve been searching for some decent stuff on the subject and haven’t had any luck up until this point, You just got a new biggest fan!..

osamsa shk Reply

I really enjoyed reading this post, big fan. Keep up the good work and please tell me when can you publish more articles or where can I read more on the subject?

Susmita Reply

Thanks for taking the time to discuss that, I feel strongly about this and so really like getting to know more on this kind of field.

osama shk Reply

I really thank you for the valuable info on this great subject and look forward to more great posts. Thanks a lot for enjoying this beauty article with me. I am appreciating it very much! Looking forward to another great article. Good luck to the author! All the best!

osama shk Reply

I appreciate everything you have added to my knowledge base.Admiring the time and effort you put into your blog and detailed information you offer.Thanks.

farhan72

Very good points you wrote here..Great stuff…I think you’ve made some truly interesting points. Keep up the good work.

farhan Reply

Thanks for taking the time to discuss that, I feel strongly about this and so really like getting to know more on this kind of field. Do you mind updating your blog post with additional insight? It should be really useful for all of us.

Hi, that’s so nice article. And as a webmaster, I admit that Schema markup is so important for today’s website. But there are many plugins which you can use for this purpose.

osama shk Reply

This type of message always inspiring and I prefer to read quality content, so happy to find good place to many here in the post, the writing is just great, thanks for the post.

osama shk Reply

I have read your blog it is very helpful for me. I want to say thanks to you. I have bookmark your site for future updates.

osamas shk Reply

I really thank you for the valuable info on this great subject and look forward to more great posts. Thanks a lot for enjoying this beauty article with me. I am appreciating it very much! Looking forward to another great article. Good luck to the author! All the best!

farhan72 Reply

I found this is an informative and interesting post so i think so it is very useful and knowledgeable. I would like to thank you for the efforts you have made in writing this article.

osama sshk

Superbly written article, if only all bloggers offered the same content as you, the internet would be a far better place.

osama shk

I really thank you for the valuable info on this great subject and look forward to more great posts. Thanks a lot for enjoying this beauty article with me. I am appreciating it very much! Looking forward to another great article. Good luck to the author! All the best!

chrisgail Reply

I am not a developer but I think these WordPress are useful for a developer whose work is developing the websites

farhan Reply

Very good points you wrote here..Great stuff…I think you’ve made some truly interesting points.Keep up the good work.

osama shk

Thank you again for all the knowledge you distribute,Good post. I was very interested in the article, it’s quite inspiring I should admit. I like visiting you site since I always come across interesting articles like this one.Great Job, I greatly appreciate that.Do Keep sharing! Regards,

osama shk Reply

Thank you for some other informative blog. Where else could I get that type of information written in such an ideal means? I have a mission that I’m just now working on, and I have been at the look out for such information.

osama shk Reply

You know your projects stand out of the herd. There is something special about them. It seems to me all of them are really brilliant!

osama shk

Good post but I was wondering if you could write a litter more on this subject? I’d be very thankful if you could elaborate a little bit further. Appreciate it!

osama shk Reply

Superbly written article, if only all bloggers offered the same content as you, the internet would be a far better place..

Waooo thanks for this great article Is so rich in content if not for here and now I never knew that “Schema markup is the code that you integrate with your website to help the search engines return more informative results for your users”

Great Post. Thanks for sharing this with us. Your blog posts are really very interesting and useful. Hopefully this may also help your readers to do affordable online shopping. Ferns N Petal Discount Codes

Joshua A. Price Reply

Your current web-site is fairly quickly growing to be certainly one of my top feature. So, I just stumbled on creative weblog and I just need to state that this amazing is a nice blog post. Bless you pertaining to this kind of knowledge.

Sam Reply

Good blog you’ve got here.. It’s difficult to find excellent writing like yours these days. I really appreciate individuals like you! Take care!

very nice information after watching my website on google webmaster tool and found that the schema.org and after a long search it is ended now, thanx for sharing this awesome information.

Amazing tutorial. I was just moved our companies website from html to WordPress and wondering how can i use markup now? thanks you have solved my problem.
I have one more question: How can i add itemprop=”articlebody”. in my single blog post?

Hello, Good tutorial. But i am trying to testing my site on Google Structure tool to find my theme has schema markup implementation by default or not, but don’t know the correct option there. Can u helps me?

I building a new site and it is not yet live…….what is the cost for you to put the code in for me? i am not too good at doing the php thing and would hate to screw it up

Thanks
Steven

farhan72 Reply

This is a great post. I like this topic. This site has lots of advantages.I found many interesting things from this site. It helps me in many ways. Thanks for posting this again.

Jai Reply

Hi Patrick, Thanks for the appreciation. Yes, people have to be careful that Schema hasn’t already been integrated into the theme (highly unlikely). Also, I know about the Inbound link (I shared it there 🙂 ). Feel free to share the post in your social network.

fave fave Reply

I like this post,And I guess that they having fun to read this post,they shall take a good site to make a information,thanks for sharing it to me.

Leave a Reply to PUBG Cancel reply

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