Google search engine
HomebloggingHow to add Facebook Share Button to Blogger Posts with Pictures

How to add Facebook Share Button to Blogger Posts with Pictures

 Hello guys welcome to the Dhakdhai Gyan Tutorial today I will show you how to insert add Facebook Share button To every Blogger blog Posts with pictures.

How to add Facebook Share Button to Blogger Posts with Pictures

Facebook is the largest Social Media website in the world. Here we know every person have good enough number of friends on Facebook then some of visitor can share the post on the Facebook via Facebook share button then it will get a good traffic on the blog.


These are Following Steps:-
Step 1Go to developers.facebook.com link and select Facebook Share Button Layout then Click Get Code button.
Add Facebook Share Button To Every Blogger Posts 1

Step 2: Copy first Code.

Add Facebook Share Button To Every Blogger Posts 2

Step 3: Go to Blogger Theme and Click Edit HTML button.

Add Facebook Share Button To Every Blogger Posts 3

Step 4: Click around the Code Press Ctrl+F type <body> then Past the First Code in <body> tag. Fix Facebook XML Code Error In Blogger.

Add Facebook Share Button To Every Blogger Posts 4
<div id=”fb-root”></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = “//connect.facebook.net/en_GB/sdk.js#xfbml=1&version=v2.8”;
fjs.parentNode.insertBefore(js, fjs);
}(document, ‘script’, ‘facebook-jssdk’));</script>

Step 5: Again Press Ctrl+F type <data:post.body/> then Hit Enter Two Time and Paste <div> Code below <data:post.body/> tag. Click Save template button.

Add Facebook Share Button To Every Blogger Posts 5
<div class=”fb-share-button” data-href=”https://developers.facebook.com/docs/plugins/” data-layout=”button” data-size=”small” data-mobile-iframe=”true”><a class=”fb-xfbml-parse-ignore” target=”_blank” href=”https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fdevelopers.facebook.com%2Fdocs%2Fplugins%2F&amp;src=sdkpreparse”>Share</a></div>

Step 6: Open you Blogger Blog.


RELATED ARTICLES

LEAVE A REPLY

Please enter your comment!
Please enter your name here

- Advertisment -
Google search engine

Most Popular