Home » » Add Google+ Button & Social Networking Buttons Below Post Title

Add Google+ Button & Social Networking Buttons Below Post Title

  • Add [a href="http://www.mybloggertricks.com/2011/06/add-1-button-and-other-share-buttons.html" target="_blank"]Social Share Buttons[/a] To Blogger

Adding Social Networking Buttons To Blogger

  1. Go To Blogger > Design > Edit HTML
  2. Backup your template
  3. Search for <data:post.body/>
  4. and just above it paste the code given below,

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<table border='0'>

<tr> <td> <a class='twitter-share-button' data-count='horizontal' data-lang='en'  data-via='mybloggertricks' expr:data-text='data:post.title' expr:data-url='data:post.url' href='http://twitter.com/share' rel='nofollow'/> <b:if cond='data:post.isFirstPost'> <script src='http://platform.twitter.com/widgets.js' type='text/javascript'> </script> </b:if> </td>

<td> <iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=button_count&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; margin-left:20px; width:100px; height:20px;'/> </td>

<td><div style='margin-right:25px;'> <script expr:src='&quot;http://www.stumbleupon.com/hostedbadge.php?s=1&amp;r=&quot; + data:post.url'/></div> </td>

<td><div style='margin-right:5px;'> <g:plusone expr:href='data:post.url' size='medium'/> </div> </td>

<td> <!-- AddThis Button BEGIN --> <div class='addthis_toolbox addthis_default_style '> <a class='addthis_counter addthis_pill_style'/> </div> <script src='http://s7.addthis.com/js/250/addthis_widget.js' type='text/javascript'/>

<script type='text/javascript'> var addthis_config = { ui_cobrand: &quot;MY BLOGGER TRICKS&quot;, ui_header_color: &quot;#ffffff&quot;, ui_header_background: &quot;#0080FF&quot; } </script> <!-- AddThis Button END --></td>

</tr> </table>

</b:if><br/>

 

Replace mybloggertricks your twitter username.

5.  Note: If you have previously added the +1 button then you may skip this step. Now search for </head> and just above it paste the following code,

<script src='http://apis.google.com/js/plusone.js' type='text/javascript'> {lang: &#39;en-US&#39;} </script>

6.   Save your template and visit your blog to see it appearing on post pages. The widget will not be visible on homepage but on post pages only. If you want to show it on homepage too then delete the highlighted yellow lines.

    

Have fun! :>

Feel free to ask any questions you may have.

Source: http://www.mybloggertricks.com/2011/07/add-google-button-social-networking.html

0 comments :

Post a Comment

 
Play : Agame | Y8 Games | Y3 Games
Copyright © 2011. Blogger Tips And Tricks 2012 - All Rights Reserved

Proudly powered by Blogger