Structured Data for Articles

This video is all about Structured Data for Articles, NewsArticles, TechArticles and so on.

Links from the Video:


Transcript

(Follows soon)

In this video I want to demonstrate how to build the Article snippet using structured data. And I want to clarify why especially this article snippet is so important not only for text but for voice search, too.


music playing

In this video I want to show you how an article snippet is built. You hopefully took all the lessons from the previous modules. If not please jump back to the beginning of the Structured Data Training Course or to a video where you think you need to refresh your knowledge.

In this video it’s important that you have understood what structured data is and what Rich Snippets are. You need to know how and where you can find the right schema classes as well as their properties to create the Article snippet. Let’s jump right in!

I want to start with the Article snippet because in my mind it’s the one snippet that really everyone must use. The reason for this is that every one of us creates content in various forms like text, podcasts, or videos. And an Article describes this piece of content even more. We will see this later in full detail.

On this URL you can find Google’s reference to the Article snippet. You know from the previous videos that Google defines its schema types (that are often called schema classes as well) on top of schema.org. That’s why we have a look on to this page first.

If you don’t know what I’m talking about I would encourage you to go back to module one of my structured data training. The videos there explain in every detail where you can find the right schema classes and how you decide which one fits best. It also clarifies the difference between schema types, schema properties, schema.org, Rich Snippets, etc.

Anyway. On this reference page you can also see how Rich Snippets may look like in search results. At the time of the creation of this video Google’s reference said that pages with the Article schema may show up in a so called carousel.

As always: Google does not guarantee that a Rich Snippet may show up in search results like this. They also change things very often. So it may be that the examples shown here will be outdated very soon. That’s why it’s important to always keep an eye on the reference page.

Because Google does not always show a Rich Snippet for a particular schema doesn’t mean you shouldn’t integrate structured data at all. The opposite is the case because search engines are everywhere nowadays.

Obviously we are using the websites of search engines to search using keywords and see with our eyes all the nice Rich Snippets they produce on the result page. But as you may know voice search gets more and more important these days as well. So there is nothing you can see with your eyes. Structured data gets analyzed and prepared by smart assistants and outputted as language.

Google is a pioneer here because they turn an Article schema into content based actions for their Google Assistant. This is especially interesting for podcast, recipe, and news publishers because the Google Assistant can play and read out podcasts episodes, recipes, and news if a voice search hits your site.

So please do not underestimate voice search! It’s not a thing that maybe appear in the future. It’s already there. And as artificial intelligence gets better and better structured data gets more and more important, too.

Article Schema on schema.org

Now let’s have a look on schema.org. In module one of my structured data training you have learned that schema classes can have parent or child schemas. As you can see here, an Article schema class is a child of the creative work. It also has several child schemas like NewsArticle, TechArticle and so on.

First, it’s important to understand that all the child schemas are Article schemas because they are children of it. From module 1 of the structured data training you know that they inherit all the properties from its parents.

Second, it’s important to understand that you can use every child schema here. You don’t need to stick with the main Article schema. If you think TechArticle if it’s best, use this one! Google will recognize it as an Article as well because it also knows everything about schema.org and its structure.

In this video I want to stick with the Article schema because it’s the most widely used one, I guess. The child schemas do not differ a lot. You can check them out by browsing the schema.org website and the specific schema types you need.

Check the reference page

Now we want to find out which properties are recommended and which ones are required. For this I go back to Google’s reference page to check them out.

Note that Google differentiates between AMP and Non-AMP pages. AMP means “Accelerated Mobile Pages”. It’s an open source initiative to make the web faster. SNIP – my Rich Snippets and Structured Data Plugin for WordPress – supports the AMP plugin for WordPress built by Google and Automattic. So any snippet that gets attached to a post will appear on your AMP pages, too. Nothing to worry about.

By the way you can find the link to the AMP project and the plugin that I use in the description area.

So with that knowledge of all recommended and required properties we now switch to our WordPress dashboard.

How to integrate an Article schema into WordPress

Let’s say we want to create an Article snippet for all of our posts. Because my WordPress plugin has a feature built-in that I have called “Global Snippets” we can create one single Article schema and attach it to every single post automatically.

Of course you can always create a single snippet on a single page, post, or custom post type. If you don’t use my plugin please feel free to use the structured data generator on my website. It’s totally free of charge and it outputs structured data in JSON+LD format that you can use on your non-WordPress sites as well.

Now let’s go back to the dashboard. We click on “Global Snippets” to create a new one.

Please note that some predefined example snippets are shipped with the plugin. It will ask you if it should install them after the activation. If you dismissed the question you can always go to the settings page here … of the plugin to install or reinstall them at any time.

For now I don’t want to work with the delivered example because I want you to learn how to build a snippet from the ground up.

Create a Global Snippet

First I give this Global Snippet a name. This is just for internal purposes.

In the very first input field I search for “Article”. The plugin suggests the other Article types that are all children of the main Article type as well. If you want to go with something else like the TechArticle for example please feel free to select it here. As I said before I want to stick with the main Article type here. So I select it.

The plugin intelligently loads some properties from the schema. This functionality just exists to save you some time. Note that in some cases the preloaded list of properties is incomplete. So it might be that you have to add some properties that are required or recommended as well.

Create the schema properties

I have opened Google’s reference here on another tab. The reference for the Article. When we scroll down we can find the list of properties that are required and down below the ones that are recommended. As you can see here Google wants us to use

  • author,
  • datePublished,
  • headline,
  • image,
  • and so on.

