Putting a Tweet-this-quote link in blog posts

This article shows you how to apply a "tweet this" label to a specific quote in a blog-post, and how this works for your readers.

What are "tweet this" links 

Male Blackbird - By Malene Thyssen (User:Malene)
[GFDL (www.gnu.org/copyleft/fdl.html) or
CC-BY-SA-2.5 (www.creativecommons.org/licenses/by-sa/2.5)]
via Wikimedia Commons

Previously I've described how to put a "tweet this" button into your blog.

This can be set up to let readers  share the specific post they're reading, or your entire blog (but not both at the same time).

It's an example of   the "look what he said" approach to social networking.

Recently, it's become popular to invite readers to tweet a specific sentence or section of a post, by putting a "tweet this" link at the end of the section, like this

Here is a cool quote from me, which I think you should share.    [tweet this]

Blogger-Tyrant has described how to do this, and suggested Click to Tweet, a 3rd party tool which makes it a tiny bit easier by generating the HTML code for you.

However I'm not fond of 3rd party tools that give you code that refers back to their own servers (eg Click to Tweet gives back a link likethis:   http://clicktotweet.com/wa95i):   if C2T goes out of business, there would be broken links on my blog, even if it and Twitter were both working normally.  So I'm not recommending Click-to-Tweet.  

But this feature has a lot of potential, if we use it properly.   It's not hard, as I've explained below.   But it does have certain things to be aware of - including a need to stay well away from quote marks - see the Troubleshooting notes for more about this.


How to set up a "tweet this" link:

1  Copy this code:

TEXT-YOU-WANT-TWEETED <a href="http://twitter.com/home/?status= TEXT-YOU-WANT-TWEETED. via@YOUR-BLOGGER-ACCOUNT " target="_blank"> [tweet this].</a>

2  Edit your post or page, and go to the edit HTML view.


3  Find the place where you want to put the link.
(Hint: in compose-mode, put in some text that wouldn't otherwise be used, eg XXXX. Then use the browser search feature to find that text in Edit HTML mode.)


4  Paste in the code.


5  Replace both instances of TEXT-YOU-WANT-TWEETED with the words that you are inviting your readers to share on Twitter.
See the Troubleshooting section below, for things to be aware of as you do this.


6  Replace YOUR-BLOGGER-ACCOUNT with your own Twitter account-name.
If you don't have an account, or don't want it associated with the tweet, remove all of  via @YOUR-BLOGGER-ACCOUNT


7   If you want tweeting to take readers away from your blog, remove the  target="_blank"  part of the code.   Otherwise leave it alone:  with it there, Twitter will open in a new tab or window.


8  Make any other changes, including indenting or formatting the part you want quoted.
You can change the "[tweet this]" phrase that's just before the </a> to any other words you would like to use, eg "[share on twitter]", "[tweet me]", "[tweet this quote]", "[cheep, cheep]" etc.  The square brackets are optional - I like them because they make the bit-to-quote look different from the action instruction.


9  When you are ready, publish the post, and test the tweet-this link, just to be sure it's working.

Troubleshooting:

• Don't mess with the quote marks around the text:  replace just TEXT-YOU-WANT-TWEETED - not the stuff around it.

• You cannot have ANY quote marks (single or double, ' or " ) or apostrophe's or hashes ("#/"'s) inside the text-you-want-tweeted.   Some other punctuation seems to be ok (though I haven't tested every option)

• Make sure there are no spaces between  "status=" and "TEXT-YOU-WANT-TWEETED"

• Don't try using #hashtags.   They don't break the code, but they do seem to truncate what gets put into your suggested message.

• If you use quotes or apostrophe's in by accident, and publish or go back to compose mode before you realise, the best way to fix it is to remove the whole section and start again:  quotes inside quotes make Blogger's post-editor very confused. 

What happens for your readers:

When a visitor reads sees your post, they see

TEXT-YOU-WANT-TWEETED [tweet this].

with whatever formatting you used (eg, I put in the indenting and coloured background on the quote above).

The [Tweet this] part will also have whatever formatting is applied to links in your template.


When they click on the [Tweet this] link:

• If they are logged in to Twitter at the time, then they will go to Twitter's status-update option in a new window or tab, and your suggested message will there, waiting for them to press the Tweet button.

• If they are not logged in to Twitter at the time, a new window or tab will open, and they will be asked to log in to www.twitter.com.
  After they have logged in,  they will go to Twitter's status-update option, and your suggested message will there, waiting for them to press the Tweet button.

They have the option of editing the message, and adding hashtags, before sending it.

Once they've clicked the Tweet button, they are returned to Twitter's main window.   (The target="_blank" in the code means they will still have your blog open in another window too.)

Over in the Twitter-stream, their followers will see a message with your suggested text, saying that it came via your Twitter account (unless you removed the "via" bit).


A final thought:  watch what you tweet.

Notice that there are two places where you had to change TEXT-YOU-WANT-TWEETED.  Most people will follow the instructions and, changed both of them to the same thing.

But there's no way to enforce this, and it's not immediately obvious if a blogger hasn't. Look at this example:

Happy St Patricks Day [tweet this]

It looks harmless enough. But if you click the [Tweet this quote] link, the text that is suggested is

Im a plastic paddy.

which might not be quite the message your readers want to send.   Some will notice, and not send the tweet.   But others will just hit the Tweet button without properly looking at what you've suggested that they quote.   This could be embarrassing, at least, and could be an excellent way to lose your audience.

Suggestions:

• If you've a Blogger who has worked hard to earn your reader's trust, don't lose it by trying to fool them like this.

• If you click the a tweet-this-quote link anywhere, make sure you double-check what is suggested, before hitting the Tweet button over in Twitter.

What else?

I have a feeling that the tweet-this-quote feature, which is based on suggesting a value to Twitter via the URL it is called with, could be used in some interesting ways - keen to hear any suggestions that you might have.

---

Related Articles:



Adding an official Tweet this button to your blog

How to link blogs and the social networks

Foormatting your links