The Open Graph Protocol is a relatively new way to turn any web page into a sharable social object by adding tags to identify key attributes for that page when shared on a social network like Facebook. Before we look at these OGP tags and how to integrate them into your Blogger blog, let’s take a look at how website links are shared on social networks.

The Open Graph Protocol aid Websites to combine into social graph. It brings together all the unstructured information of a website page right into a structured information so that the web page could be outlined how It will likely be represented on

Upon clicking on Watch summary option it'll present viewers with much more specifics of your blog, article , its description, website link , internet site brand etc. You'll be able to see it in impression supplied down below:

Inside of a former put up, I talked about the usage of Title and Meta Description tags, which can be essential for the blog's Search engine optimization.  I also explained a means of optimizing how Blogger generates title tags to boost your blog's Search engine marketing.  Study these posts prior to deciding to go any even further!

For showing impression; make certain your initially image in you blog put up is significant adequate for the social medias. For Facebook it ought to be at least 200px X 200px and for Google In addition it ought to be the peak should be no less than 120px, and Should the width is lower than 100px.

The custom made picture only appears Once your blog's household site is shared. Blogger posts that contains photos inside the write-up won't be impacted by this tag when shared.

What we are going to be accomplishing is telling Blogger accurately how to manage the TITLE, META DESCRIPTION, and OG tags on 1. your blog's house page and a couple of. your blog's a variety of posts and webpages.  We will try this through the use of IF statements. 

Yup I am in the identical boat as the last person. I adopted all directions and it nevertheless is not fixed. SO pissed off. After i run the debugger it exhibits about forty pics and Once i attempt exam putting up to How to Add Open Graph Protocol in Blogger Blog Facebook it randomly grabs and image. Usually that picture is of another human being.

STEP five: When you've got misplaced the tags then you won't begin to see the image you're going to get warning over the debugger site the impression tag is missing.

In above code, substitute Emblem URL while in the thirteenth line Along with the URL within your blog’s symbol. Also don’t ignore to deliver your software ID and profile ID in the 18th and nineteenth strains.

At past information we sucesfully incorporate a crucial meta tags for Blogger, but we need a open graph protocol for scraping and previewing on social media internet sites.

I already defined you over whenever you incorporate this tags inside your template inside the header portion then your blog will likely be structured in an appropriate way when shared on Social Web pages.

Suppose I'm sharing this publish’s backlink on my Facebook-website page; my friends on Fb will likely not like and click the connection if that share-publish do not have wealthy information that’s essential to be aware of what they are going to get from that url.

og:graphic Is only equipped if Blogger finds a picture in the current publish. On the other hand, not giving og:picture is invalid. You might deliver an alternate image within your blog brand, or possibly a Gravatar.

five.  How to set your individual image URL on the homepage for your personal open graph meta tags -     *Produce a new write-up      * Upload the image you wish to Exhibit      *Duplicate the URL of the picture by deciding on the impression      *Paste the homepage graphic URL in The situation talked about in stage 4.

OH MY GOD. Dude, thank you soooo Substantially!! I have been searching for your put up all day long. I have been getting a concept mistake: og:graphic couldn't be downloaded or is simply too tiny.