The annual LKL site overhaul

Twitter Pic

August is usually the month when I tweak LKL’s look and feel with a new theme or new functionality. This year, I’m a month late – the delay being caused mainly by the complexity of unpicking the coding behind the Thesis theme which I use.

My task this year was to re-jig the way I integrate my Twitter posts into the pages you see on LKL. The tool I use to do this is Twitter Tools, a useful plugin which can publish your blog posts to Twitter, and conversely can integrate your Twitter posts into your blog. The former is useful for effortlessly syndicating your content to as wide an audience as possible, while the latter enables you to keep all your content, big and small, in one place.

Integrating your tweets into your blog

Integrating your tweets into your blog can be done in one of three ways.

(1) The lightest but most ephemeral way is to simply publish an RSS feed from your Twitter account into a widget on your sidebar. Twitter Tools has a widget which does that, but any RSS reader will do. But that way, the content is never saved to your blog’s database.

The alternative way is to physically load your tweets into your blog’s database, enabling them to be published, styled, searched and backed up. Twitter Tools has two ways of doing this:

(2) to save up a bundle of your tweets and then publish them in one daily or weekly digest (so you have a blog post that contains several tweets); or

(3) publish tweets as individual posts.

The advantage of weekly digests

When I started using Twitter Tools two years ago I adopted the former approach. I was following the approach followed by the Marmot, ROKDrop and others in publishing a weekly summary of interesting links they’d found on the web. So, every Sunday the plugin would publish the tweets I’d posted on my Twitter account, and I’d spend a couple of hours adding images (particularly a post thumbnail), formatting, tagging, categorising, re-ordering and stripping out the dross. The result was, for me, a useful round-up of the week’s happenings.

Over time, the number of weekly digests has grown to around 100.

The disadvantage of weekly digests

I’m sorry to have to say it, but the main audience I really blog for is me. If other readers find what I write useful, that’s great. But really LKL is one big personal filing cabinet of my interaction with Korean culture. And what’s the point of a filing cabinet if you can’t find things? Often I found myself trying to find an individual tweet on my site, a tweet which linked to a particular news item in the Korean press, or which had a particularly fine picture of a decorative girl band. But the elusive tweet was hard to find. Why was that? I had been pretty diligent in tagging and categorising my digests, but nevertheless a post can only have one thumbnail. So if a digest had ten tweets on the subject of girl bands, exhibitions in Seoul, and that particular review of a Korean novel I was wanting to find, the likelihood was that when I hunted for it the search results page would present me with a bunch of digests which had teasers and thumbnails mostly about girl bands – all very pleasant but not helping me much to determine whether the digest contained the tweet I wanted.

The advantages of Asides

The obvious solution to this problem was to break up these digests into individual tweets or “Asides”. Then in the search results page they would appear with their own thumbnails and you can home in on the post and link you want immediately. The downside is that the number of posts and related metadata starts to balloon the size of the database. But websites much bigger than LKL use WordPress as a CMS and seem to cope.

How I made the change

“Asides” on a WordPress blog predate the rise of Twitter, but do much the same thing content-wise. When you really don’t have much to say, a few words suffice. But because an aside is much shorter than a normal post, and because it doesn’t have a heading, displaying them as a normal post on the home page can mess up the look of a site. So moving to individual Asides for your tweets have aesthetic implications for your site. Here’s what I’ve done so far to address this.

First step of course was to stop Twitter Tools publishing my Tweets as a weekly digest, and instead publish them individually in the category “Aside”. That’s a simple process of tweaking the configuration on the plugin’s main settings page.

How to exclude a particular category from your WordPress front page

Second step was to block all Asides from being published on the front page of my blog. So what I’ve done is filter out all Asides from the query that selects the posts for the front page by dropping a custom function into my templates. The way to do this within the Thesis framework is to drop the following into your custom-functions.php file.

function exclude_category($query) {
if ( $query->is_home ) {
$query->set('cat', '-961');
}
return $query;
}
add_filter('pre_get_posts', 'exclude_category');

