How to add schema markup to WordPress website

Schema markup code is the type of structured data that gives the post details to google search engine and helps Google create a rich snippet. The schema mark-up code can be added to the website very easily.

How to add schema markup to wordpress website

What is schema markup structured data?

Schema mark-up is a microdata code that helps Google understand the webpage. It is also called rich snippet code and structured data code. This tells the search engine what type of information is written on the page the search engine is reading.

Using this code, the search engine easily understands the information available in the content and provides good and correct information to the user.

Pages that do not have microdata written become difficult for Google to understand because Google understands the language of the code. Schema is a code-based language that tells Google the information available on the page.

Schema.org defines schema as something like this.

Most webmasters are familiar with HTML tags on their pages. Usually, HTML tags tell the browser how to display the information included in the tag. For example, <h1>Avatar</h1> tells the browser to display the text string “Avatar” in a heading 1 format. However, the HTML tag doesn’t give any information about what that text string “Avatar” in a heading 1 format. However, the HTML tag doesn’t give any information about what that text string means — “Avatar” could refer to the hugely successful 3D movie, or it could refer to a type of profile picture—and this can make it more difficult for search engines to intelligently display relevant content to a user.

schema.org

It’s clear from the statement of Schema.org that the h1 tag can show the page topic, but it is difficult to tell about the content. The search engine may be confused because an avatar is a movie, and the profile picture is also called an avatar.

To overcome this confusion, Google tries to get information inside the page. Schema provides similar information to google and makes Google work easier. So that Google understands the information available on the page.

Looking at the product type schema shows how it gives information to Google.

Product schema code

Let’s try to understand this code.

Script type,” tells the search engine that this information is in the JSON LD Format.

@context tells Google that this is a schema code.

@type tells Google about schema types.

This is very specific information for search engines, by which Google decides which rich snippet to show.

Name, image, and description provide product information.

Google easily takes the information of any web page through schema code.

Example of schema markup

Seeing some examples of the rich snippets will make it easier to understand how Google provides information using this schema markup.

Rich snippet of chicken biryani

The image used from the search results you are looking at right now. This three column is derived from different Websites using recipe schema code and contains the name of the dish, the time used to make it, and stuff, as well as a picture.

Google is showing this information directly from a website. But Google understands machine language. How did it know what and how long it will take to make biryani. And the article is about the recipe.

With the help of schema code, Google got this information, And Google showed it through the recipe card. Below I have written the schema code of the recipe, in which you will understand that Google shows information using this code.

Schema code for chicken biryani recipe

Similarly, upon searching a Popular person, a card appears on the side of the SERP. It’s called a Knowledge Graph Card or Knowledge Panel. It contains some information about a particular person.

Google knowledge panel

This graph shows with the help of schema code. This type of schema is called person schema, which is taken from a website. The code given below will help you understand better.

Person schema code for knowledge panel

3 Format type of schema mark-up

Schema data is written in 3 formats. Any website can have one of these 3 formats. It depends on the admin which format he wants to use. All three types of names are given below.

  • JSON-LD
  • Microdata
  • RDFa
3 types of structured data format
Source : Google Developer

Which format best for you

Schema can be written in 3 formats, in which case the question arises that which of these three formats is good, which would be best for you.

JSON-LD is the best schema format for adding schema data to any webpage. It is a javascript code that you can put anywhere on the page. The Biggest advantage of javascript format is that the search engine bot can understand this script from anywhere on the page.

To use the other two formats, You have to implement the HTML code of the webpage, which becomes difficult for a non-technical person.

A big reason to call JSON-LD the best schema format is the Google search engine’s favorite schema format. And this format is supported by all popular search engines.

Types of schema markup support by Google

Google is the most popular and most used search engine right now, So this article has been written giving priority to Google. Most bloggers also optimize content for Google itself.

More than six hundred schema types are available, but Google supports only 30 types of schema right now. Some of these important types are given below.

  • Article – NewsArticle, blog posting
  • Breadcrumbs
  • Book
  • Event
  • Job posting
  • Organization – Logo, Contact, Social Profile
  • Person – Social Profiles, Job Information
  • Product – Offer AggregateRating, Reviews
  • Recipe
  • FAQ
  • How-to
  • Video
  • Website – Sitelink Search Box
  • Local business
  • Software
  • Q&A
  • Speakable
  • Top place list
  • Coarse
  • Live stream
  • Fact check

How to add schema markup to WordPress website without any plugin

