SEO

When search engines crawl the pages of your site, they are trying to understand what each page is about, in order to index them and serve them to visitors when they search for something relevant. To do this, they need to understand all of the HTML code on your site. Depending on the way your site is built, this may or may not be easy for them.

coding image for add article schema blog post

Schema (also known as structured data, rich snippets or micro data), is a language that is universally understood by search engines, with extreme ease. Essentially, schema tells search engines what your site or a specific page is about in very simple terms.

Why Add Article Schema to Blog Posts?

If you’re writing awesome content, it stands to reason that you’d like search engines to understand it easily: enter schema, a language literally built to make your content easier to understand.

Additionally, around March 2016, structured data was added to Google’s ranking factors algorithm, so having it on your pages could help get your long tail blog posts to rank better, aiding your content marketing strategy and overall digital marketing goals.

Additionally, if you read our blog, or any other digital marketing news,  you know that Accelerated Mobile Pages (AMP) are a huge topic for 2016/2017. These rely heavily on structured data for their advanced features. Getting to grips with more simple types, like BlogPosting schema, is a sure fire way to help prepare you for this.

Finally, if you need more convincing, having structured data on your website’s news, blog posts or articles can enhance your website’s appearance in the search engines as it may allow you to appear in the top stories carousel (however, bear in mind that this is not guaranteed by Google as they seem to be prioritising AMP pages above anything else at the minute).

There are multiple types of article schema that can be added: NewsArticle or BlogPosting being the most common. For most businesses (unless you report news), I’d recommend using BlogPosting schema as it’s more specific to what the article is. The more specific you get with schema, the easier it is for search engines to fully understand your site. So for the purpose of clarity, I’m going to use BlogPosting schema as an example.

How to Add BlogPosting Schema

My favourite way of doing this is by using Google Tag Manager, as it doesn’t require you to actually change the code on the site. In order to add article schema, as a business you need to have Organization schema on your site already. To set this up, check out a blog post I wrote on this last month which contains a step-by-step guide.

Similarly to adding Organization schema to a site, to add article schema you need to create a trigger and a custom HTML tag. Except that this time, you don’t want your trigger to target “all pages”, you want it to target the specific blog post URL. For example, to add BlogPosting schema to one of my client’s blog posts: http://applefostering.co.uk/skills-foster/ I set up a trigger in Tag Manager like this:

skills-to-foster-trigger

 

Once the trigger is set up, you need to create the actual tag. As with the Organisation schema, it is a custom HTML tag into which you need to add the following (obviously having replaced the fields with your own company and article details):

<script type=”application/ld+json”>
{
“@context”: “http://schema.org”,
“@type”: “BlogPosting”,
“mainEntityOfPage”:{
“@type”:”WebPage”,
“@id”:”http://applefostering.co.uk/skills-foster/”
},
“headline”: “The Skills to Foster”,
“image”: {
“@type”: “ImageObject”,
“url”: “http://applefostering.co.uk/wp-content/uploads/family.jpg”,
“height”: 463,
“width”: 700
},
“datePublished”: “2016-02-12”,
“dateModified”: “2016-02-12”,
“author”: {
“@type”: “Person”,
“name”: “Person’s Name”
},
“publisher”: {
“@type”: “Organization”,
“name”: “Apple Fostering”,
“logo”: {
“@type”: “ImageObject”,
“url”: “http://applefostering.co.uk/apple-logo-schema/”,
“width”: 550,
“height”: 60
}
},
“description”: “A brief description of your article”,
“articleBody”: “You can put your entire article in here: it can be as long as you want.”
}
</script>

Some Things to Remember:

  • The blog post’s image has to be a minimum of 700 pixels wide
  • Within the Publisher section, the logo of your business has to be 550 pixels wide x 60 pixels high (this is not the case in regular Organization schema – only when you add it within article schema)

If you don’t respect these rules, the schema won’t work – which is frustrating as it took me a long time to actually find these instructions online.

Once that code is added into your custom HTML tag, apply it to the page specific trigger that you previously created. As in my previous post, use the preview and debug mode to check that it’s being fired on the page. If it’s not, start again. If it is, publish your changes and test out the schema in the Structured Data Testing tool.

If you have a WordPress site you can also add this schema via certain plugins, or by hard-coding it into the pages that you want to change. However, I would always recommend using Tag Manager as it’s very easy to use and also means that you’re not actually changing the code on the site – so there is much less risk of making a costly mistake.

For those of you who have a blog that you update every day, it’s possible to tell Google Tag Manager to generate this dynamically. I’d mainly recommend this for sites that have a large number of blog posts (such as daily updates). Adding article schema via Tag Manager (especially with the code that you can simply copy, paste and add the correct elements to each time) takes a maximum of 5 minutes, so if you’re only writing one or two blog posts per week/month it may not be worth trying to do them dynamically.

 

 

6 responses to “How to Add Article Schema Markup to Blog Posts”

  1. Nigel Bogle says:

    Another great post Eleanor. Will give this a go on some of our blog posts. Thanks and best wishes to you all for a great Christmas.

  2. Eleanor Reynolds Eleanor Reynolds says:

    Thanks Nigel, that’s really kind of you to say! Hope it works for you and let me know if you need any help (although if I wrote this properly you shouldn’t need any !). Have a lovely Christmas and best wishes for the New Year!

  3. devender says:

    structured data testing tool not detecting your code.

  4. Justasklia says:

    This seems like a lot of work…sighs….good things don’t cone easy

  5. Dave says:

    Is it possible for you to share the source location of the instructions regarding the blog/publisher/organization image sizes? My logo passes muster with Google and it is only 250px wide…

  6. Eleanor Eleanor says:

    Hi Davender, usually if the Structured Data Testing Tool is not detecting your code it’s because of an error in the way that Google Tag Manager was setup or because there is an error in the schema code that makes it unreadable.

    Justaskalia – unfortunately no, things don’t tend to be easy in SEO, but I hope that having the code here and ready will help to make it easier!

    Dave, here are some image guidelines for Schema, I hope they help https://www.hillwebcreations.com/valid-image-size-json-ld-snippet-markup/

Leave a Reply

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