Add a Twitter Button into Blogger next to the Post Title

You must have observed the new Twitter Button on each post. Within minutes of adding it, a devcurry reader mailed me asking how I implemented the code. It’s quite easy. I am using the tweetmeme service to add a Twitter Button into Blogger with the help of this post Integrating the button into Blogger

Step 1: Sign Into your Blogger account > Layout > Edit HTML. Make sure you save a copy by clicking the link ‘Download Full Template’. Check the box ‘Expand Widget Templates’

Step 2: Copy the code shared in the link I shared earlier. Now this code adds the twitter button at the end of each post. However what we want is to add a Twitter Button next to the Post Title.

Making sure you have checked the box ‘Expand Widget Templates’, search for the text ‘post-header-line-1’

Step 3: Just before the closing div tag, add the following code as shown below:

<b:if cond='data:blog.homepageUrl != data:blog.url'>
<script type='text/javascript'>
tweetmeme_url = &#39;<data:post.url/>&#39;;
</script>
<script src='http://tweetmeme.com/i/scripts/button.js type='text/javascript'> </script>
</b:if>

The piece of code 'data:blog.homepageUrl != data:blog.url' checks if the page is not the homepage url and displays the button only on individual posts.

Step 4: Preview the template and then save it.

Now every post of your should have the Tweet Button displayed next to the Post Title

Bookmark this link on del.icio.us (saved by 0 users)

Did you like this post?

	subscribe via rss		subscribe via e-mail
	print this post		follow me on twitter

Others Also Read..