Thursday, January 08, 2009

Want to give your readers a way to tweet your posts?

I have been spending a TON of time on Twitter the past couple of months. And I've noticed that Twitter is an incredibly value channel for letting people discover my blog. In fact, Twitter is now easily the top site for referral traffic to my blog.

In light of this, I started looking for a way to let readers automatically tweet my posts to Twitter. I looked for a plugin, and couldn't really find one. So I started playing around with code from similar plugins for Delicious, etc, and think I've got a crude workaround.

As you can see, each blog post now has a 'Tweet This!' link below the comments section of the post. if you click that link, it will take you to Twitter and let you tweet a link to this post! Like I said it's basic, but gets the job done.

Here's the code I added to the blog's template to make this happen:

<a href="<$BlogItemPermalinkURL$> via @mackcollier's The Viral Garden">Tweet This!</a>

Now there's a couple of caveats. First, notice that I added my Twitter name and blog's name to the code. You'll want to change both to your Twitter name, and blog name. I tried adding the post title as well, but it was too long. I would advise that you make it a bit unique so you can track how often people are tweeting it via your blog. And with the reply, you'll also get notified when someone tweets via your blog post.

Second, this code adds the 'Tweet This!' message at the end of the post. You can also change this to whatever message you want.

Third, you have to be careful to put the code in the right place in your blog's template. Here's a screenshot of where it goes in mine:

Basically, put it right above the End .post portion. You may need to do some trial and error with the code's placement to make sure you get it just right. Remember, Preview is your friend! Check it early and often to make sure you've got the code exactly how you want it before you save it.

So there you go! Like I said I had been looking for a way to add the ability to tweet my posts, and I thought I'd share the code with you. As I said above, it's still very crude, and I'm sure you could add a pic and probably enable URL shortening as well, that's just something that's over my head. If you add it to your Blogger blog, let me know how it goes!

PS: My blog still has the 'old' version of the template, because I couldn't update to the 'new' version and use the blog theme I have now. So if you have the updated version of Blogger, you might not find the same code in your template that I have. Try to put it somewhere near the end of the Post portion of the template code, and it should work!


Unknown said...

I'm not seeing the same reference points in my Blogger template. Care to assist?

Mack Collier said...

Kyle do you have the 'new' version of Blogger template? I am still on the old one, I think that's why it doesn't look the same.

Try looking for an area that's for the post, then if you can find an area that says its the End of the post area, put it right before that and see what happens.

Unknown said...

Yeah, it's the new one. My best guess for proper placement resulted in this when I hit Preview

Invalid variable declaration in page skin: Variable is used but not defined. Input: BlogItemPermalinkURL

Mack Collier said...

Ok Kyle try this; see if you can find a Delicious or Digg bookmarker to add to the end of your posts. Add it, then examine the code it uses, and compare it to the code for the Twitter one. It might be that you need to change the BlogItemPermalinkURL, or something, it might be called something else in the new version of Blogger template.

If you can find a similar code that DOES work with your version of the Blogger template, you should be able to tweak my code to make it work on your blog.

And if you do make it work, blog it and I'll update this post to point to your post!

Unknown said...

The only thing I can't get it to do is generate a fully-formed tweet in addition to sending the URL to Twitter.

Warren said...

Mack, nice work. It would be great to shorten the url somehow as it takes up most of the 140 characters. But that is way beyond my technical abilities.

Anonymous said...

Love the idea!

I got it to work on by toying around with it for a bit, and added an image of the twitter bird beside it. You can see how it looks on the post I just put up. (yes, I was up writing a blog post at 2:30 a.m.)

I just dropped the html into the actual post instead of messing with any template tonight, though that means I'd have to do it manually every time. But here's the code I used, personalized for my post and twitter handle, along with the image of the Twitter bird:

AMENDED: Well, I tried to share the html, but blogger wouldn't let me drop it in the comment. Will have to figure out another way to share it with you. Hmmm...

Anonymous said...

waw nice one... i like it thank you.

will be adding it to my blog template!


Anonymous said...

Your code is indigenous to Blogger. Be nice if someone could come up with similar for Wordpress. I would, but time is not available to do so at the moment. Is there a WP code ninja out there that could whip this together in short order?

Also, Hubspot has created a little app called Tweetit that does the same thing:

Anonymous said...

Great idea. Now if only you'd do this for me. All I can do is write. I suck at all things technical.

Unknown said...

@Paul Chaney: There are actually a lot of WP codes out there for other services, but I found this one among the few for Twitter:

Anonymous said...

Hey Mack (et al.) -- I went looking for a TweetThis style plug-in a few weeks ago with frustrating results.

Yours is at least the third or fourth post of seen this week about building in the ability for readers to automatically Tweet a post.

I keep wondering, though -- doesn't the ShareThis plug-in have this feature built-in? Does that plug-in work on Blogger?

Thanks for your insights, as always, Mack.

Anonymous said...

Great idea, by posting and retweeting your post to the Twitter world will definitely give you a boost and exposure!