Subscribe to the RSS Feed
FreeWordpressThemes.us
Free WordPress Tutorials and Themes.

Want More Retweets? Use the Official Tweet Button

August 16th, 2010 by admin

A little over a month ago, I recommended to use the TweetMeme WordPress plugin to get more retweets on your posts.

A few days ago, Twitter announced their own button for retweeting. Several methods of integrating the official Tweet button in your WordPress sites have already emerged.

WordPress Plugins

The first Twitter button WordPress plugin I came across was from Blogsessive.

Twitter button WordPress plugin

As you can see from the screenshot above, the options integrate all of the options you’d expect from a Twitter button WordPress plugin, with no extraneous features. You can download it from the post linked to above.

After this a few others popped up on the WordPress.org plugin directory:

The Manual Way

Twitter has provided a number of ways to include the Tweet button on your own pages. The most straightforward option is through this customizable form where you can define the type of button, a custom URL, the tweet text, language, and recommended Twitter users.

Let’s take a look at the code that is produced after I input a few sample values.

<a href="http://twitter.com/share" class="twitter-share-button"
data-url="http://example.com/permalink-url/"
data-text="Title of page goes here"
data-count="vertical"
data-via="themelab"
data-related="lelandf:My personal account">Tweet</a>
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>

Let’s go through this line by line.

  • First Line: Basically just opens the link and adds a CSS class.
  • Second line: data-url is used to input a link, probably the permalink of your post.
  • Third line: data-text is used for the tweet text, probably the title of your post.
  • Fourth line: data-count is used to define which type of button: vertical, horizontal, or none
  • Fifth line: data-via is used in the @mention in the tweet, probably your own Twitter account.
  • Sixth line: data-related allows you to define another Twitter account with a custom description.
  • Last line: Basically just closes the link and adds an obligatory line of javascript.

I’d recommend playing around with the button code generator to get a better feel of all the different options.

Inserting into WordPress

Let’s revisit the above code and insert some dynamic WordPress template tags into it for the permalink and title.

<a href="http://twitter.com/share" class="twitter-share-button"
data-url="<?php the_permalink(); ?>"
data-text="<?php the_title_attribute(); ?>"
data-count="vertical"
data-via="themelab"
data-related="lelandf:My personal account">Tweet</a>
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>

This code can be inserted into pretty much any template file you want, including index.php for the main index, single.php for individual blog posts, page.php for static pages, and more.

For styling purposes, you’ll probably want to place the code above <?php the_content(); ?> and use something like the following CSS code to style it.

.twitter-share-button { float: right; margin-left: 10px; display: inline-block; }

More Advanced Usage

For more advanced usage of the Twitter button, have a look at this page on the Twitter developers site. Twitter actually allows you to “build your own Tweet button” (see the bottom of the page) which makes it a lot more customizable than the TweetMeme button.

Conclusion

For some more information on the tweet button, there is a good article entitled 7 Reasons Not to Use the New Tweet Button by Andy Beard. In the comments, a Twitter developer responds to the reasons.

You’ll also noticed I have not myself switched to the official Twitter button and am still using the TweetMeme button. The reason why I haven’t switched is because I don’t see any pressing need to switch to the official version yet, the TweetMeme still works fine.

If you’ve noticed on Twitter, I have been tweeting a lot about the tweet button. After tweeting the link to this post about getting more retweets with the official Twitter tweet button, that will probably be my last tweet on the tweet matter.

Related posts:

  1. Want More Retweets? Use the TweetMeme WordPress Plugin
  2. Make A Custom Twitter Widget Without A Plugin
  3. Social Bookmarking with WordPress
Written by - Visit Website

Posted in Theme Labs

Leave a Comment

Please note: Comment moderation is enabled and may delay your comment. There is no need to resubmit your comment.