How To Create Tweetable Links In Your Blog Posts

In an earlier article on mobile websites for business, I mentioned several telling statistics and gave you quick links to tweet those stats out to your own Twitter followers. This is a technique that I noticed on Social Media Today and wanted to duplicate on my own articles when appropriate. By providing tweetable links, you offer readers an opportunity to share some interesting information from your blog while also sharing a link to your article at the same time.

What is a Tweetable Link

A tweetable link is when you provide a link that, when clicked, will open a new window for the reader as a Twitter status update. The content is already filled in so all they have to do is click “Tweet” unless they’d like to edit it first. Here’s an example:

Mobile friendly sites can improve customer engagement up to 85%. TWEET THIS STATISTIC

Why Tweetable Links

When readers are on your site, if you’re providing great content, they’re going to feel compelled to share it with their own friends and social media followers. The normal method is to provide a Share button of some kind so that your readers can post the title of your article and link to it on their Facebook, LinkedIn or Twitter updates. However, savvy social media users might be more interested in sharing a particular quote or statistic from your post. By providing them with a tweetable link, you’re not only encouraging them to share a specific piece of content that you’ve written, you are providing social media material that is born to be re-tweeted. Providing great, re-sharable content is an integral part of any Content Marketing strategy.

What to Tweet

When choosing what to make tweetable, you have a lot of options and flexibility as it is completely up to you. However, you’ll want to choose something that you are fairly sure your readers will find so interesting, they’ll want to share it with everyone they know. Here are some recommendations:

• Compeling Statistics
• Famous Quotes that are relevant
• Important Points from your article
• Facts from an Infograph

Generally, you’ll want to limit your tweetable links to just 4 – 5, as user clicks will fall off dramatically the more links you provide. If you want to automatically attach images to the tweets, there are instructions here.

How to Create Tweetable Links

Here’s a step-by-step guide for creating your own tweetable links:

1. Highlight the text within your article that you want to tweet and Copy (CTRL-C). Remember that Tweets are limited to 140 characters, including your shortened link, so your text can only be around 120-125 characters.
2. Use a service like Click To Tweet to convert your tweet into a shortened URL. Simply go to Click To Tweet and Paste (CTRL-V) your text into the tweet content box. Do not click Generate Link! yet.
3. You need to include a link back to your own website and article. You also need to shorten the link so that it doesn’t take up all of your available characters. You can use any shortening link service you wish – I like using Bit.ly. Open Bit.ly, click on Create, and paste the URL for your article into the URL box. This will generate a shortened URL using the bit.ly format that you can copy and paste at the end of your text in the Click To Tweet box. You can also add your own custom domain to Bitly if you wish!
4. You may also want to edit your tweeted text to include some hashtags or perhaps your Twitter handle like, “via @Mike_Allton”
5. Click on Generate Link! and copy the custom URL you’re provided.
6. Go back to your article and type in some text after your quote for your link, like, “Tweet This Statistic”
7. Highlight your new link text and make it a hyperlink using your formatting toolbar.
8. When finished, you should have something like this:

Learn how to create your own tweetable links! TWEET THIS!

Now, I had added some custom CSS styling to my other site so that I can make my click to tweets look nice as well as work well.

I have a “click-to-tweet” class applied to the paragraph that gives is border and spacing. I have a “ctt-text” class to make the tweet text larger, and a “ctt-button” class to style the second line of text and add the Twitter icon as a background.

Here’s the full CSS if you’re interested. You can modify as needed and insert into your style sheet or theme settings:

p.click-to-tweet {  border:1px solid #2A74B9;  border-radius:5px;  padding:20px;  margin:5px 0px 25px 0px;}a.ctt-text {  font-size:22px;  font-weight:normal;  color:#666666;  font-family: ‘Playfair Display’, serif;}a.ctt-text:hover {  text-decoration:none;  color:#999999;}a.ctt-button {  font-size:14px;  font-weight:bold;  color:#333333;  text-transform:uppercase;  background: url(images/twitter-logo-blue.png) right no-repeat;  margin-left:10px;  padding:15px 35px 15px 0;}a.ctt-button:hover {  text-decoration:none;  color:#999999;  padding-right:40px;}

If your site is on WordPress, you can use the Social Warfare plugin for sharing buttons and use it to create click to tweet text!

[clickToTweet tweet=”This is what a Social Warfare click to tweet looks like.” quote=”This is what a Social Warfare click to tweet looks like.”]

And that’s it! You too can now include some great tweetable links within your content. If you’ve done it, please share any results or feedback you might have received! And feel free to post any questions you have in the comments below.