inFocus WP Theme: Customising WP-PostViews and Efficient Related Posts Plugins

6. Adding the WP-PostViews Plugin to the Footer Looks Weird!

All well and good, but if you now want to include the WP-PostViews plugin in the inFocus Footer as well this is what you’ll get:

WP-PostViews plugin displayed in the footer

Hmmmmm…. not pretty. The problem is that the plugin only allows for one Most Viewed Template to be used. We need a way to define and use a second template. To do this we need to first amend the plugin’s configuration settings.

Open the plugins/wp-postviews/postviews-options.php file and locate this code block:

### Form Processing
// Update Options
if(!empty($_POST['Submit'])) {
	$views_options = array();
	$views_options['count'] = intval($_POST['views_count']);
	$views_options['exclude_bots'] = intval($_POST['views_exclude_bots']);
	$views_options['display_home'] = intval($_POST['views_display_home']);
	$views_options['display_single'] = intval($_POST['views_display_single']);
	$views_options['display_page'] = intval($_POST['views_display_page']);
	$views_options['display_archive'] = intval($_POST['views_display_archive']);
	$views_options['display_search'] = intval($_POST['views_display_search']);
	$views_options['display_other'] = intval($_POST['views_display_other']);
	$views_options['template'] =  trim($_POST['views_template_template']);
	$views_options['most_viewed_template'] =  trim($_POST['views_template_most_viewed']);
	$update_views_queries = array();

After line 42, insert this highlighted code:

	$views_options['most_viewed_template'] =  trim($_POST['views_template_most_viewed']);
	$views_options['most_viewed_template_footer'] =  trim($_POST['views_template_most_viewed_footer']);
	$update_views_queries = array();

We now have a new option named most_viewed_template_footer which will store the additional template we’ll be using named views_template_most_viewed_footer.

Next, locate this code block:

<script type="text/javascript">
	/* <![CDATA[*/
	function views_default_templates(template) {
		var default_template;
		switch(template) {
			case 'template':
				default_template = "<?php _e('%VIEW_COUNT% views', 'wp-postviews'); ?>";
				break;
			case 'most_viewed':
				default_template = "<li><a href=\"%POST_URL%\"  title=\"%POST_TITLE%\">%POST_TITLE%</a> - %VIEW_COUNT% <?php _e('views', 'wp-postviews'); ?></li>";
				break;
		}
		jQuery("#views_template_" + template).val(default_template);
	}
	/* ]]> */
</script>

This JavaScript function is executed when one of the two Restore Default Template buttons is clicked in Settings > PostViews and, as you’d expect, restores the appropriate default template depending on the value of the string passed to it. Currently, these values are either template or most_viewed.

After the second case statement add this highlighted code block:

			case 'most_viewed':
				default_template = "<li><a href=\"%POST_URL%\"  title=\"%POST_TITLE%\">%POST_TITLE%</a> - %VIEW_COUNT% <?php _e('views', 'wp-postviews'); ?></li>";
				break;
			case 'most_viewed_footer':
				default_template = "<li> \n\t<a href=\"%POST_URL%\"  title=\"%POST_TITLE% (%VIEW_COUNT% views)\">%POST_TITLE% </a> \n</li>";
				break;
		}
		jQuery("#views_template_" + template).val(default_template);

Now we have the HTML for our new template, stored in the variable default_template, should we wish to restore it to it’s default.

The third and final change we need to make to this file is to add the form elements to Settings > PostViews that will allow us to modify and save the HTML for the new template.

Find this code block and immediately after the closing </tr> tag insert the highlighted code:

<tr>
			<td valign="top">
				<strong><?php _e('Most Viewed Template:', 'wp-postviews'); ?></strong><br /><br />
				<?php _e('Allowed Variables:', 'wp-postviews'); ?><br />
				- %VIEW_COUNT%<br />
				- %POST_TITLE%<br />
				- %POST_EXCERPT%<br />
				- %POST_CONTENT%<br />
				- %POST_URL%<br /><br />
				<input type="button" name="RestoreDefault" value="<?php _e('Restore Default Template', 'wp-postviews'); ?>" onclick="views_default_templates('most_viewed');" class="button" />
			</td>
			<td valign="top">
				<textarea cols="80" rows="15"  id="views_template_most_viewed" name="views_template_most_viewed"><?php echo htmlspecialchars(stripslashes($views_options['most_viewed_template'])); ?></textarea>
			</td>
		</tr>
		<tr>
			<td valign="top">
				<strong><?php _e('Most Viewed Template [Footer]:', 'wp-postviews'); ?></strong><br /><br />
				<input type="button" name="RestoreDefault" value="<?php _e('Restore Default Template', 'wp-postviews'); ?>" onclick="views_default_templates('most_viewed_footer');" class="button" />
			</td>
			<td valign="top">
				<textarea cols="80" rows="15"  id="views_template_most_viewed_footer" name="views_template_most_viewed_footer"><?php echo htmlspecialchars(stripslashes($views_options['most_viewed_template_footer'])); ?></textarea>
			</td>
		</tr>
	</table>

So we can better understand how these changes tie together, lets take a look at a few things.

On line 196 we’ve defined the Restore Default Template button which, when clicked, will execute the JavaScript function views_default_templates passing it the string most_viewed_footer.

Line 199 defines the textarea where we can view and modify our new template. The textarea has an id of views_template_most_viewed_footer which is used when populating the new option we defined earlier: most_viewed_template_footer. In turn, the contents of this option are displayed as the current template.

Now that we have our new template we need to tell the inFocus theme which template it should use. You may recall that to include the WP-PostViews plugin we have this line of code in lib/includes/template-single.php:

<?php get_most_viewed('post', 5); ?>

The first parameter passed to get_most_viewed() determines if we want to show posts, pages or both. The second, determines the number of posts to display. If we look at the get_most_viewed() function in wp-content/plugins/wp-postviews/wp-postviews.php we can see that it takes another two parameters: $chars and $display.

function get_most_viewed($mode = '', $limit = 10, $chars = 0, $display = true) {

If omitted, these parameters are defaulted to 0 and true respectively.

We need to add a fifth parameter, $use_infocus_theme_style, with a default value of true like so:

function get_most_viewed($mode = '', $limit = 10, $chars = 0, $display = true, $use_infocus_theme_style = true) {

Next, locate this line:

$temp = stripslashes($views_options['most_viewed_template']);

And replace the entire line with this:

if ($use_infocus_theme_style) {
	$temp = stripslashes($views_options['most_viewed_template']);
} else {
	$temp = stripslashes($views_options['most_viewed_template_footer']);
}

Now if we omit the $use_infocus_theme_style parameter it will display posts in the inFocus theme style. If we send it a value of false it will display posts using our new template.

And finally. To display posts in the Footer we’d normally add the WP-PostViews widget to the Footer sidebar. However, the widget has no way of knowing which template to use. So, we have to add some PHP code directly to the Footer sidebar that will execute the get_most_viewed() function. We can’t use the Text widget to do this because it won’t accept PHP code, only HTML and text.

First, download and install the PHP Code Widget WordPress plugin. Next, add the PHP Code widget to the Footer’s sidebar and paste this code block into it:

<?php get_most_viewed('post', 5, 0, true, false); ?>

And that’s it!

In conclusion then, this is a fairly lengthy customisation for something that’s entirely cosmetic and perhaps quite trivial. Whether it’s worth the effort or not, I’ll leave up to you.