Saturday, 13 April 2013

how to add facebook like button in blogger


WELCOME TO VINAY SABHARWAL BLOG FOR MORE INFORMATION JOIN THIS SITE

Steps

  1. 1
    Go to the "Facebook Developers" page:http://developers.facebook.com/docs/reference/plugins/like.

  2. 2
    Set the options you want.
     Set the options you want.
    Set the options you want. Specifically, select whether you want a "Like" or a "Recommend" button. The sample button on the page will automatically update to reflect your selections.
  3. 3
    Leave the "URL to Like" field blank.
     Leave the "URL to Like" field blank.
    Leave the "URL to Like" field blank. You will be replacing that soon.
  4. 4
    Click "Get Code".
     Click "Get Code".
    Click "Get Code". You will see something that looks like this:


    <iframe src="http://www.facebook.com/plugins/like.php?href=
    

    http%253A%252F%252Fexample.com%252Fpage%252Fto%252Flike&layout=standard&
    

    show_faces=false&width=450&action=like&colorscheme=light"
    

    scrolling="no" frameborder="0" allowTransparency="true" style="border:none;
    

    overflow:hidden; width:450px; height:px"></iframe>
    
  5. 5
    Replace the following text:
    • src= above with:
      expr:src='
      
    • http%253A%252F%252Fexample.com%252Fpage%252Fto%252Flike&layout part with:
      " + data:post.url + "&layout
      
    • light" with:
      light"'
      
      -- notice the new trailing apostrophe
    • height:px with:
      height:35px
      
      -- otherwise, Firefox will make the iframe really big.
    • Leave a copy of the final code somewhere accessible for you to transfer to Blogger.
  6. 6
    Go to your Blogger Dashboard.
     Go to your Blogger Dashboard.
    Go to your Blogger Dashboard.
  7. 7
    Open your blog's layout and click Edit HTML.


  8. 8
    Back up your template! Do this by clicking Download Full Template.


  9. 9
    Check Expand Widget Templates.


  10. 10
    Find a place to put the Facebook "Like" code into your HTML layout. A good location is directly after or below:
    <div class='post-footer'>
    
    • Use the browser "Find" mechanism to help you locate it.
  11. 11
    Save and check that the button has appeared. Once you can see it, you're done!



EditTips

  • As of May 16, 2010 this feature is only available in the English language.

  • Always back up your blog's template before making changes to its layout!
  • It is recommended that you keep "Show Faces" unchecked and use the "button_count" layout. Otherwise, less-savvy users who did not configure their privacy settings properly may be turned off by their profiles appearing on your blog after "Liking" it.

EditThings You'll Need

  • Blogger account
  • Facebook account

0 comments:

Post a Comment

like us on facebook

 
© 2013 techshelve . Designed by Making Different , provided by All Tech Buzz, Powered by Blogger