Blogger Tips

Add Twitter Retweet Button to Blogger

Did you know that Twitter can help drive traffic to your Blogspot blog? In today's Blogger tutorial I show you how to add a free Twitter Retweet button to your Blogger posts. Adding a Tweetmeme Twitter Retweet button to Blogger will help promote your blog on Twitter in 2 ways: one by attracting new Twitter followers and two by increasing the direct traffic to your blog from Twitter.

Forget the preamble and take me straight to the instructions to insert the Retweet button into Blogger

What is Twitter and How Does it Work?
Twitter is currently the fastest growing free social networking site. Essentially, Twitter users micro blog about what they are doing or what others are doing by posting tweets of around 140 characters to Twitter. When Twitter members read these tweets and like what they read they can become followers much in the same way that your readers can choose to follow your blog.

Twitter is great news for bloggers because it can be used as a vehicle to promote blogs. Blogger can easily be linked with Twitter services so that every time a post is made to Blogger a short message with a link is posted on Twitter. As every follower is notified that you have tweeted, a blog publisher can gain lots of exposure for their blog with very little effort.

Once you add Tweetmeme retweets to the mix the spread compounds because not only do you have followers hearing about your tweet but the followers of followers. So say one of your followers retweets your post all that person's followers hear about it too and pretty soon a tweet plus your retweets can popularize a post to the point that it spreads so widely that it goes viral.

Advantages of a Twitter Retweet Button
A Tweet/Retweet button looks similar to and behaves like an integrated Digg button but it counts retweets rather than diggs. A Retweet button counts reposts of a tweet so that readers can see at a glance how popular your article is on Twitter. Another benefit of the Retweet button is that it allows your blog readers to retweet your post so that their followers hear about your post too.

How to Add a Twitter Retweet Button to a Blogger Blog (Blogspot Blog)
The following instructions will place a Tweetmeme Retweet button into all of your blog posts.

Login to Blogger if not already logged in
From the Dashboard navigate to Layout > Edit HTML
Check the Expand Widget Templates button
Back up your Blogger template by clicking on Download Full Template as a precaution
Using CTRL + F find the following code:

<div class='post-header-line-1'/>

Directly after the above line paste the following code depending on which Retweet button and position you prefer:

Large Retweet Button - Right Aligned

<div /><script type="text/javascript">
tweetmeme_url = '<data:post.url/>'; 
tweetmeme_source = 'your_twitter_user_name';
</script>
<script type="text/javascript" src="http://tweetmeme.com/i/scripts/button.js">
</script> </div>

Large Retweet Button - Left Aligned

<div /><script type="text/javascript">
tweetmeme_url = '<data:post.url/>'; 
tweetmeme_source = 'your_twitter_user_name';
</script>
<script type="text/javascript" src="http://tweetmeme.com/i/scripts/button.js">
</script> </div>

Compact Retweet Button - Right Aligned
Retweet Compact Button - How to add to Blogger

<div /><script type="text/javascript">
tweetmeme_style = 'compact'; 
tweetmeme_url = '<data:post.url/>'; 
tweetmeme_source = 'your_twitter_user_name';
</script>
<script type="text/javascript" src="http://tweetmeme.com/i/scripts/button.js">
</script> </div>

Compact Retweet Button - Left Aligned
Retweet Compact Button - How to add to Blogger

<div /><script type="text/javascript">
tweetmeme_style = 'compact'; 
tweetmeme_url = '<data:post.url/>'; 
tweetmeme_source = 'your_twitter_user_name';
</script>
<script type="text/javascript" src="http://tweetmeme.com/i/scripts/button.js">
</script> </div>

Change your_twitter_user_name for your actual Twitter username. For instance I would enter BlogWizz
Click on Save Template
Click on View blog to admire your Tweetmeme Retweet button in your Blogger posts

Tips and Troubleshooting

To Add Retweet Button Below Blogger Post
If you want the button to appear at the bottom of Blogger posts instead of just below the post title locate the first instance of the following code and then paste the code for your chosen button immediately after this line: (don't forget to change your Twitter username as in Step 7)
```
<data:post.body/>
```
To Have the Retweet Button Appear on Post Pages Only in Blogger
If you want the button to only appear on the post pages and not the home page you will need to enclose the button code in an if statement. See below for an example of what the full code would look like with this extra code.
```
<b:if cond='data:blog.pageType == "item"'>
</b:if>
```
Thus the full code for a right-aligned large Retweet button which only appears on the individual post pages and not the home page would be:
```
<b:if cond='data:blog.pageType == "item"'>
<div /><script type="text/javascript">
tweetmeme_url = '<data:post.url/>'; 
tweetmeme_source = 'your_twitter_user_name';
</script>
<script type="text/javascript" src="http://tweetmeme.com/i/scripts/button.js">
</script> </div>
</b:if>
```

In this tutorial you have learned how to add a Tweetmeme Retweet Button to your Blogger posts. The Retweet button will encourage your blog readers to retweet your content on Twitter thereby increasing your blog traffic. I have provided the code for both a large and compact button with the option of left or right alignment. The button appears just below the post title and counts the number of retweets of your Blogger post. I have also included details of how to add the Tweetmeme Retweet button to the foot of your Blogger blog and how to add the button to post pages only.

Related Articles
List of Blog Know How Tutorials for Blogger Blogs
Tips to Add a Digg Button to Blogger Blogspot
Add a Twitter Updates Widget to Blogger
Add Twitter Button or Twitter Badge to Blogger
Add Twitter Followers Counter to Blogger
Add a Social Bookmarking Button to Blogger
Add Social Bookmark Buttons to Blogger
Best Free Social Bookmark Icon Sets for Blogger

- Add Floating Social Media Sharing Buttons Below Blogger Post Titles
It is becoming increasingly important to make our posts appreciated and shared on social networks and one of the best ways to get traffic to our blog/website and boost sharing stats is to add social sharing buttons. In this tutorial we will see how to...

- Add Social Bookmarking Buttons Near Adsense Ads
The main advantages of this widget is that you can increase your AdSense impressions along with CTR - and of course, fill up the empty space besides Adsense units, making your blog look more attractive. Adding the social bookmarking buttons at the top...

- Add A Twitter Profile Widget To Blogger
If you use Twitter then you are going to want to let your Blogger readers know about it. One effective way to show your Twitter updates on Blogger is to add a Twitter profile widget to the sidebar of your blog. This widget is quite a bit more fancy than...

- Add A Twitter Followers Counter To Blogger
In this tutorial you will learn how to place a Twitter Follower Counter on your Blogger Blogspot blog to display the number of followers you have on Twitter. A Twitter count button will encourage readers to follow you on Twitter much in the same way as...

- Tips To Add A Digg Button To Blogger Blogspot
Today's article discusses where to place a digg.com button on your Blogspot Blogger blog and shows you how to add an integrated digg button to your blog. The button allows your blog's visitors to digg posts from your blog and submit those articles...

Blogger Tips