Aug
13
2010

[How to] Add Twitter's Official Tweet Button on WordPress Blogs

Twitters Official Tweet Button1 [How to] Add Twitter's Official Tweet Button on WordPress Blogs

Twitter, a Social Networking and micro-blogging service, owned and operated by Twitter Inc., has finally taken one more step ahead by introducing its new feature. Twitter introduced much awaited official Tweet button earlier today and almost all famous bloggers have added. We can say “a 5 year old Twitter gave birth to Tweet button today”:-P

Earlier today readwriteweb wrote “The button has gone live on a number of major websites, including entire the entire WordPress blogging network, sharing widget ShareThis and YouTube, and the company expects that “more than a few sites will join the above in the hours to come.”

Tech Tip: Twitter is in partnership with Tweetmeme, the company responsible for the majority of retweet buttons on the Web for the past year and a half.

Today I am going to tell you how to add Twitter’s official Tweet button on WordPress . WordPress, a major blogging platform has two kinds of blogs:

  1. Self-Hosted blogs : These are the blogs which must be installed and maintained separately in your own server through your Web Hosting.
  2. Free-Hosted blogs: These blogs are hosted and maintained by WordPress itself and can be created at WordPress.com

1. Browse to Twitter’s Tweet button page

2. There are 3 display options among which you have to chose one as shown below

step21 [How to] Add Twitter's Official Tweet Button on WordPress Blogs

3. After choosing the preferred button , move to the next option that is the “Recommended people to Follow

step 31 [How to] Add Twitter's Official Tweet Button on WordPress BlogsAs you can see above there are two fields and surprisingly  both should be filled with twitter user id’s.

The 1st field must have twitter id which will be mentioned in the tweet and the 2nd field needs to be filled with another twitter id of whom you would recommend  to twitter users to follow after they have share the tweet with few words of description.

To understand this much better have a look at below image :

Twitter User Recommend1 [How to] Add Twitter's Official Tweet Button on WordPress Blogs

4. After filling the twitter id fields , now move towards the next option where we can see the preview of the button and the code as well.

Step 41 [How to] Add Twitter's Official Tweet Button on WordPress Blogs5. Copy the code which is shown in the previous image.

6. Now go to your WordPress Dashboard->Appearance->Editor-> Select single.php file and paste the below code as shown below :

  • Search for “<div class=”entry content>” [without quotes] within the single.php file and paste the copied code

Final Step1 [How to] Add Twitter's Official Tweet Button on WordPress Blogs

7. Finally you could see a Tweet Share button exactly below the Post-title and above the post content.

One of our techie friend “Harsh Agarwal” has explained how to add Twitter Share Button to free WordPress Blogs.

Have a check here =>Free WordPress.com blogs added Tweet Button

You can also have a look at this below by Twitter which demonstrates the use of Twitter’s Tweet Button

=====================================================

So friends how did you like our tutorial ? icon smile [How to] Add Twitter's Official Tweet Button on WordPress Blogs Share it with others if you like it and do comment If you get stuck anywhere icon smile [How to] Add Twitter's Official Tweet Button on WordPress Blogs

Happy Blogging icon smile [How to] Add Twitter's Official Tweet Button on WordPress Blogs Thanks for reading icon biggrin [How to] Add Twitter's Official Tweet Button on WordPress Blogs


Did you enjoy this article? Share it!

Related Posts

About the Author: Sunil Jain

I am a part-time cool blogger :D, who loves WordPress and Social Media. You can tweet with me => @gupshupblog

  • Pablo Lara H

    Thank you for the sharing Sunil.

  • Pingback: Arun Charles

  • bloggcandy

    this only shows twitterbutton on postpage and not on homepage and if i add this code on index.php in post it will only tweet homepage link and not post link

    • http://coderplus.com CoderPlus

      yes, you will need to further edit the code for that to work on non-post pages. Or you can use my plugin which will auto insert the button on all your blog posts(or manually as per your requirements) – http://coderplus.com/2010/08/twitter-tweet-button…

    • http://www.comptalks.com Bishwajeet

      If you want to add Twitter Button on homepage for your blog in the post is tweeted check this, I have written about it on my blog "how to add official twitter button on wordpress blogger homepage"

  • Pingback: Ramon B. Nuez Jr.

  • Pingback: JuwalBose

  • http://www.jayphilips.com Jay Philips

    I don't see why someone would want to switch from the Tweetmeme button to this? Or do you recommend someone using both?

  • Ygam Retuta

    Cool! It's nice to see that there's an immediate topic on this knowing that the official Twitter button just came out a few hours ago. Thanks a lot!

  • Pingback: Reeni Tvinnereim

  • Pingback: Aaron Lee

  • Pingback: Hillel Fuld

  • Pingback: Jay Philips

  • Pingback: Ruhani Rabin

  • Pingback: Raj_R

  • http://www.dailyblogging.org Mani Viswanathan

    Awesome tutorial. A newbie will understand better with these pics. :)

  • http://thecopypasteblog.com Rahul

    I found this tutorial better than the one provided on mashable :) good work and keep it up :)

  • http://www.tecrux.com/ Tecrux

    Thanks for the detailed tutorial. The new button looks like a good replacement for tweetmeme.

  • http://quanaoredep.com Tuan

    Great, thanks you for this article

  • http://www.limfy.com Alvin Lim

    Great tutorial. The official Twitter button is nice. Going to add this later :)

    Notice that there is mysql_connect() error message after the twitter button at the right floating bar of your blog.

  • http://www.socialblogr.com/ Gojeg

    This tweet button is so nice, and also easy to embed on popular blogging platforms.

  • http://theopinion.in Vishal Gaba

    Will install this right away…thanks man :)

  • http://www.techtipsgeek.com Tanmay

    Nice tutorial buddy. Thanks for sharing

  • http://webdesign2day.com raybak

    Hi Sunil, can you please let me know what widget you are using for subscription (Newsltter, FB, Twitter?).

  • Pingback: How To: Add Twitter Follow Button In WordPress Blogs | Tech18

Subscribe by Email

Catch us on Facebook :)

Google Friend Connect