Have you noticed that sometimes whenever we get to share some of our posts on whatsapp, we discover that there will be no image preview like how that of facebook is but youll also see some shared posts of some other people showing image preview on whatsapp.
The problem is due to wrong “og:image” tags in your template <head> section.
To resolve this issue, you have to copy and paste the below piece of code in the head section of your template
now copy & paste below open graph tags just above the closing of your template’s head tag i.e., </head>
To resolve this issue, you have to copy and paste the below piece of code in the head section of your template
Follow these steps to add new "og tags" to your template:
Go to Blogger Dashboard > Template > Edit HTML and search for </head>now copy & paste below open graph tags just above the closing of your template’s head tag i.e., </head>
<b:if cond='data:blog.pageType == "index"'>
<meta expr:content='data:blog.title' property='og:site_name'/>
<meta content='en_US' property='og:locale'/>
<meta content='en_GB' property='og:locale:alternate'/>
<meta expr:content='data:blog.canonicalUrl' property='og:url'/>
<meta expr:content='data:blog.pageTitle' property='og:title'/>
<meta content='blog' property='og:type'/>
<b:else/>
<meta expr:content='data:blog.title' property='og:site_name'/>
<meta content='en_US' property='og:locale'/>
<meta content='en_GB' property='og:locale:alternate'/>
<meta expr:content='data:blog.canonicalUrl' property='og:url'/>
<meta expr:content='data:blog.pageName' property='og:title'/>
<meta content='article' property='og:type'/>
</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>
<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='YOUR_BLOG_LOGO_IMAGE_HERE' property='og:image'/>
</b:if>
</b:if>
Result would like this:
image source: https://www.macstories.net
Credit: https://fulfilmyrequest.blogspot.com
Post a Comment