Add Facebook Like, Send, Share button to blogger posts

Facebook is a popular social networking website which provides lots of traffic to millions of websites or blogs. You can also use the power of social media traffic into your blog by adding facebook widgets in your blog. In this guide we will discuss about adding facebook buttons to blogger posts. You will learn how to add different facebook buttons such as share buttons, like button or send button at different locations in blogger posts. In this guide we will add these buttons below blogger posts and below post titles also. You can add these facebook buttons to your blog according to your requirement.

Facebook is a popular social networking website which provides lots of traffic to millions of websites or blogs. You can also use the power of social media traffic into your blog by adding facebook widgets in your blog. In this guide we will discuss about adding facebook buttons to blogger posts. You will learn how to add different facebook buttons such as share buttons, like button or send button at different locations in blogger posts. In this guide we will add these buttons below blogger posts and below post titles also. You can add these facebook buttons to your blog according to your requirement.










Facebook share button - The Share button lets people add a personalized message to links before sharing on their timeline, in groups, or to their friends via a Facebook Message.
Facebook send button - The Send button lets people privately send content on your site to one or more friends in a Facebook message, to an email address, or share it with a Facebook group.
Facebook like button - The Like button is the quickest way for people to share content with their friends. A single click on the Like button will ‘like’ pieces of content on the web and share them on Facebook. You can also display a Share button next to the Like button to let people add a personal message and customize who they share with.


Add facebook like button below blogger posts

Note: In every blogger template <data:post.body/> has more than one occurrences. If the following method does not work with the first<data:post.body/> then try the same method with next <data:post.body/>and so on.
Step 1: Login to your blogger dashboard and select your blog.
Step 2: Select Template option and Click on Edit HTML.
Step 3: In the template code find  <data:post.body/>
Step 4: Paste following code just below the above code and save the template.
<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_US/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div style='margin-bottom:20px' class="fb-like" data-layout="standard" data-action="like" data-show-faces="false" data-share="false"></div>
 Customize Like button – Change value of data-share=”false” to data-share=”true” to show both like and share buttons.

Add Facebook like button below posts titles in blogger

Step 1: In the template code find <data:post.body/>
Step 2: Paste following code just above it and save the template.
<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_US/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div style='margin-bottom:20px' class="fb-like" data-layout="standard" data-action="like" data-show-faces="false" data-share="false"></div>

Add Facebook share button below blogger posts

Step 1: Select Template option and Click on Edit HTML option.
Step 2: In the template code find <data:post.body/>
Step 2: Paste following code just below it and save the template.
<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_US/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
        <div style='margin-bottom:20px' class="fb-share-button" data-type="button_count"></div>

Add Facebook share button below post titles

Step 1: In your blogger dashboard select your blog.
Step 2: Select Template option and click on Edit HTML.
Step 3: In the template code find <data:post.body/>
Step 4: Paste following code just above it and save the template.
<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_US/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div style='margin-bottom:20px' class="fb-share-button" data-type="button_count"></div>

Add Facebook send button below blogger posts

Step 1: Open your blogger dashboard and select your blog.
Step 2: Select Template option and click on Edit HTML option.
Step 3: In your template code find <data:post.body/>
Step 4: Paste following code just below it and save the template.
<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_US/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
        <div style='margin-bottom:20px;' class="fb-send" data-colorscheme="light"></div>

Add facebook send button below post titles

Step 1: In your Template code find <data:post.body/>
Step 2: Paste following code just above it and save the template.
<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_US/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
        <div style='margin-bottom:20px;' class="fb-send" data-colorscheme="light"></div>

COMMENTS

Name

Blogger Templates,5,Blogger Tips,31,Blogger Widgets,9,Computer Tricks,3,Downloads,30,WordPress Tricks,5,
ltr
item
Trickz Bucket: Add Facebook Like, Send, Share button to blogger posts
Add Facebook Like, Send, Share button to blogger posts
Facebook is a popular social networking website which provides lots of traffic to millions of websites or blogs. You can also use the power of social media traffic into your blog by adding facebook widgets in your blog. In this guide we will discuss about adding facebook buttons to blogger posts. You will learn how to add different facebook buttons such as share buttons, like button or send button at different locations in blogger posts. In this guide we will add these buttons below blogger posts and below post titles also. You can add these facebook buttons to your blog according to your requirement.
http://1.bp.blogspot.com/-u7gWB-lzsPs/VQRT3EzzA4I/AAAAAAAAB1g/hN6SJ27HeF0/s1600/new-raw5.jpg
http://1.bp.blogspot.com/-u7gWB-lzsPs/VQRT3EzzA4I/AAAAAAAAB1g/hN6SJ27HeF0/s72-c/new-raw5.jpg
Trickz Bucket
http://www.trickzbucket.com/2015/03/add-facebook-like-send-share-button-to.html
http://www.trickzbucket.com/
http://www.trickzbucket.com/
http://www.trickzbucket.com/2015/03/add-facebook-like-send-share-button-to.html
true
6195765242120428356
UTF-8
Loaded All Posts Not found any posts VIEW ALL Readmore Reply Cancel reply Delete By Home PAGES POSTS View All RECOMMENDED FOR YOU LABEL ARCHIVE SEARCH ALL POSTS Not found any post match with your request Back Home Sunday Monday Tuesday Wednesday Thursday Friday Saturday Sun Mon Tue Wed Thu Fri Sat January February March April May June July August September October November December Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec just now 1 minute ago $$1$$ minutes ago 1 hour ago $$1$$ hours ago Yesterday $$1$$ days ago $$1$$ weeks ago more than 5 weeks ago Followers Follow THIS CONTENT IS PREMIUM Please share to unlock Copy All Code Select All Code All codes were copied to your clipboard Can not copy the codes / texts, please press [CTRL]+[C] (or CMD+C with Mac) to copy