Blog design Blogs Highlights Journalism Newsroom tech Open source

How to use WordPress to run a magazine, news website

This article records steps I took in using WordPress to run an online lifestyle magazine, how I made it more “magazine-like” and less like a blog. Bloggers can also use the guide if they want a different presentation of their blog.

WordPress is a great tool for online writers. It’s simple and yet is such a pleasure to use. Yes, there are things that need to be improved but WordPress being an open source software, you can expect continuous improvements on it by the community.

The ease by which sites can be created and run through blogging software like WordPress allow writers previously without publishers to print their works online. The problem with using a blogging software to manage your website, however, is that the tool defines the character of your site.

Once in a while, I see blogs that seem better off presented as online magazines or news websites rather than as blogs.

WordPress, however, is an extensible website content management system that can be used to run magazine-type websites. Here are steps I took to turn this online magazine on Cebu from a blog into its current presentation. I’m still working on it, though, so you might encounter issues. (Update Jan. 9, 2008: I have redesigned the site. It’s now using an even better theme that I’m still working on. I will be releasing this theme soon.)

For those interested, I will be releasing this theme (based on Nautica05 of Open Source Templates) and in two flavors: one as one-click install blogging template and another as framework for a magazine-type website.

Categories as sections

Like any blog software, WordPress displays articles, regardless of categories, in reverse chronology, with the newest entries posted first. This publication format is what usually bugs site owners who want to produce a magazine website using a blogging software.

In Cebu Living‘s case, site owners wanted to publish shorter news articles without these posts pushing down feature articles they wanted to highlight. You can, of course, highlight the feature articles by listing it in the sidebar but there’s an even better way of doing this in WordPress–by using categories to manage website sections and then fetching the stories by category in the homepage. (Click on photo to view larger image of how sections are managed in the site.)

What Cebu Living did was assign the biggest story (equivalent to a newspaper’s page 1 banner article) to a Banner category and the articles they want to highlight (to serve as the site’s second, third or fourth story) to a Feature category.

wordpress as magazine cmsTechnically, the banner story should also be in the Feature category since it is a post you want to feature but to prevent it being displayed twice in the homepage (one as banner and another as part of the latest stories section), the banner story isn’t assigned to the Feature category yet. It is only assigned to that category when there is a new banner story. In effect, it becomes the site’s 2nd biggest story and goes down in the news value hierarchy as you add newer banner stories.

Index page as portal

With the stories getting their category assignments, the index.php file is then edited to display articles in blocks of categories. In Cebu Living’s case, the site uses three blocks: one to call the banner, another to display the recent feature stories and the last block to contain news and link posts to articles about Cebu.

To display articles in category blocks, do not use the WordPress loop to generate the articles. Delete The Loop in your index.php starting from: <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?> until <?php endwhile; else: ?> <p><?php _e('Sorry, no posts matched your criteria.'); ?></p> <?php endif; ?>

Replace it with category listings using this code by Rhymed Code:

<?php $posts = get_posts( "category=12&numberposts=4" ); ?> <?php if( $posts ) : ?> <?php foreach( $posts as $post ) : setup_postdata( $post ); ?> <h2><a href="<?php the_permalink() ?>" title="Permanent Link to <?php the_title(); ?>"><?php the_title(); ?></a></h2> <?php the_content("Continue reading '" . the_title('', '', false) . "'"); ?> <?php endforeach; ?> <?php endif; ?>

What the code above does is display the four most recent posts under category 12. Change the category number to your category’s actual numerical ID (go to Manage > Categories and list the IDs of your categories). If you only want to list the headlines, take out this part of the code: <?php the_content("Continue reading '" . the_title('', '', false) . "'"); ?>

Just change the styling of the post elements to reflect your website’s style sheet.

If you change your index.php using the steps listed above, you need to have a category.php file with the WordPress loop or readers will be presented with your homepage when they try to view category pages.

Category pages

According to the WordPress Codex, when WordPress displays a category page, it looks for a category-(numericalID of category).php template file and if it can’t find one, for a category.php file, and if there isn’t one, for an archive.php file and if all these aren’t present, it will use the index.php file. The stories under the category are then listed using the WordPress loop.

This hierarchy of files to be used to display the category allows you to control the layout of your category pages to mimic the display of website sections. Say your news category ID is 6, you can control how the News category page looks by editing the category-6.php file. You can even display a different header for each category by changing the <?php get_header(); ?> code at the top of the file with <?php include(TEMPLATEPATH . '/filename of header for your category.php') ; ?> to display a different header for a particular category page. Just copy your current header.php and then edit the part that displays header elements such as logos, menu items or images.

Summary blurbs

Many magazines have one-paragraph summaries of or introductions to the article. You can do this in your WordPress-powered magazine by including a summary or introduction in the Optional Excerpt just below the Upload window in the Write Post interface. You can then display the summary by using the <?php the_excerpt(); ?> code in your single.php file.

You can style it as a floating div if you want, with a different background color to make it stand out. For this to work, however, you need to write an excerpt for your article. If you do not specify one, WordPress will print as excerpt the first 120 words of the post-so you’ll end up with duplicate text in your article page if you use article summaries and intros using the excerpt.

Those familiar with more portal-type or publication-oriented CMS may say that you’d be better off using another package like Props or Drupal but hey, you can do it with WordPress. I can’t say how this compares with Drupal because I haven’t tried using it extensively. I’ve long been planning to experiment with it, though.

Compared with Props, however, I see the above setup as a better solution if you’re a small group that wants to put up an online publication. Props is more rigid and handles content by issue dates. Last time I checked (and it wasn’t an extensive test although I’ve also been meaning to try it for so long), you handle all stories by publication staging.

Props is a solution for more traditional publication companies with teams of editors and reporters and with specific publication cycles like daily newspapers or weekly news magazines.

(Note: I used a webzine as an example for this article. I am currently creating a news website using the techniques I listed above. When I finish it, I’ll write another blog post about it. Sign up for my e-mail alerts or RSS feed to be notified when I post it.)

By Max Limpag

Max is a journalist and blogger based in Cebu City, Philippines. He is co-founder of the journalism start-up InnoPub Media.