Add Twitter Tweet Button Just Below Of Every Blogger Post - Helper Blogger

Blogger Widgets | Templates | Tutorials

Latest

Friday 27 April 2012

Add Twitter Tweet Button Just Below Of Every Blogger Post



Twitter is one of the largest social media company in the world.If you have enough number of followers on twitter then every time tweet your new post on twitter and get the traffic.Today in this article we are going to show to How to add Twitter tweet button with counter for blogger ? Here we are giving code of all types of tweet buttons i.e. tweet button with vertical count,tweet button with horizontal count and tweet button without any count.We will add this button just below of every blogger posts for more traffic.

How To Add Twitter Tweet Button To Blogger?


Here we are giving all types of twitter tweet button choose anyone of them add add them just after below code.To find below code you need to "Tick the Expand Widget Templates" check box.Also take backup your template before making any changes.

<data:post.body/>

Tweet Button Styles

You can add tweet button in three styles :

  1. Vertical Count
  2. Horizontal Count
  3. Without Count

1. Vertical Count


<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<div style='text-align:left;padding:5px 5px 5px 0;'>
<a class='twitter-share-button' data-count='vertical' expr:data-text='data:post.title' expr:data-url='data:post.url' data-via='helperblogger' data-related='' href='http://twitter.com/share'>Tweet</a>
<script src='http://platform.twitter.com/widgets.js' type='text/javascript'></script>
</div>
</b:if>

2. Horizontal Count



<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<div style='text-align:left;padding:5px 5px 5px 0;'>
<a class='twitter-share-button' data-count='horizontal' expr:data-text='data:post.title' expr:data-url='data:post.url' data-via='helperblogger' data-related='' href='http://twitter.com/share'>Tweet</a>
<script src='http://platform.twitter.com/widgets.js' type='text/javascript'></script>
</div>
</b:if>

3. Without Count


<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<div style='text-align:left;padding:5px 5px 5px 0;'>
<a class='twitter-share-button' data-count='none' expr:data-text='data:post.title' expr:data-url='data:post.url' data-via='helperblogger' data-related='' href='http://twitter.com/share'>Tweet</a>
<script src='http://platform.twitter.com/widgets.js' type='text/javascript'></script>
</div>
</b:if>

now replace helperblogger with your twitter username.

Customizations (Options)



  • This button is aligned to left of page if you want to align it to right or middle then replace text-align:left; with text-align:right; and text-align:center; respectively.


  • This button will visible on below of post if you want to add it before the post then add code just above of <data:post.body/>

Now save your template and you are done.If you have any problem or query then feel free to ask me.I will always there for my buddies...

13 comments:

  1. HELPFUL :) THANKS !
    thankyou very much,Respect to you ;)

    ReplyDelete
    Replies
    1. It's my pleasure Shalvika.Also feel free to ask me about any gadgets or blogger help.

      Delete
  2. Really awesome site bro........keep it up

    ReplyDelete
    Replies
    1. Thanks Bro for your feedback.Your comments are really encouraging me for my further work....

      Delete
  3. Thank you very much for sharing so many ideas. I've given you credit in my page.

    Great work and please keep up the good work.

    ReplyDelete
  4. Is there is nice way to display facebook like button and twitter share button in same line. I've used your codes. But I got those buttons in two lines. :(
    Any help??????

    ReplyDelete
  5. FAB, thank you so much. I've added both the FB and Twitter counters to my page, they look great. Thanks so much for this very easy to implement advice. A beginner like me is very grateful to people like yourself who are happy to share :)

    Just a little question if I may though, I see that the counter buttons appear on the post page itself but not on the blog homepage where all the posts appear one after the other. Is there a way to have the counters appear on the blog home page as well? I give you the two links below so you can see what I mean. Note: I've added the counters at the end of the post. And it's ok if this isn't possible, I just thought I ask :)

    - http://nestpearls.blogspot.fr/ (no counter appearing after each post)
    - http://nestpearls.blogspot.fr/2012/10/humble-dreams-of-parisian-loft.html (counters appearing after post)

    Thanks so much in advance,
    B

    ReplyDelete
  6. Hi, how can i have the twitter and facebook like button in one line?

    thanks - look at my blog @ www.escapemanila.com - the fb and twitter are on different lines :(

    ReplyDelete
  7. doesn't work? i have 3 < data:post.body/ > on my blog. where i put it? plzz help me :(

    ReplyDelete
  8. Thank you very much for sharing so many ideas.
    Load Systems

    ReplyDelete
  9. hello, this is exactly what i need in my blog. i have searched and searched in blogger dashboard, but i cannot find "Tick the Expand Widget Templates" - please tell me where it is! :) thanks

    ReplyDelete

If you want to be informed about any replies then check "Notify me" option (present at lower right corner of comment box and it will display if you are logged in to your google account). PLEASE DO NOT SPAM