How to add a Backtype retweet button to Blogger

Backtype is a service which tracks comments made by people on blogs and websites. Backtype also tracks tweets via Backtweets.
Like Tweetmeme, Backtype also has a retweet button for websites.

Backtype Retweet Button

Backtype button has the following advantages over tweetmeme:
1. The design is customizable (You can easily change the color and border of the button).
2. Backtype tracks retweets via twitter search and it’s tracking is more reliable than tweetmeme.
3. The starting text of each retweet is editable, i.e you can use text other than Rt @virtuosoblogger like #coffeeclub, via @virtuosoblogger etc.

The Advantages of Backtype button make it a probable choice for a retweet button.

Previously i wrote about How to add Retweet button to blogger

Here’s how you can add a backtype retweet button to blogger:

Follow these easy steps:
1. Go to Layout->Edit Html
2. Download Full Template (For backup purposes)
3. Check the Expand Widget Templates
4. Search for the code below:

<div class=’post-header-line-1′/>

Note: you can always look for a place to put your code that gives you the best results in terms of the look and the position of the button.

5. The backtype button has the following options to customize:

tweetcount_url: The URL to measure tweets for (Default: Current URL)
tweetcount_title: The title of the page for retweets (Default: Title of current page)
tweetcount_src: Leading text for retweets
tweetcount_via: If tweets contain ‘(via @BackType)’ (Default: true)
tweetcount_links: If links should be opened in new windows (Default: false)
tweetcount_size: Size of button (“large” or “small”) (Default: “large”)
tweetcount_api_key: Awe.sm API Key for custom URL shortener
tweetcount_short_url: Specify the pre-shortened URL that you would like to use (Default: Generated (bt.io))
tweetcount_background: Button background color (e.g. ‘FFFFFF’)
tweetcount_border: Button border color (e.g. ‘CCCCCC’)
tweetcount_text: Button text color (e.g. ’000000′)

6. paste the following code below the previous line of code:

<div style=’float:right; padding: 5px 5px 5px 5px’>
<script type=”text/javascript”>
tweetcount_url = ‘<data:post.url/>’;
tweetcount_title = ‘<data:post.title/>’;
tweetcount_src = ‘RT @virtuosoblogger‘;
tweetcount_via = false;
tweetcount_links = true;
tweetcount_size = ‘small’;
tweetcount_background = ‘FFFFFF’;
tweetcount_border = ‘CCCCCC’;
tweetcount_api_key = ’5c3bba3f5d77a46a13453091e36dc1cde4335e9299a1edeeaa3c31d193b33fda’;
</script>
<script type=”text/javascript” src=”http://widgets.backtype.com/tweetcount.js”></script>
</div>

This code will display the button on the right of the post. You can replace float:right to float:left to display the button n the left side of the post.

You also have to change Rt @virtuosoblogger: with the text of your choice.

7. After all the customizations, save the Template and see for yourself, the result is a sweet retweet button added to your blog.

Any problems? Comment!!