How to add Retweet button to blogger
71 COMMENTS
|
|
|
Twitter also known as micro blogging is spreading among people like flu. With increase in its popularity, twitter has become a very good media for social marketing. Tweetmeme is a free service which makes twitting about blog posts very easy. The Retweet Button along with the option to retweet, also displays the number of tweets made about the post.
Here is how the Retweet Button looks like this:
Plugins to add the button are available for wordpress,joomla and drupal but there is none available for blogger, so i will show you how to add the retweet button to your blogger blog.
Follow these simple steps:
1. Go to Layout->Edit Html
2. Download Full Template
3. Check the Expand Widget Templates
4. Search for the code below:
<div class=’post-header-line-1′/>
a. For the full retweet button place the following code below the above code:
<div style=’float:right; padding: 5px 5px 5px 5px’>
<script type=’text/javascript’>
tweetmeme_url='<data:post.url/>';
</script>
<script src=’http://tweetmeme.com/i/scripts/button.js’ type=’text/javascript’>
</script> </div>
This will display the button on the right side of the blog post. To place the button on the left side just replace float:right in the code to float:left.
b. For the compact button instead of the code above place the following code:
<div style=’float:right; padding: 5px 5px 5px 5px’>
<script type=’text/javascript’>
tweetmeme_url='<data:post.url/>';
tweetmeme_style = ‘compact‘;
</script>
<script src=’http://tweetmeme.com/i/scripts/button.js’ type=’text/javascript’>
</script> </div>
5. Save the Template and you’re done!
UPDATE:
Tweetmeme Announced that:
By default the retweet button will be like this “RT @tweetmeme “. You can, however change the button to retweet your user account. By specifying the “tweetmeme_source” parameter in the JavaScript you can change the format to “RT @yourname (via @tweetmeme)”.
So now you can add your twitter user account by adding the code below:
<div style=’float:right; padding: 5px 5px 5px 5px’>
<script type=’text/javascript’>
tweetmeme_url='<data:post.url/>';
tweetmeme_source ='Your User Account';
</script>
<script src=’http://tweetmeme.com/i/scripts/button.js’ type=’text/javascript’>
</script> </div>
Replace “Your Twitter Account” by your twitter Account
Update #2:
Twitter announced:
Using your own URL shortener
TweetMeme now lets you specify a URL shortening service which you would prefer to use.
* bit.ly,
* awe.sm (API support),
* cli.gs,
* digg.com (API support),
* is.gd,
* TinyURL.com
* tr.im,
* su.pr (API support),
* ow.ly,
* lopurls.us,
* twurl.nl
This means you can use any url shortener of your choice which will be great and when the API support comes you could also many more features.
Here’s how you can add your choice of url shortener.
<div style=’float:right; padding: 5px 5px 5px 5px’>
<script type=’text/javascript’>
tweetmeme_url='<data:post.url/>';
tweetmeme_source ='Your_Twitter_Account';
tweetmeme_service = 'Your-url-shortener';
</script>
<script src=’http://tweetmeme.com/i/scripts/button.js’ type=’text/javascript’>
</script></div>
Replace Your-twitter-account with your twitter account(eg. for me virtuosoblogger)
Replace Your-url-shortener with your choice of url shortener (eg. bit.ly)
Problems? Tell me!!
- Everything you ever wanted to know about Twitter | Charles Curle Design
- La madre de todas las listas de aplicaciones Twitter « Camyna.com
- 50+ Awesome Twitter Tips to become a Pro | Blog Godown
- La madre de todas las listas de aplicaciones Twitter « ENRIQUE SAAVEDRA
- La madre de todas las listas de aplicaciones Twitter (parte 1) « ENRIQUE SAAVEDRA
- How to add a Backtype retweet button to Blogger
- Twitter Tips Ultimate Guide | The Social Media Guide











October 26, 2009 - 9:19 pm
Thank you!! This works great!!
Recent blog:=- Amazing Leg Tattoo 2
November 5, 2009 - 10:05 am
HI thanks so much. I digged this on google. I got it great post.
but added the retweet button fine, but i change the button to retweet my twitter user account. its NOT showing me my user accout RT useraccount. Still its showing me RT tweetmeme plz help
November 6, 2009 - 7:36 pm
Check out the update section, it will help you add your twitter username
November 7, 2009 - 5:25 am
I tried that, but it pushes down my text as well as my buttons
It aligns the buttons underneath each other but leaves a big gap underneath my blog title before the text begins. The text begins after the second button instead of underneath the title and inline with the buttons on the right.
November 11, 2009 - 12:17 am
Make sure you are using float:right and padding, these will wrap the text around the buttons .
Recent blog:=- Browser Toolbars for Blog communities
November 12, 2009 - 4:52 pm
Excellent, thanks for this
November 24, 2009 - 4:23 pm
Trying to use this very helpful blog entry but can’t find the within my HTML code – even when expanded widgets.
I’m using blogger and havent modfied the theme other than using one of the preset themes… is there another piece of code I should look for to place the retweet code?
Thanks so much – great blog!
November 24, 2009 - 8:48 pm
you can try out the retweet plugin
December 4, 2009 - 12:11 am
Hi..
How are you ..i am unable to save template when i put this code in html..it gives this error
Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly.
XML error message: Open quote is expected for attribute “{1}” associated with an element type “style”.
December 4, 2009 - 8:39 pm
This error occurs if you don’t copy the code properly and check whether corrected or not, you can also convert the code in xml ready format by using the Ad Code Converter for Blogger
January 3, 2010 - 6:11 am
Thanks for this post
SmashDesign´s last blog ..Hello world !
February 6, 2010 - 3:07 am
Well I keep trying to do this but I can’t get it to work.
I use Blogger and tried the Ad Code Converter but my posts are blank. There is no tweet me button, nothing. What am i doing wrong?
Thanks!
Natalie´s last blog ..Book Review : Giv The Story of a Dog and America
February 7, 2010 - 1:02 am
It may be because the font was italicized, try the same code and use it in your template. You don’t need to use the AD code converter.
I have fixed it. It should work by now.
February 20, 2010 - 10:45 pm
Problem is, I used another template and I can’t find the piece of code. Possible to help?
Otherwise, a very nicely outlined tutorial. Thanks a ton, buddy!