wordpress: building a "topics" site

Theme Modifications

This section is written for WordPress developers who know PHP and are  comfortable editing template files manually.

Category Descriptions

To get those nice rich category descriptions to show up at the top of Topic pages, add this code to your archive.php template (see full working example in the downloadable demo at bottom of this page).

Topic URLs

This is an optional step. By default, Topic pages will appear at /category/[slugname]. We prefer to display them at /topic/[slugname].

To make this happen, go to Settings | Permalinks and enter the word "topics" into the "Category Base" field.

Links to Related Content and Tag Cloud

For any given story page, we need to determine which categories it belongs to, and display links to all stories that are also in those categories (ideally a story is only in category at a time, though in practice, we need to assume that a story can be in multiple categories).

Somewhere near the top of the sidebar code (in sidebar.php), we need to reset the internal query that creates a "loop" for WordPress to iterate through, so it only iterates through the posts that really are related. Add code like this:

Now to display the actual related stories and tags. Note that we only display this block when viewing a category (topic) page or a single post. We don't show Related Stories or Tags on the Homepage, About page, etc.

The tag cloud is generated with WordPress' own internal function for this purpose. The tag cloud is global to the whole site - it does not attempt to filter for tags related to the current story (doing so wouldn't leave us with much of a tag cloud).

Serving suggestion -- season to taste.

External Links

Authors and Editors can create external links associated with a  category (topic). To make sure we only display links from the current category or categories, use:

Twitter Feed

We want to get the author's Twitter handle from the "Jabber" field in their profile, then retrieve their most recent three Tweets via the plugin we installed earlier.

Note the is_single() conditional here - we only display the Twitter feed on single post pages.

 

Banner images

One of the challenges of building a topic-centered site with WordPress is in customizing the banner images for various sections of the site, in such a way that site editors can change them themselves without manual template editing.  The goal is to have that banner image appear in place of the default whenever either the topic page or any story associated with that topic is viewed. In all other cases we want to fall back to a default image.

Our system uses a modified version of Category Images II (CI II) , which is the only plugin we could find that even came close to fulfilling this need. Even so, it isn't perfect and we had to modify the way it works a bit.  

Unfortunately, CI II  doesn't have a concept of a "default" image, so you'll need to code your fallback images in manually. Note the calls to the plugin-provided function calls ciii_category_images() and ciii_category_archive_image() below. See header.php in the demo theme for details.

In addition, there's the thorny problem of displaying banner images for posts that belong to more than one category. CI II is designed to show a series of icons -- one for each category the current post belongs to. But because you can only have one banner image per page, we've modified the view code slightly to  grab the image for the first category in the array. Not perfect, but it gets the job done. You'll find our modification in [themedir]/view/category-images-ii/category-images.php, which is a template file used when CI II images are displayed.

$categories[0] is the bit we changed. Note that this component is NOT contained in the plugin itself - if modifying your own theme rather than using ours, just copy the "view" folder out of our theme and into your own and you'll get the right functionality.

Author Pages

Our theme provides an author.php file, which displays the HTML-formatted bio field for a particular author, as well as a list of all stories that author has written. To get access to all of the author data, we'll need this awkward little gem at the top of the author template:

With that in place, we can now pull in the  author bio farther down the page with:

The story list will work like a standard WordPress loop.

To link to the author page from bylines in any template, use:

Again, a full working example can be found in our downloadable demo.

Download the Demo Theme

Please feel free to implement, augment, or modify this demo theme in any way you see fit. Just leave a comment or send us email - we'd love to know how it's being used out there!

Download Topic Central Demo

Comments

No comments yet (but you can be the first!)

You must be logged in to post comments.