A schema is a type of structured data used in websites to explain the type of content published so as to give rich search results of a post. In blogger, we can easily use schema markup by specifying the part of the schema needed for a post type or page. Today we are going to see how to add the schema markup to our blogger templates by adding the code as specified in each field below. Without wasting more time on explanation lets jump into the setup fast and easy. Your blogger schema is stepped away.
Before we venture a lot into the schema markup, I think its rather good to mention what all the terms stand for.
What Is Schema?
Schema markupis Markup that youuseon your website to help the search engines return more informative results for users. Just Use rich snippets, and you will be in Place to understand exactly whatschema markupis all about Apon Applying. This Is Originated fromKiss Metrics.
If you apply an article schema markup to your blogger blog, the results will be that the post meta description will appear first in search results to fast answer the searched topic and that`s where the schema applies. Schema examples are derived from schema.org and they can also be called structured data markups. For better understanding, I already made a good explanation of a post of how schema markup works and other complex schemas .org examples.
Let`s see different schema markups that we can include to blogger blog.
Steps By Step On How To Use Schema Markup In Blogger.
Step 1.Log in to Blogger and choose your specific website to add the schema code.
Step 2.Reach out to the left commands by navigating to them to the Template command
Step 3.Click on the template command and then locate the Edit HTML next to Customize.
Step 4.Click anywhere in your code and then click on Ctrl+F in windows or CMD+F in mac.
Step 5.Search forEvery Part of the Code Indicated.
1. Blogger Site Navigation Element Schema
Site navigation element schema is responsible for specifying the label that your post lands at and makes it easy for search engines to know where your post is stationed in the categories. To add the site navigation element schema search for the below code.
After finding the ABOVE code then you will have to place the schema code as shown below.
<nav id=’topnav’ itemscope=’itemscope’ itemtype=’http://schema.org/SiteNavigationElement‘ role=’navigation’>
That`s all with adding site navigation element schema. You will have to validate your schema by testing it in the structured data testing tool from Google and other search engines that I am going to provide below.
2. Blogger Webpage Shema Markup.
For being that you are using your website for many links then its good if you include a website schema markup since the schema will get you a site links search box structured markup below your homepage in search results. I am pretty sure some of us are not that familiar with the site links search box structure and it will look as attached below.
To add the webpage schema markup to your blogger website, search for the below code.
It will be embedded in the opening of the body code so that the schema can help crawl all over the site to get links and posts. Now you will change the code to look as shown below.
<body class=’index’ itemscope=” itemtype=’http://schema.org/WebPage‘>
That’s all with the webpage schema markup implementation. This kind of schema takes time before you receive the results in search engines. To make sure you get the site links search box then you have to make an effort to make your website recognized by search engines as they use the schema to crawl in your blogger website.
3. WP header Blogger Schema Markup.
Sometimes websites are made in a way that crawlers can’t get the navigation of your menu through the header so as to know that your visitors are able to navigate well through. In this occasion, then we use the WP header schema markup to make your blogger header and menu to be crawled well by search engine bots. To add the wp header schema, search for the below code.
<header> Or <header-wrapper
You will find the above code and we are going to customize it by adding the schema.org markup as well shown below. Act accordingly.
<div id=’header-wrapper’ itemscope=’itemscope’ itemtype=’http://schema.org/WPHeader‘>
That`s how we expect the header wrapper code will look like after adding the schema.org link URL with the code to support wp header schema. If you got any difficulty to contact me for help.
4. Blog Schema Markup For Blogger.
This is a simple blogger blog website schema.org integration to add structured data to your website. To add the blog schema, search for the below codes in your template.
After finding the above code, then you have to change it to look like the presented way below.
<div id=’content-wrapper’ itemscope=’itemscope’ itemtype=’http://schema.org/Blog‘ role=’main’>
That’s all with adding the blog schema structured data from schema.org. Let’s see another schema example to add to blogger.
5. Blog posting Schema Markup For Blogger.
Blog posting changes the way your schema takes time to work in search results. Roomers have I that blog posting is the only shema.org structured data that will help your post get indexed quickly. This is because the crawlers already know your blog and content and thus its the best when you want to specify on a personal blog. How to add this schema markup is a little task but now we are going to carry out this in a couple of steps which I am going to take you through them.
First of all search for the code below:
<div class=’post hentry uncustomized-post-template’ >
Now you will change the above to look like as shown below.
<div class=’post hentry uncustomized-post-template’ itemscope=’itemscope’ itemtype=’http://schema.org/BlogPosting‘>
We are now a halfway went to make sure blog posting schema is on your website.
Now search also for the below code.
<article class=’post entry’ expr:id=’data:post.id’>
You will have to change the above code to customize it to look like the below one.
<article class=’post hentry’ expr:id=’data:post.id’ itemscope=” itemtype=’http://schema.org/BlogPosting‘>
That’s all with the blog Posting schema.org structured markup.
6. Person Blogger Schema Markup.
Person schema tells more about the writer of the post or the one who owns the blogger blog as the author. The person schema markup the is the best to help get the local business schema working in search results. Let’s see how to add the Person schema markup in blogger.
Search for the below code.
<div class=’author-profile’ itemprop=’author’ >
Now you will change the code to reflect the one shown below. Change it.
<span class=’fn author’ itemprop=’author’ itemscope=’itemscope’ itemtype=’http://schema.org/Person‘>
7. WP Sidebar Blogger Schema Markup.
the wp sidebar helps the search engines navigate to your sidebar and know the schema markup used in the exercise. Let’s see how to add the wp sidebar shema.org schema markup.
Search for the below code in your template code.
Now I’ll change the above code to the one shown below.
<div id=’sidebar-wrapper’ itemscope=’itemscope’ itemtype=’http://schema.org/WPSideBar‘>