Thoughts on branding, design, writing and life by Kevin Potts. Established 2003.

Integrating Twitter and Textpattern

We all know Textpattern is money as a day-to-day content management system. But what happens when you’re posting content to social media networks? Instead of siloing content, integrate them with some dead-simple plugins and a lemon squirt of jQuery.

I’ve been doing some work around the site lately, and one of the biggest things I wanted to accomplish was to better represent my recent twitter activity. This led me down the path of investigating some TXP plugins versus more common jQuery client-side integration.

Shorten Your Textpattern URLs

URL shortening services are the scampering homeless offspring left behind by the wave of social media fraternizing. There are plenty to choose from, and if you’re feeling frisky, you can even roll your own with a little PHP and MySQL. But thankfully, the clever Textpattern plugin smd_short_url weaves magic for those like me who can’t even spell PHP.

So. Step one. Grab smd_short_url and install it. That’s it. Now any article can be accessed by its ID alone, so becomes Instant URL shortening, and the plugin handles all the 301 redirecting on the fly.

(Oh, and we should all be using canonical URL references in our metadata regardless of whether we’re shortening the URLs. They are pretty darn easy to implement.)

Add a Tweet This Link in Textpattern

Like the clone-driven music industry, the web 2.0 developer world has not been able to control itself with its endless derivative social media networks. Between Orkut and Buzz and Ma.gnolia and Jimmy-Crack-Corn-who-knows-what-else, we could theoretically add a gajillion ADD THIS buttons to our blogs.

There are few that have any kind of real gravity on the interwebs, but Twitter is one of them. So you need to add a simple link to enable people to quickly reference the page to your “funny” cat video.

Part 1: Create a Simple “Tweet This” Link

The Twitter link structure is simple, with only one variable to worry about:

We just need to replace “foo” with whatever you want to insert into the visitor’s “status” box when they visit For instance, this is what I am using:

<a href="
   <txp:title />%20at%20<txp:site_url /><txp:article_id />" 
   id="twitter">Post to Twitter</a>

Pretty simple. Just make sure to use <txp:site_url /><txp:article_id /> instead of <txp:permlink /> to take advantage of smd_short_url.

Part 2: Display Number of Tweets

If you want to take this one step further and actually show how many people have tweeted about a link, you can add this slice of jQuery to the end of the page:

<script type="text/javascript">
   $(document).ready(function() {
      url = "<txp:permlink />";
      beforecounter = " <span>[";
      aftercounter = "]</span>";
         function(data) {
            $('#twitter').append(beforecounter + data.story.url_count + aftercounter);

Just make sure your link element has the ID of “twitter” so the count can be appended. For more information, and for comparable code for Digg and, this article is pretty useful.

Embedding Recent Tweets in a Textpattern Page

There is no shortage of ways to add a list of recent Twitter posts to a page. A dozen or more jQuery solutions alone are floating around, some of them surprisingly advanced in their customizable output and number of hooks into the API. These are all fine and good, but anything JavaScript requires work on the client side, which means more to download, more HTTP requests, and overall slightly longer loading times.

There are two plugins for this job. kml_twitter is a more mature, far more robust option with lots of ability to customize. arc_twitter is more barebones, with not nearly as many ways to style. From my testing, kml_twitter is the more solid option all around; as an example, it renders direct hashtag links to and handles URL parsing more accurately.

Both are powerful, elegant solutions that tie TXP and Twitter together on the admin side, so tweets are rendered server-side before they hit the page. No JS calls, no dynamic content insertion — just HTML. In fact, tweets are even cached, which reduces the number of times the system has to booty call Twitter’s servers.

More Fun With Plugins

arc_twitter does two more important things: it allows you to administer your Twitter stream right from Textpattern, and adds a small widget to the article page that enables you to post directly to your stream. (mem_twitter is a dedicated plugin that also does this latter bit.)

And finally, to indulge our vanity, jrh_twounter is a dead-simple plugin that grabs your follower total. Like arc_twitter, this plugin makes the magic happen on the server side, so it’s far more efficient and transparent than client-side scripts.

Everything Else is Outside the Box

There are jQuery scripts to render hashtag streams, your friends’ streams, streams from lists, streams for migrating salmon and pretty much any other kind of stream you can think of. There are also scripts that tap way deeper into the API than is really polite, but we don’t talk about those at the dinner table. And of course you can hand-roll your own PHP funness if you’re so inclined. Which I’m not. If yr dum like mee, grab these sweet plugins and let them do the lifting for you.

, , , , ,

commentary + criticism


wrote the following on Monday March 15, 2010

Great article and thanks for the mention of my plugin, arc_twitter. Just a couple of points: arc_twitter also links hashtags to the Twitter search results and should correctly handle all URLs (I spent some time improving this for version 0.2). Have you found this to not be the case? I’d appreciate the feedback as I am constantly trying to improve the plugin. Secondly, the big difference between mem_twitter and my plugin is that arc_twitter lets you opt in-or-out of tweeting articles as you post as well as add hashtags to the tweets.

My aim has always been to create a complete solution for integrating Twitter with Textpattern. The plugin is constantly being developed and suggestions for changes and enhancements are always welcome. The current functionality is a long way from the original release. I’m always happy to add to the list of things to do.


wrote the following on Monday March 15, 2010

Andy —

Thanks for calling into the show. :) Regarding your comment:

  1. I did in fact have trouble with the URL parsing. I tested this pretty heavily. It handled and other short URLs just fine, but was having trouble with URIs that included hyphens (it would grab the URL up until the first hyphen and then stop).
  2. Regarding your second point, I completely love this functionality. It’s why I have both plugins installed in TXP for this site. arc_twitter is handling everything from the admin side.

Really great work, and thanks for contributing to the TXP community in general.


wrote the following on Tuesday March 16, 2010

Hi Kevin, thanks for the feedback on the URL parsing. I thought that I had managed to catch hyphenated addresses (partly as it was developed for use on a site that has a hyphen in the URL). I will take a further look into this and get it fixed for future releases.

Oh and thanks for your final comment. I really enjoy working with the TXP community. There’s a lot of great people in it.

Brochure Printing

wrote the following on Thursday March 18, 2010

At first glance, this script looks like it will work better than what we’ve been using. I need to improve our twitter efforts, this is great first step.

Destry Wion

wrote the following on Monday March 29, 2010


It’s worth pointing out Bloke’s (Steph) smd_xml plugin, which is one of the big gems in the crown. It allows you to take any socmed feed, slice and dice it however you want, and output the stream in your Txp site.

With regard Twitter alone, it might not provide the level of control the other Twitter plugins have (indeed I don’t use it for Twitter), but it’s value for manipulating any other socmed stream too is proving very fun to play with. It allows you to skip having to use those third-party widgets that do the same thing (sometimes for a fee) but hardly as well and without the ability to completely customize the presentation. Go Steph!