Friday, March 2, 2012

How to add Twitter Tweet Button for every blog posts


Twitter Tweet Button we use to tweet any post or article easily. There are lots of articles on the web to learn how to add a tweet it button. If you want to add a twitter button for the website, then it's okay. But if you want to add twitter button for every single post of the website that will count the number of tweets of every single post, then it is a little bit of difficult. After adding the twitter button you will notice that all the button's counting are same. That's why I have customized the codes so that the button can count the number of the tweets of every post.
 Step 01  Log in to your blogger account first
First of all you need to log in to your blogger account. Then click on Template from the left side menu bar.

 Step 02  Click on the Edit HTML button
Now click on the Edit HTML button as shown in the image below. Now click into the codes and press Ctrl+F buttons together to open the Search Box. Type <div class='post-header-line-1'/> into the Search Box and press the Enter Key to find out them if you want to show the tweet button just after post header/title.

Otherwise find out <data:post.body/> if you want to show the twitter button at the end of every post/article. Now paste the codes given below after <data:post.body/> or <div class='post-header-line-1'/>

<b:include data='post' name='shareButtons'/>
<a class='twitter-share-button' data-dnt='true' data-url='http://www.idhali.com' data-via='LaxmicharaChele' expr:data-text='data:post.title' expr:data-url='data:post.url' href='https://twitter.com/share'>Tweet</a>
<script>
!function(d,s,id){
var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id))
{
js=d.createElement(s);js.id=id;js.src= &quot;//platform.twitter.com/widgets.js&quot;;fjs.parentNode.insertBefore(js,fjs);
}
}
(document,&quot;script&quot;,&quot;twitter-wjs&quot;);
</script>
</b:if>

 Step 03  Customize the codes for your own blog
Now replace the URL http://www.idhali.com with your own blog's homepage URL and replace the user name LaxmicharaChele with your twitter username. Finally click on the button Save Template to save the changes and reload your blog/website to check the Twitter Tweet Button.


2 comments:

  1. it very helpful post to blogger to add twitter button and video is good quality and explanation is good

    ReplyDelete
    Replies
    1. Thanks a lot Kuldeep Birwal for your Constructive Comment!
      Hope the other visitors will Comment like you!! :)

      Delete