You can add any type of schema to any WordPress website using the custom field. This is the best way to Implement Schema. I always recommend this method. Follow the steps given below to add schema by custom field without any plugin.

1. add PHP code on header.php

To add schema code to the post with the help of the custom field, edit the header.php file of the website and add the following code to it. To add code, Go to Appearance> Theme editor> header.php on your dashboard and paste the code before </head> and click on the update file button.

<?php
$schema = get_post_meta(get_the_ID(), 'schema', true);
if(!empty($schema)) {
	echo $schema;
}
?>

You have to paste this code only once. After that, it will prepare your website to put schema code.

Edit header.php by them editor WordPress

Note: Make sure to backup the header.php before editing it. So that it can be restored in case of any error.

2. Enabled custom field

Make sure your site has custom fields enabled. To enable the custom fields, go to the three-dot menu> preferences> panel> Additional in the post editor page and turn on the custom field switch. And click on enable and reload button. It will show the option at the bottom of your post editor page to add custom code.

Enable custom field on WordPress

3. Generate schema code by schema markup generator tools

After completing the above two steps, it’s time to create schema markup code for the webpage. You have two options to create Schema code.

1. create schema code by yourself, and
2. use any schema markup generator tools. This tool generates schema data very easily in a few minutes.

I would always recommend using schema generator tools because this will also save your time. And you will not need to write code.

To generate Schema, go to your favorite schema mark-up tools and fill in the requested information. After Schema code is generated, copy that.

4. Paste schema markup code in the custom field

To add schema code, edit the webpage where you want to add. Scroll down the page. Now fill name and value section.

1. Click enter new in the name section and type schema.

2. Paste the generated schema code in the value section, then click on the add custom field button.

Make sure that there is no spelling mistake while filling this field.

Add schema code on custom fields

5. Check your schema code by rich results test schema mark-up testing tool

Rich results test testing tool developed by Google. Using this tool, you can check any schema present on your page. The rich results test tool can tell that schema code is written correctly or not.

After adding schema code to your webpage, always check your webpage using this tool, and make sure that your code is working or not. To check the Schema code, Go to the rich results test tool and paste the URL or source code of your webpage there and click on the test button. Within minutes you will get to know whether the code is working or not.

Schema markup testing tool google

How to Add schema markup using HTML block

It’s easy to add schema using HTML block. There is no need to have coding knowledge for this. Generate schema from any schema markup generator tools to implement schema code using HTML block. After Generating Schema, go to the post editor and add the HTML block inside the post. Paste your schema data in this block.

Add schema markup code using html block wordpress

This block will not be visible to your user, but when the Google bots crawl this page, It will identify this schema and collect the necessary data from here.

To ensure that the added data is working or not, check your schema with a rich results test.

Add schema markup using wordpress plugin

You can also add schema to the website through plugins. It is the easiest method. But I do not recommend it. Whenever you install a plugin, it adds a basic schema to your site but demands a paid version for the custom schema.

If you can afford a paid plan, It’s the best option to add schema to a website. For this, you need to search for schema by going to plugin> add new in your admin dashboard. You will see many schema plugins. Install any plugin you like.

If you use an SEO plugin like Rank math and Yoast SEO, You don’t need to add the schema plugin separately. You will get the option to add schema to this plugin. You can also add custom schema using the paid version.

To understand the process of schema implementation using the schema plugin, see the step-by-step guide given below. I use Schema & Structured Data for WP & AMP plugin in this guide.

1. Go to Dashboard > Plugins > Add new install and activate the Schema & Structured Data for WP & AMP plugin.

Schema and structured data plugin WordPress

2. Go to Structured data> Schema type> Add schema type, select Schema type, and click on the Next button.

Select schema type to add schema data to webpage

3. In the Placement Window, select the webpage where you want to add schema. Click on the Next button.

Schema placement to webpage

Congratulations, the scheme has been added to your webpage.

Schema added to the webpage

FAQ

What is schema markup used for

Schema markup is Used to provide content information to Google. Using schema code, Google shows the results in rich snippets. Google can index the webpage well using schema.

Is schema markup Important?

Schema markup is crucial in 2021 Because schema makes it very easy for Google to get the information of our site. The schema also helps rank the site via a snippet.

Does schema markup help SEO?

Yes, schema markup optimizes content for search engines. Using schema Google can easily understand the intent and crucial information of any webpage. This information helps Google to prepare the snippet format according to the user’s queries.

People also read

Google web stories best practice and SEO

Spread the love

Leave a Comment

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