How to Add a Tweet Button Anywhere

Tweet

Social sharing is an excellent way to increase your web site traffic, find new subscribers and get the most out of your published content. Whether the sharing takes place via Twitter, Facebook or another method, the easier you make the sharing process, the more likely your content will be shared.If you have a WordPress blog, you can add social sharing buttons with just a few clicks by selecting one of the many social sharing plugins that exist. But it’s not as easy if you want to provide a way for your readers to share your content from somewhere other than your blog.To get you started, here are instructions for adding a Twitter tweet button in a few non-blog locations so your readers can share with their followers on Twitter.

Creating the Standard Tweet Link

Clicking a tweet button pre-fills the tweet text in a user’s Twitter screen, then the user can just click the Tweet button to post the update. Creating a link is the initial step for most tweet buttons, but it’s also useful to have the direct link handy in case you want to insert a text tweet link in your copy.Here is the standard format for a tweet link:Beginning of link: http://twitter.com/home/?status=Tweet text: Check out the rocking blog posts on SitePoint this week: http://www.sitepoint.com (via @sitepointdotcom)Full link: http://twitter.com/home/?status=Check out the rocking blog posts on SitePoint this week: http://www.sitepoint.com (via @sitepointdotcom)

See it in action by clicking here: Test it.

Using Twitter’s Tweet Button

Twitter provides a tool to create a tweet button right from their site. It’s somewhat limiting because it uses JavaScript, but it can be a good way to start using a tweet button on your web site, for example. You simply select the button you’d like to use, enter in your tweet text and URL, then copy and paste the code.

Adding a Tweet Button in an Email

To add a tweet button in an email marketing campaign requires that you create an image and link it using the standard link format shown above, although it’s not always that straightforward. The biggest challenge is accommodating various email clients and anticipating how your email marketing service will render the link. Make sure you test the link because you may need to use URL encoding so the link works properly.

tip: Include a Hashtag

If you want to use a hashtag in your preformatted tweet, use %23 instead of the pound sign so it renders properly (this is for all tweet links, not just those included in email).

Including a Tweet Button in a PDF

Adding a tweet button in a PDF can be done by putting an image into your original non-PDF document, then adding the link into the PDF before publishing. The process if outlined along with some great tips on the Social Media Examiner blog.

Incorporating a Tweet Button on Your Facebook Page

The Twitter tweet button doesn’t work on Facebook because of JavaScript, so to add a tweet button on your Facebook Page, you will need to have an FBML tab, an image for your button hosted somewhere, and the standard link you created above. Then you would just code the button directly into your FBML code (or other customized tab) for easy sharing.

warning: Check Your Length

Be sure to check the total characters of your tweet. We know what Twitter allows 140 characters, but 120 or less allows the tweet to be easily retweeted and shared again.

Where do you use a tweet button to encourage sharing of your content? Do you think it’s effective at driving new traffic?

Free book: Jump Start HTML5 Basics

Grab a free copy of one our latest ebooks! Packed with hints and tips on HTML5's most powerful new features.

  • jess_azur

    Excellent! very useful, thanks :)

  • Aaron

    Terrific Post! I am really into social media right now (like everyone else out there!), especially Facebook Marketing and FBML. It can be hard to keep up to date with such a fast changing innovative topic but I manage to do it through the fan page factory (http://facebook.com/thefanpagefactory) and blog posts exactly like yours. Tips and tricks rock. I am trying to learn as much as possible to put myself ahead of the curve. So thank you again!

    Enjoy,
    Aaron

  • http://www.montpellierinteractive.com tom16i

    Some handy tips. You can do similar things for most social orientated sites (facebook, digg, etc) these days, just take a look around their developer sections and you’ll be able to get ready made code.

  • Ngumbe

    Some fantastic and handy tips there! I believe this code will also work well for other logos such as dublis.

  • Ursula

    Just what we’ve looking for our newsletters!!! Thanks!!

    Ursula
    http://www.quinceanera.com