Book Sale! Save 20% on WordPress books with discount code: SAVE20
Web Dev + WordPress + Security

How to Display Your Twitter Posts on Your WordPress Blog

Alright, time for another “How’d-you-do-that-thing-on-your-site?” post. This question comes from the one and only Mr. Graham of ImJustCreative.com. In a recent email, Graham literally begged me to share my “secret recipe” for displaying my latest Twitter Tweets (wow, did I actually just say that?) right here on Perishable Press:

…Would be really really decent of you if you could let me know how to do it? Pretty please? How do you call the last twitter feed, what commands do you need etc?

In case you have no idea what we’re talking about here, scroll down to the bottom of any page on the site (using the current theme) and observe the savviness and sophistication of my latest Twitter post, updated automagically every fifteen minutes. Or, for those of you too lazy to “go there,” here is a screenshot demonstrating the perpetual Twitter display:

[ Screenshot: Perishable Tweets Displayed at Perishable Press ]

Amazing, isn’t it? I hope so, because it was terribly difficult to achieve. Not really, but I do enjoy sharing my tweets right here on my own site. It encourages me to keep active on Twitter and helps direct traffic to my Twitter account. Plus, it’s just a thrill to see it all “up in lights” and everything. Whatever though! We all know that Twitter Sucks! Okay, okay, enough song and dance, let’s get on with another fascinating tutorial, shall we..?

So, you want to display your “Twitter Tweets” (aaaarrrrggghhh!!!!) on your blog..

First, to do things my way (there are many others!), you will need each of the following:

  1. A WordPress-powered blog
  2. A you-powered Twitter account
  3. The amazing SimpleTwitter plugin
  4. The PHP cURL library installed on your server

Once you are down with all that, upload and install the SimpleTwitter plugin as per the instructions. Once installed, click on over to the SimpleTwitter Options tab in the WordPress Admin and customize the following settings:

  • Your Twitter username
  • The cache duration (amount of time between updates)

Your Twitter username is a no-brainer, and the cache time is simply the amount of time that should pass before the plugin checks for a fresh tweet. Even if you Twitter like every minute or so, it is best to use caution when choosing the cache interval. Have mercy on your server! For example, I use 15-minute intervals, but would increase that to 10 or even 5 (at the most!) if I were a more frequent Twitter tweeter (somebody KILL me!).

Whatever, it’s up to you! After picking your nose settings, click the ‘ol “Update Options” button and call it good.

Part two: Sealing the deal — preparing your PHP for some serious tweets..

Everyone okay so far? At this point, we have all the required functionality in place; all that remains is to call the SimpleTwitter function and present it with some sort of (X)HTML markup. Hopefully, this won’t be too difficult.. ;)

Alright, open up your theme’s footer.php (or whatever) file and add the following code:

<p><?php if (function_exists('get_twitter_msg')) { get_twitter_msg(); } ?></p>

Save, upload, and check the results in a browser. If everything is working (i.e., you did everything correctly), you should see your latest Twitter post displayed near the bottom of the page.

If nothing appears, try changing the plugin’s “cache interval” in the Admin options page. Change it to anything different and then save your changes. This should cause the plugin to make a new request for your latest tweet and display it accordingly. If even this doesn’t work, try posting a new tweet, adjusting/saving the settings (again), and wash rinse repeat a couple fo times until it “kicks in.” Honestly, it should work fine “out of the box,” with no problems whatsoever. It worked (and continues to work) great for me, but I mention the troubleshooting tips “just in case..”

Part three: a little CSS to make it all tweet..

After you get everything working, you will probably want to fine-tune your markup and/or CSS to suit your blog’s design. For this site, I wanted to spice things up a little bit by adding a Twitter icon to the left and linking the tweet to my Twitter account. Here is the (X)HTML markup (and requisite PHP) that I decided to use:

<div class="content">
	<p class="center"><span class="twitter"><a href="https://twitter.com/perishable" title="Twitter Sucks!" rel="nofollow"><?php if (function_exists('get_twitter_msg')) { get_twitter_msg(); } ?></a></span></p>
</div>

..and associated CSS styles:

div.content { 
	margin: 33px 0; 
	clear: both; 
	}
p.center { 
	text-align: center; 
	}
span.twitter {
	background: url(images/twitter.gif) no-repeat left center; 
	padding-left: 17px; 
	}

Oh, I know, there are better ways of doing this, but this is what I went with, so feel free to make it all better!  Of course, to see this code in action, I once again refer you to the bottom of any page of the current theme. Essentially, I have applied some modest vertical space, centered the contents of the paragraph (i.e., the link), and added the twitter icon to the left. And finally, I decided to “nofollow” the link to Twitter because I suck am trying to control sitewide external links.

Obviously, there are many possibilities when it comes to presenting Twitter posts on your own site, but I offer this method as a way to get your juices flowing. Who knows, you may even want to display your tweets somewhere other than your footer, like your sidebar or “About” page or something. Maybe use a different icon, bigger font — whatever!

Well okay, that about does it for this action-packed tutorial — have fun twittering those tweets you crazy twitterers! “Two tweets to the wind!!”

Next up..

In the next “How-to..” post, I finally get around to explaining the process used to create the coveted Perishable Press sun icon and logo. Stay tuned!

Jeff Starr
About the Author
Jeff Starr = Fullstack Developer. Book Author. Teacher. Human Being.
The Tao of WordPress: Master the art of WordPress.

13 responses to “How to Display Your Twitter Posts on Your WordPress Blog”

  1. you can also refer to this site on how to show the latest tweets in your blog site using tweeter API

    . as easy as 1 2 3

    http://www.ryscript.co.cc/web/how-to-display-latest-tweets-using-javascript-and-twitter-api/

    thanks

Comments are closed for this post. Something to add? Let me know.
Welcome
Perishable Press is operated by Jeff Starr, a professional web developer and book author with two decades of experience. Here you will find posts about web development, WordPress, security, and more »
WP Themes In Depth: Deep dive into WP theme development.
Thoughts
Had a good laugh today when I saw this in a support email: “In observance of Arbor Day our team will be out of the office on Friday, April 30th.” Lol Arbor Day.
Just spent a few minutes scrolling thru FB, almost every ad was pushing the va×.
On macOS when an app won’t hide, you can force it by holding the ⌥ (option) key and clicking anywhere on the desktop.
Currently having a blast redesigning Plugin Planet, so much work so little time.
Thanks to David McCan over at WebTNG for the awesome BBQ Pro review.
Enjoyed a nice mini-vacation with my fam. Great way to recharge and regroup.
Nice little interview with yours truly over at ThemeIsle. WordPress, web dev & more!
Newsletter
Get news, updates, deals & tips via email.
Email kept private. Easy unsubscribe anytime.