How to Add JSON-LD Schema.org to Blogger Homepage

Google's preferred markup on your homepage will help the search engine algorithms provide important information about your practice. This information includes items such as your office location, information about offices with multiple locations, preferred logos, and other important details about the organization that appear in search results.

What is JSON-LD?

To start, how do we examine what JSON-LD depends on, so that we understand exactly what it does.

JSON-LD, or JavaScript Object Notation for Linked Data, is a method of encoding linked data using JSON.

JSON - JSON is a lightweight data-interchange format that is easy for people to read and write, and for systems to parse and produce.

LD - Linked Data is about linking related information using the Internet.

JSON-LD is a mixture of both. So this is a snippet of code that informs you which price pertains to which item. Basically, instead of adding schema.org attributes to individual components on a page, a small block of JavaScript code is provided with all the information.

Use of schema.org

What we are talking about here is the organized information on your website. Schema.org provides a machine-readable way to present your data to Google.

You draw priority to have your content appear in Google Search, one that has structured information, rich results, and another site link is the search box. Increase Google's chances of highlighting rich snippets of your site in search results.

How to Add JSON-LD Script to Your Blogger Homepage?

Please copy the code below and paste it right above </head>

Schema.org installation steps on blogger
  1. Go to https://blogger.com and Sign in to your account
  2. Now From Blogger Dashboard click on ->Theme -> Customize -->Edit HTML
  3. Now Find </head> tag in your template
  4. Now copy the following JSON-LD markup and paste it before closing </head> tag.
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<script type='application/ld+json'>
{
  "@context": "http://schema.org",
  "@graph":
  [
  {
  "@type": "Webpage",
  "url": "<data:blog.canonicalHomepageUrl/>",
  "name": "<data:blog.title/>",
  "headline":"<data:blog.title/>",
  <b:if cond='data:blog.metaDescription'>"description": "<data:blog.metaDescription.escaped/>",<b:else/>"description": "<data:blog.title/>",</b:if>
  "mainEntityOfPage": {
    "@type": "WebPage",
    "@id": "<data:blog.canonicalHomepageUrl/>"
  },
  "publisher": {
    "@type": "Organization",
    "name": "<data:blog.title/>",
    "url": "<data:blog.canonicalHomepageUrl/>",
    "logo": {
        "url": "URL OF IMAGE",
        "width": 600,
        "height": 60,
        "@type": "ImageObject"
    }
  },
  "image": {
    "@type": "ImageObject",
    "url": "URL OF IMAGE",
    "width": 1280,
    "height": 720
    }
  },
  {
  "@type": "WebSite",
  "url": "<data:blog.canonicalHomepageUrl/>",
  "potentialAction": {
    "@type": "SearchAction",
    "target": "<data:blog.canonicalHomepageUrl/>search?q={q}",
    "query-input": "required name=q"
    }
  }
  ]
}
</script>
</b:if>

Remember don't forget to change url. then Save your template.

I hope this article has helped you, how to show your bloggers site social profile on Google Search Engine Result Page (G-SERP). If you liked this article, Please do Like and Follow us on Facebook, Twitter.

Image URL for blog logo Please replace it with your image URL keeping the size of 600x60 and for the image create an image for the homepage with the size of 1280x720 and add both URLs in the row highlighted above.

In above code we have also added SITELINK SEARCHBOX and it depends on google how popular your site is to show your search box in google search results.

Post a Comment

Thanks for any suggestions or questions! We will reply to your message soon.

Previous Post Next Post