How to Show the Latest WordPress Posts in an External Page

We have recently re-organized the Winwaed.com homepage, and needed a widget to show the titles of the latest blog posts. In common with many WordPress installations, the website consists of static pages and a separate WordPress installation. The widget needed to work in a PHP page external to the WordPress installation, but access the WordPress database.

It turns out that this is quite simple. The widget below is designed to allow quite a bit of customization, but you may wish to modify it further.

Here is the widget script:

<?php
////////////////////////////////////
// WordPress Widget
// (C) Copyright 2019 Richard Marsden
// Produces a snippet of HTML summarizing the most recent posts
//
////////////////////////////////////

// Change this path to your local WordPress installation

include('/path/to/your/website/wordpress-installation/wp-load.php');


// Call post_summary with the required number of posts, and the date format
// In production, we are using 'jS F Y' for the date format. This produces
// an English style date, eg. "2nd February 2019"
//
// Example: post_summary(5, 'jS F Y');

function post_summary( $num_posts, $date_format )
{
  $recent_posts = wp_get_recent_posts(array( 'numberposts' => $num_posts, 'post_status' => 'publish' )); echo '<section><ol style="list-style-type:none">'; foreach($recent_posts as $post) { $idate = strtotime($post['post_date']); $date_string = esc_html( date( $date_format, $idate) ); $categories = get_the_category($post['ID']); $category_links = ""; $count = 0; foreach ($categories as $term) { if (++$count > 2) break; if (strlen($category_links) > 0) $category_links = $category_links . ",&nbsp;"; $link = get_category_link( $term->cat_ID ); $category_links = $category_links . '<a href="' . $link . '">' . $term->cat_name . '</a>'; } echo '<li class="wp_entry">'; echo '<span class="wp_post"><a href="', get_permalink($post['ID']), '">', $post['post_title'], '</a></span>'; echo '<div class="wp_desc"><span class="wp_date">', $date_string, '</span><br/>'; echo '<span class="wp_categories">', $category_links, '</span></div>'; echo "</li>"; } echo '</ol></section>'; } ?>

This produces a section of HTML wrapped in a <section> tag around a <ol> ordered list tag. Each blog post is then contained within an <li> tag. All elements are formatted with CSS classes.

To use this script in a PHP page, you will first need to include it, and define the CSS classes:

<?php
include "path/to/wp_widget.php"; // wordpress widget
?>

<style>
.wp_entry  { padding-bottom:0.8em; margin-left:-1em }

.wp_post span a, .wp_post  { font-weight:bold; font-size:90% }

.wp_desc { font-size: 70%; }
.wp_date { font-style: italic; }
//.wp_categories { font-size:1em; line-height:0.1em }
</style>

Then to call the widget, insert the following PHP at the required location:

<?php
// 5 latest WordPress Posts with "2nd February 2019" formatting
post_summary(3, 'jS F y');
?>

The end result can be seen on the homepage. Each post is listed with a hyperlink to the article, the date of publication, and at most two categories. The categories also links to the category index pages.

The core functionality is in the call to wp_get_recent_posts(). This fetches the basic post information. Further information is queried using each post’s ID, or the category IDs. All of the WordPress API is made available using the include to wp-load.php in the WordPress installation.

The above script could be easily modified to show the latest pages instead of posts. For very busy sites, the result could also be cached to a text file on the web server. If the date of the text file is older than 5 minutes (say), then it could be re-generated.

When you update your blog on a regular basis, there is a need to send email updates to you email subscribers. Luckily there is a wide choice of email marketing software, so you can choose MailChimp or find something better than MailChimp. It depends on your marketing goals.

Leave a Reply