Where 961 is the number of my Aside category (yes, I know I have a lot of categories)

How to publish recent posts from a particular category in the sidebar

The third step was to gather together all the most recent Asides and put them in a widget in the sidebar. Here’s the code I used:


<?php
global $post;
$args = array( 'numberposts' => 10, 'category' => 961 );
$recentasides = get_posts( $args );
foreach( $recentasides as $post ): setup_postdata($post); ?>
<div id="post-<?php the_ID() ?>" class="asides">
<?php
// check for thumbnail. Note that thesis_thumb is the custom field which contains the thumbnail URI
$thumb = get_post_meta($post->ID, 'thesis_thumb', $single = true);
?>
<?php // if there's a thumbnail, use it
if($thumb !== '') { ?>
<a href="<?php the_permalink(); ?>"><img src="<?php echo $thumb; ?>"
alt="<?php echo the_title(); ?>"
/>
</a>
<?php }
// if there's not a thumbnail, substitute the LKL logo
else { ?>
<a href="<?php the_permalink(); ?>"><img src="http://londonkoreanlinks.net/my-logo-location.jpg" alt="<?php echo the_title(); ?>" /></a>
<?php } // end if statement
?>
<div class="excerpt-content">
<?php the_excerpt_rss(30,2); ?> (<a href=""><?php the_time('d-M-y') ?></a>)
</div>
</div><!-- .post -->
<?php endforeach; ?>
<a href="http://londonkoreanlinks.net/category/asides/">Read more Asides</a>

Styling these was really a matter of trial and error. Firebug is a useful tool for experimenting with what effects a particular css tweak has on your site. It was also important to run all this on my test site first and run the results through the html validator to make sure I’d done the coding right.

Note that by default the Asides are published with a small thumbnail consisting of the LKL Logo. I can subsequently edit them to include a more appropriate image. This takes a few minutes per Aside – something I can do on a daily basis instead of committing myself to a job of an hour or so every weekend, which is what I had to do with a weekly digest.

I dropped this code into an Advanced Text Widget, which can understand php and which has conditional logic so that the widget only displays on the pages you want it to. I set it to display on all pages other than the Aside category archive: after all, you don’t want to see the same content both in the sidebar and in the main content area.

Tidying up the Archive pages

I then needed to do a bit of work to make other category archives look OK. The result of the above coding is that I will have a mixture of proper posts and Asides showing – the latter of which don’t have headings and whose content will be shorter than the teasers that show for the main posts. I might try tweaking the length of the default teaser text in due course, but the priority is to give all Asides an imaginative default title such as “Aside” (just so that people know that the text they see on the archive page is all they are likely to get if they click on the post thumbnail).

The Thesis framework I find very difficult to hack, and I eventually found that the place that they construct the teaser text is in a separate php file called Teasers.php. I made the following edit to the function thesis_teaser_headline().

In place of

echo '<h2 class="entry-title"><a href="' . get_permalink() . '" rel="bookmark" title="Permanent link to ' . get_the_title() . '">' . get_the_title() . "</a></h2>\n";

I put

	if (is_category ('asides')) {
		echo '';
	} elseif (in_category ('asides')) { 
		echo '<h2 class="aside-entry-title"><a href="' . get_permalink() . '" rel="bookmark" title="Permanent link to this aside">Aside</a></h2>'; 
	} else {
		echo '<h2 class="entry-title"><a href="' . get_permalink() . '" rel="bookmark" title="Permanent link to ' . get_the_title() . '">' . get_the_title() . '</a></h2>';
	}

I’ll need to be careful, if ever DIY Themes release a next version of Thesis, to rehack whatever new files they throw at us so that I get the same end result.

I’ve done all this without making use of the new WordPress Post Format functionality. Thesis doesn’t support it yet, and nor does Twitter Tools. But actually, having the treatment and styling of a post driven by its category rather than its post format seems to work just as well.

Whether I’ll unpick all these changes next year, who knows?