How To Fix Facebook Thumbnail Issue on Blogger

Today we will learn how to add Open Graph to our Blogspot theme and fix Facebook thumbnail issue on Blogger. so that when our articles are shared on social media, their accompanying photographs will always appear. Please adhere to the advice provided below for fixing the Facebook thumbnail issue with Blogger. You can also read my previous post on How to Remove Sora Templates Footer Credit.

How To Fix Facebook Thumbnail Issue on Blogger

1. Log in to your Dashboard
2. Go to Layout –> Edit HTML
3. Click anywhere inside the code area and to open a search box type CTRL+F from the keyboard.
4. Type or paste the following code into the search box and hit enter.
5. </head>
6. Now Copy the following code and paste it before the above line:

Facebook OpenGraph Tags Code For Blogger

<!– Facebook OpenGraph –>

<meta content=’article’ property=’og:type’/>

<meta expr:content=’data:blog.title’ property=’og:site_name’/>

<!– Title, URL & Description –>

<meta expr:content=’data:blog.pageName’ property=’og:title’/>

<meta expr:content=’data:blog.canonicalUrl’ property=’og:url’/>

<b:if cond=’data:blog.metaDescription’>

<meta expr:content=’data:blog.metaDescription’ name=’og:description’/>

<b:else/>

<meta expr:content=’data:post.snippet’ name=’og:description’/>

</b:if>

<!– Image –>

<b:if cond=’data:blog.postImageUrl’>

<meta expr:content=’data:blog.postImageUrl’ property=’og:image’/>

<meta property=’og:image:width’ content=’1200’/>

<meta property=’og:image:height’ content=’630’/>

</b:if>

<!– FB specific –>

<meta content=’YOUR_FACEBOOK_ID’ property=’fb:admins’/>

<meta content=’YOUR_APP_ID’ property=’fb:app_id’/>

NOTE:

Replace YOUR_FACEBOOK_ID with your Facebook App ID Admin Name.

Replace YOUR_APP_ID with your Facebook App ID Code.

ALSO READ: How To Upload Tiktok Video To Facebook Without Copyright

How To Create Facebook App/ App ID

Create Facebook app with these simple steps I have written below to generate your facebook app ID

1. Go to Facebook developer tab and click on it.
2. LINK ⇒ https://developers.facebook.com
3. Then go to Website Option.
4. Enter the app name which you have wanted.
5. Click on Create Facebook App.
6. After this you have to choose a category, you can choose an App for Pages.
7. Your App Id and App key are created automatically. The App Secret Key is asterisk. You can click on the show button to see your App Id and App Security Key.

How To Fix Twitter Thumbnail Issue on Blogger

 To fix twitter thumbnail issue on blogger, copy the code below and paste it in your theme before the </head> tag

<!– Twitter Card –>

<meta content=’summary_large_image’ name=’twitter:card’/>

<!– Title, URL & Description –>

<meta expr:content=’data:blog.pageName’ name=’twitter:title’/>

<meta expr:content=’data:blog.url’ name=’twitter:url’/>

<b:if cond=’data:blog.metaDescription’>

<meta expr:content=’data:blog.metaDescription’ name=’twitter:description’/>

<b:else/>

<meta expr:content=’data:post.snippet’ name=’twitter:description’/>

</b:if>

<!– Image –>

<b:if cond=’ data:blog.postImageUrl’>

<meta expr:content=’ data:blog.postImageUrl’ name=’twitter:image’/>

<meta property=’twitter:image:width’ content=’280’/>

<meta property=’twitter:image:height’ content=’150’/>

</b:if>

<!– Twitter specific –>

<meta content=’SITE-TWITTER-HANDLE‘ name=’twitter:site’/>

<meta content=’YOUR-TWITTER-HANDLE‘ name=’twitter:creator’/>

NOTE:

Replace SITE-TWITTER-HANDLE with your link to your Twitter Handle.

Replace YOUR-TWITTER-HANDLE with your Twitter Username.