Display Wordpress content outside of your blog

Wednesday, May 7th, 2008

Wordpress is a very powerful and flexible content management system (CMS) for blogs, and is among the first choices for anyone looking for a way to include dynamic content on their web sites. When using Wordpress to power a news or blog section of an existing web site, authors will often want to display a list of headlines or the latest post on the front page of the site, outside of the Wordpress-powered section. Using a bit of PHP and the Wordpress API, this is easy to do.

For the purpose of these instructions, I will assume that your web site URL is www.example.com and that wordpress is installed in a subdirectory at www.example.com/blog. I am also assuming a basic level of familiarity with HTML and editing files for the web.

The key to gaining access to the power of Wordpress from an outside page lies in the wp-blog-header.php file. This file loads the Wordpress application and makes its API, and therefor your content, available for use. Once this file is included in a page on your site, you will be able to use any Wordpress function just as if you were working in a Wordpress template.

Let’s add the latest post to the front page of our site. We’ve already got a blog at www.example.com/blog/ but it would be nice to show the latest entry alongside the rest of the information on the front page. If your front page files is already a PHP file, you’re ready to go; otherwise you’ll probably need to rename your front page file extension from .html to .php. (Be sure to test to ensure that doesn’t break anything!)

The first thing we’ll do is pull in that all-powerful Wordpress file, which we can do by adding this section to the very top of the page you want your post to appear on:

<?php
// Include Wordpress 
define('WP_USE_THEMES', false);
require('./blog/wp-blog-header.php');
query_posts('showposts=1');
?>

The first line of this block is simply a comment describing what we’re doing. The second line tells Wordpress not to display your templates, and the third line grabs that file I told you about. The final line performs a database query to retrieve the content we want to display on this page. In this example, we want the single most recent post, but the query_posts() documentation shows how to retrieve a variety of data.

Now we’ll move down in our page and find a good spot for this post. Once you’ve figure out where to put it, we’ll add a Wordpress loop which will display the single post retrieved above:

<?php while (have_posts()): the_post(); ?>
 
<?php endwhile; ?>

Once the loop is in place, we just have to decide what parts of the post to display, and write some HTML for them. Let’s say we want the post title and just an excerpt, followed by a link to the full article. We’d do something like this:

<?php while (have_posts()): the_post(); ?>
<h2><?php the_title(); ?></h2>
<?php the_excerpt(); ?>
<p><a href="<?php the_permalink(); ?>">Read more...</a></p>
<?php endwhile; ?>

If you’ve been writing Wordpress themes, you’ll immediately recognize the template tags used here. We’re using all the same functions for the title, excerpt, permalink, etc, that we do in a Wordpress template. Including wp-blog-header.php makes this all possible.

Bonus

You can even use this code to display blog posts on a completely separate web site, as long as it’s on the same server and you have filesystem access to the Wordpress directory on the original site. Simply modify the require() in the first block on this page to use the full path to your Wordpress installation:

<?php
// Include Wordpress 
define('WP_USE_THEMES', false);
require('/home/corvidworks/web/example.com/blog/wp-blog-header.php');
query_posts('showposts=1');
?>

Note: PHP restrictions such as open_basedir may prevent this last example from working.