How to Overcome Blog Images Not Appearing When Sharing on Facebook

Nilesh    9/27/2020    Blogger Trick , JQuery   

 Back again with my Showdzgn admin, now on this occasion I will share a tutorial on how to fix blog images not appearing when sharing  on Facebook . Sometimes we get annoyed because when we share a blog or article url, the thumbnail of the article that we create doesn't appear. Instead, a Tang image appears, instead of a post image.

Why did this happen? Most likely this happened because your blog did not implement the og: facebook image meta tag and resulted in Thumbanail in Posts not appearing when sharing the Post url.

How to Overcome Blog Images Not Appearing When Sharing on Facebook

1. Please login to Blogger.com using your Gmail.
2. Go to the menu THEMES > click Edit HTML
3. Have you Paste the following code right ABOVE the code </ head>

<!-- Facebook Meta Tag Open Graph -->
<b:if cond='data:view.isHomepage'>
<b:if cond='data:view.isPost'>
<b:if cond='data:view.isPage'>
<b:if cond='data:blog.url'>
<meta expr:content='data:blog.url' property='og:url'/>
</b:if>
<meta expr:content='data:blog.title' property='og:site_name'/>
<b:if cond='data:blog.pageName'>
<meta expr:content='data:blog.pageName' property='og:title'/>
</b:if></b:if></b:if></b:if>
<meta content='blog' property='og:type'/>
<b:if cond='data:blog.postImageUrl'>
<meta expr:content='data:blog.postImageUrl' property='og:image'/>
<b:else/>
<b:if cond='data:blog.postImageThumbnailUrl'>
<meta expr:content='data:blog.postThumbnailUrl' property='og:image'/>
<b:else/>
<meta content='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1UMIYqiYFnwXs1jlUqOEZFN5QwiM9mlUMUA7Q_FzHSMxGS8TTefJcDTeInniG98Zw37VdH63-XgbxQ_hYs95r5mTGvndxU8uTSyaJ2GlfkmRipiDkvVWCLjsrvjCwXgdk8EA4nsGmJx1s/s75/Lain.jpg' property='og:image'/>
</b:if></b:if>
<b:if cond='data:blog.metaDescription'>
<meta expr:content='data:blog.metaDescription' property='og:description'/>
<b:else/>
<meta expr:content='data:post.snippet' property='og:description'/>
</b:if>
<meta expr:content='data:blog.title' property='og:site_name'/>
<meta content='https://www.facebook.com/XXXXXXXXXXXXXXX' property='article:author'/>
<meta content='https://www.facebook.com/XXXXXXXXXXXXXXX' property='article:publisher'/>
<meta content='XXXXXXXXXXXXXXX' property='fb:admins'/>
<meta content='1234567890123456' property='fb:app_id'/>
<meta content='en_US' property='og:locale'/>
<meta content='en_GB' property='og:locale:alternate'/>
<meta content='id_ID' property='og:locale:alternate'/>

• Please change the image link " https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1UMIYqiYFnwXs1jlUqOEZFN5QwiM9mlUMUA7Q_FzHSMxGS8TTefJcDTeInniG98Zw37VdH63-XgbxQ_hYs95r5mTGvndxU8uTSyaJ2GlfkmRipiDkvVWCLjsrvjCwXgdk8EA4nsGmJx1s/s75/Lain.jpg " With your Banner / logo image url. The result is if you share the blog homepage URL, the image that will appear is the image that you have set.

• Next, please replace XXXXXXXXXXXXXXX (There are 3 pieces) with your Facebook or Fanspage account ID.

• Please replace 1234567890123456 with your Facebook application ID.

For those of you who are confused about where to find a Facebook Application ID, you can search for the tutorial on Google.com with KW " How to Make Your Own Facebook Application ".

Then what if the image doesn't appear?

1. Please visit the Facebook Sharing Debugger

https://developers.facebook.com/tools/debug/sharing

2. Enter the URL of the Homepage or Article that you have.
3. Click the Debug button and click the Scrape Again button several times until the Thumbnail image appears.

How easy is it not for the tutorial  How to Overcome Blog Images Not Appearing When Sharing on Facebook , for those of you who have problems or questions about bloggers, please comment in the comments column below this article.