Saturday, May 5, 2012

How to add a Facebook "Like" button to your Blogger posts

This is a short tutorial with 7 steps that teaches you how to embed a Facebook "Like" button to each of your Blogger posts.

If you completed the 7 steps successfully, you will be able to see a "Like" button that looks like the one below.

Interested to know how? Its easy, so read on!

A Facebook "Like" button at the end of a Blogger post

Step 1
  1. Log in your Blogger Account
  2. Go to Blogger Dashboard. 
  3. Click on your Blog Title.
  4. Navigate to Template tab.
Step 2
  1. Click on Edit HTML button
  2. Click Proceed button to view Template Editor.

    Step 3
    1. Check  "Expand Widget Templates"

      Step 4
      1. Type "Ctrl-F" to look for the keywords "<data:post.body/>" in the template

      Step 5
      1. Once you have located the position of "<data:post.body>", refer to the screenshot above to add the code below at the correct position
          <iframe allowTransparency='true' expr:src='&quot;; + data:post.url + &quot;&amp;layout=button_layout&amp;show_faces=false&amp;width=100&amp;action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:40px;'/>

      Step 6
      1. Click the "Save Template" button

      Step 7
      1. Visit your blog to view the changes!

      Pin It

      No comments:

      Post a Comment