And for the recommended properties

  • dateModified,
  • description,
  • mainEntityOfPage.

This is exactly what we see here. From here everything is super easy. All we need to do is to fill all the fields with their values.

Because we are working with a global snippet we can use placeholder field types to automatically fill the properties with their values depending on their current post.

I start with the easiest one: the headline. I click on “Edit” and as you can see the plugin gives youth description that you can find on schema at work as well. And here we want the snippet to dynamically fill the headline property with our post title. That’s it pretty much here. We can close it.

This is the same for datePublished: post published date. I go on with the other properties. For the description I want to have the excerpt text here.

dateModified = post modified date. Yeah. The other properties are a little bit more tricky but once you understand what Google wants to see here it’s also easy to set up.

Now let’s switch back to Google’s reference page. As you can see here Google wants us to use a Person or an Organization schema type. Plus: for the Person or Organization the name property is required. So let’s do this.

Switch back to our global snippet. Search for the author. And now we have the possibility to search for “Person”. Let’s select this one. Now the plugin also loads some properties here. The name and the URL. We can use both. Only name is required. Because we have the post author name here. And we can also fill the post author URL here.

So what we did is we added a child schema type “Person” with its own properties: “name” and “url”. Just “name” is required but we added “url” as well.

This is the same with the other properties that I have left over now. In particular this is the image. Let me close this now. The image, the publisher, and the… yeah. The image and the publisher. For now.

When we have a look at the reference again we can see that for the image Google wants us to use an ImageObject or a plain URL. And for the publisher they want us to use the Organization schema type which has several properties that have child schema types themselves. For example the the logo property of the Organization must be an ImageObject here. So let’s add them as well.

We start with the image because it’s the easiest one here. I want the plugin to use the post thumbnail URL. Yes, that’s it!

For the publisher we need to search for an Organization. Where is it? Here we are. Here it’s the same. The plugin loads some properties for us so we don’t have to edit them ourselves. The same here: logo and name is required. URL is a nice-to-have property that I added myself. In this example the Organization of this website is the name of the blog so I just choose here the blog title.

But as always: please feel free to add something totally different here if you need another value apart from the blog title. You can always choose “direct text input” and choose your own superhero name here. I go with “blog title”.

The URL is our main website URL so I choose “Blog URL”. Which in this case would be “wp-buddy.test”.

And the logo should be an ImageObject. And when you can remember we need here the ImageObject with height, URL and width. For me it’s super easy I just use the “site icon url”. And for the “width” the “site icon with” parameter. And for the height the “site icon heigh”. I’m closing them.

Maybe just a quick note: the site icon can be set up here under “Appearance” -> “Cstomize”. And you then can find the site icon here under the site identity tab. So please make sure that you have uploaded an image here so that the plugin can use the values: the URL, the width and the height. So that’s pretty much it.

Setup a ruleset

I now make sure that this global snippet gets loaded on every post. I can do that by setting up rules in the rules metabox down here. It seems that for this global snippet it’s okay because I want the post type to be equal to posts.

So I save my settings, click on publish, and I know check a single post.

Validate with the Structured Data Test Tool

I will copy the link to a single post here and enter it on Google structured data test tool. You should be familiar with this tool already. I have shown it to you several times during the structured data training video course. So all you need to do is to enter URL here and run the test. Please make sure that this URL must be public available.

So in my case it wouldn’t work because I’m on a local test domain. So I enter some code snippets here and go back to you.

After the validation Google shows us all types of structured data it finds on the page. Here we see our Article snippet but unfortunately it produces two warnings and two errors. Let’s click on them to see what’s wrong.

So now the tool says that the publisher logo URL is wrong or is empty. This is because I’ve used the site icon type but as you can remember I have not selected a site icon in the customizer. So let’s go back to the customizer to define one.

Customize. Site identity. And here we find the site icon. I use my beloved Donuts image. Yeah, let’s crop it. Publish it. Alright! That it’s done.

The image field is missing in this snippet. This is true because the plugin will delete all empty properties from the structure. The reason for this is because our blog post has no image thumbnail yet. So let’s attach one.

Click edit. Feature image. I’m using this person.

Update. Alright!

Let’s go back to see what’s wrong. And of course we totally forgot to add something for the mainEntityOfPage property. That is required as well. Google just needs the URL of this, of the post itself. So let’s add the “blog url” by editing our global snippet.

By the way I wrote a blog post about the mainEntityOfPage property if you want to know more about it and why it’s important. Please follow the link in the description area.

Post URL. That’s it!

Now let’s start our test again by clicking here on a new test. And after the validation you can see no: errors no, no warnings. Everything is fine now.

Alright! Good job!

Summing up

Alright let’s sum everything up what we have learned in this video.

  • At this point in time all posts and pages that have a correct Article schema appear in a carousel on search result pages.
  • As always there is no guarantee that your post will show up as a Rich Snippet. It’s up to the search engines and their algorithms.
  • However that doesn’t mean you should not use structured data. Especially if you are a podcast-, recipe- or news-publisher. You could profit from being indexed in voice search results, too.
  • The Article schema has child schemas that can be used as well. An example is the TechArticle schema type. You should use more specific schema types whenever possible.
  • Read carefully through Google’s reference pages to find what you should and should not do. The reference also points out which properties are just recommended and which ones are required.
  • With that knowledge and with the information from schema.org you are able to create your own Article snippet using SNIP – my Rich Snippets and Structured Data Plugin for WordPress – as shown in this video.

In the next video I will show you how to create Recipe snippets. So this will be a yummy video! 😉

See you there!

music playing