Monday, 17 March 2014

How to Add Facebook Like Button To Blogger Posts




  • Horizontal Count Button
  • Vertical Count Button
  • Without Count Button


  • First Go To Blogger Dashboard ->Template 
  • Click  Edit HTML
  • Now Find the Code which look like <data:post.body/>
  • This code may comes 2 or 3 times. Try it on which comes at 2nd. If Facebook button works and appear in post then all right otherwise try it on other left codes
  • Now choose Your Style from below three codes and Paste Just After/Below the Code <data:post.body/>

      Horizontal Like Button

      Facebook Like Button
      
      <b:if cond='data:blog.pageType != &quot;static_page&quot;'> <iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.canonicalUrl + &quot;&amp;send=false&amp;layout=button_count&amp;show_faces=false&amp;width=90&amp;action=like&amp;font=arial&amp;colorscheme=light&amp;height=21&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:90px; height:21px;'/> </b:if>
      
      

      Vertical Like Button

      Facebook Like Button
      
      <b:if cond='data:blog.pageType != &quot;static_page&quot;'> <iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.canonicalUrl + &quot;&amp;send=false&amp;layout=box_count&amp;show_faces=false&amp;width=55&amp;action=like&amp;font=arial&amp;colorscheme=light&amp;height=62&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:55px; height:62px;'/> </b:if> 
      
      

      Without Cout Like Button

      Facebook Like Button
      
      <b:if cond='data:blog.pageType != &quot;static_page&quot;'> <iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.canonicalUrl + &quot;&amp;send=false&amp;layout=standard&amp;show_faces=false&amp;width=450&amp;action=like&amp;font=arial&amp;colorscheme=light&amp;height=35&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:35px;'/> </b:if>
      
      

      • After pasting your favorite code from about three codes then save your template settings

    0 comments:

    Post a Comment