Tutorial -Add a Tweetememe Retweet Button to your Blog
Ok as you all know I'm having this very impressive Twitter Retweeet button on my blog, and getting mails constantly asking me to share this hack. Its been hard to help everyone install the widget so i decided upon writing this easy tutorial. Twitter is an excellent source for blog traffic that makes this a must install widget on your blog!
Go to Tweetmeme.com
Dashboard > Layout > Edit HTML and check the "Expand Widget Templates" option.
Now as a precautionary measure please download your template so that you have an emergency backup if in case you create any errors :)
Firstly be clear if you want the full version or the Compact version of this Retweet button.
For the Full version of the Retweet button:
Firstly Locate this code in your blogger template.
<data:post.body/>
And then copy and paste the below code just above the data:post.body tag
<div style='float:right; margin-left:10px;'>
<script type="text/javascript">
tweetmeme_url = '<data:post.url/>';
</script>
<script src='http://tweetmeme.com/i/scripts/button.js' type='text/javascript'/>
</div>
Now the customization part:
1.<div style='float:right; aligns the button to the right. set it as left if you want it on the left hand side of the post.
2.the above code was pasted above the <data:post.body/> tag. So if you want the retweet button in the bottom section of your post. Place the code below <data:post.body/>
Now for the Compact style of retweet button.
Instead of the above set of codes, paste the following for compact version.
<div style='float:right; margin-left:10px;'>
<script type="text/javascript">
tweetmeme_style = 'compact';
</script>
<script type="text/javascript" src="http://tweetmeme.com/i/scripts/button.js"></script>
</div>
You can paste it either above <data:post.body/> or below as per your liking. The customization part is same as the Full version of the Tweetmeme retweet button. Any doubts implementing this hack? Do drop a comment here..
33 COMMENTS:
Hi chetz again a nice tutorial!!!I would love to try this in my test blog first and then add to my blog :)hey how come you come up with such amazing tutorials and hacks for bloggers!you rock!!!waiting for more tutorials on hacks and tricks for bloggers from you! :)
Hi,
Please can you make sure you specify a tweetmeme_url, you can find more information on this on the tweetmeme help http://help.tweetmeme.com/2009/04/07/integrating-the-tweetmeme-button-into-blogger/
Very useful ,I will tryto add this twwet me retweet button to my blog ,let's hope my template supports it.
Very simple yet effective tool for blogger. I already installed it and it works like a charm. Thanks
DiTesco
I just wanted to say that you have a great tutorial here. It's the first step in getting my social network bar done and you did a fantastic job of explaining things. Keep up the tutorials!
This is amazing! The first tutorial were I've been able to get the button to actual work and be in the right place! Thank You!
Nice website design! and nice tutorial btw
thanks
very useful
rajinigantham.blogspot.com
Nice tutorial ... thanks. i am using it now :)
wonderful!!! How can I get this to say, @LeslieVeg , instead of @tweetmeme??
Really nice!
Thanks you!
Leslie
LesieVeg@msn.com
you can change the source of your tweet from tweetmeme to your username just add a attribute and change source in the script and type your name :) if you need help do feel free to ask
What an amazing site. I love the design of it, thanks for the tips!
I managed to embed the badge to my posts, hopefully people will start tweeting my articles now:
MobileSpoon
Thank you so much! I had been trying with tips from everywhere and your hack is the only one that worked!
You're welcome :)
@LeslieVeg you can add this line to the script
tweetmeme_source = 'LeslieVeg';
This will solve the problem
Nice tutorial, really well explained
Thanks sooooo much for this tutorial!!!!!!! xox
For some reason, the compact version puts a question mark on my blog instead of a 0, if the blog has not been retweeted yet. Any reason why?
the question mark means 'fail' its usually the problem of tweetmeme... or it might be due to mistake in the code. try the normal one and tell us if that shows the ? too.
Hey thanks Cheth... this is @kirtitandel What an awesome tutorial.. especially for new bloggers like me!
keep the good work.. as i always say, you are the F1 key for most of us..
cheers...
I think I did mine right - can you check it out and let me know? Thanks for all your help with this.
Love and Blessings,
AmgelBaby
This isn't helping me. That tag is nowhere in my code...
Never mind I finally found it. Firefox was just being a butt. Thanks!
Please forgive me for being an idiot as far as technology is concerned.. I've been trying to find a fix re:a blogger/tweetmeme customization problem. I have the RT button in each of my posts, I have it set up in my post template so the RT button is automatically added. I am trying to customize it to show my username instead of @tweetmeme and I followed their directions (replacing 'tweetmeme' with 'myusername' in the specified field and it's not working. I am so frickin' lost! =( Is there something I'm supposed to do besides replacing 'tweetmeme' with my username in the code? Any help is greatly appreciated.
@Meggs,
Use this code... and replace cheth by your twitter username
<script type='text/javascript'>
tweetmeme_source = 'cheth';
</script>
<script src='http://tweetmeme.com/i/scripts/button.js' type='text/javascript'/>
does this work for you?
@Meggs
use the code provided to you by cheth, i used it and it worked like wonder.
thanks cheth
Dear sir/madam,
How do I make sure the button appears nicely on a black background? My blog is black, and I would like my tweetmeme retweet button to appear seamlessly on the page, like it does on yours, without the white border around it. thank you so much
Wow! It actually works! I've been trying to get a retweet button on my blog for the last two hours. It's been most frustrating. Fortunately I ran across this site. The button was up and running in a few minutes. Yours is the only script that worked out of about 5 or 6 I tried. Thank you so much
http://pr-insights.blogspot.com
@liloo We havent done anything special the normal tweetmeme button appears nicely on black bakground too.. I'm not sure why its not appearing seamlessly on your page. We have changed the theme but it was the normal tweetmeme retweet button itself. :)
@PR Insights
We are glad that we helped you :)
Ok, do you know how I can remove my blog title from every tweet? I still want the post title but not the blog title?
You will have to edit it in your blgoger template from the title include tag. Remove the data:blog.title tag. But it maynot be too good for your blog SEO so we advice you not to do it.
thanks to the information,
because it is very helpful especially in making and messing work on bloggers who I have today
thanks to the information,
because it is very helpful especially in making and messing work on bloggers who I have today
Post a Comment
Please Don't Spam that's all. Grab our RSS Feed and we would Love to see you in our comments section more often.