How to add a retweet and facebook button to your blog

With all the commotion with opening up Moodle to iPhone (and now some android driven phones, but still in the initial try-out phase), I was not keeping up with my blog lay-out. But now, I finaly got the retweet button for blogger embedded in my blog html template, as well as a facebook button.

In order to do this, I relied on the blogger plugins blog: here is the link for the retweet button and this one for the facebook button. But to make things easy, I wrote down what I chose.

For the retweet button, I used this code:

<div style="float:right;padding:4px;">
<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>


Mind you, I did replace the fourth line with my own twitterame, so that line became:

tweetmeme_source = 'ignatia';

But there are other types of button layouts, so check the post on bloggerplugins if you are looking for something different. Once I got the code, I followed the steps below:

How to install the Retweet Button on your blog?

1.Select the retweet button styles,and copy the corresponding code into a text file.

2.Now in this code replace your_twitter_username with your actual twitter username (e.g. ignatia)

3.Now we have got the final retweet code.Now login to your blogger dashboard and navigate to Layout > Edit Html and expand the widget templates

4.Find this piece of code

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

and immediately after that place our retweet code(from our text file) < div class='post-header-line-1'"> and you are done :)

If you were unable to find this code in your template,then look for the first occurrence of

<data:post.body/>

and immediately before that, place our retweet code(from our text file)

5.Save the template.

For the facebook button, I used this code:

<div style="float:right;padding:4px;">
<a expr:share_url='data:post.url' name='fb_share' rel='nofollow' type='box_count'/>
<script type="text/javascript" src="http://static.ak.fbcdn.net/connect.php/js/FB.Share"/>
</div>