Best way to add Facebook open graph for blogspot

Adding Facebook open graph on Blogspot blogger

Many websites & blogs have used facebook open graph But Blogspot bloggers don't know how to add it properly.

Its looks like below image

How to add or implement it follow below instructions

Go to blogger.com and click on the theme in that go-to option edit Html 
Search for following code by using ctrl+f 
</head>
Just before it add the following code

<meta content='article' property='og:type'/> <b:if <span class="goog-spellcheck-word" id=":df.7" tabindex="-1" role="menuitem" aria-haspopup="true" style="background: yellow;">cond</span>='data:blog.<span class="goog-spellcheck-word" id=":df.8" tabindex="-1" role="menuitem" aria-haspopup="true" style="background: yellow;">url</span> == data:blog.homepageUrl'> <meta content='[homepage Image URL]' property='og:image'/> <meta content='[homepage Image Width]' property='og:image:width' /> <meta content='[homepage Image Height]' property='og:image:height' /> </b:if> <meta <span class="goog-spellcheck-word" id=":df.9" tabindex="-1" role="menuitem" aria-haspopup="true" style="background: yellow;">expr</span>:content='data:blog.title' property='og:site_name'/> <meta content='[<span class="goog-spellcheck-word" id=":df.10" tabindex="-1" role="menuitem" aria-haspopup="true" style="background: yellow;">Facebook</span> profile Id]' property='fb:admins'/> <b:if <span class="goog-spellcheck-word" id=":df.11" tabindex="-1" role="menuitem" aria-haspopup="true" style="background: yellow;">cond</span>='data:blog.<span class="goog-spellcheck-word" id=":df.12" tabindex="-1" role="menuitem" aria-haspopup="true" style="background: yellow;">pageType</span> == "item"'> <meta content='https://www.<span class="goog-spellcheck-word" id=":df.13" tabindex="-1" role="menuitem" aria-haspopup="true" style="background: yellow;">facebook</span>.com/username' property='article:author'/> </b:if> <meta content='en_US' property='og:locale'/>

After placing the above code in head tag then replace the values like below

1.(Home page image URL)

In the place of home page, image URL replace with your home page image URL.
Don't forget to remove brackets.

2.(Home page image width)

Replace width like 630 please don't use unformed width.

3.(Home page image height)

Replace height like 1200 etc..

4.(Facebook profile id)

Replace the Facebook id if you don't know facebook id you can search in Google for Facebook id finder.

5. In the place of facebook.com/username 

Replace with your Facebook page username.

That's all
Save template and post your URL in Facebook and view once
If you want to edit it go to Facebook debugger to Click here
And check as per your requirement.

Also, check how to add Twitter cards to Blogspot Blogger link 
https://metechtricks.blogspot.com/2019/10/adding-twitter-cards-on-blogger.html