WordPress

Displaying latest and most popular blog posts in your WordPress footer

Fat footers are very handy for displaying additional information on your site. On a previous version of this website I used to display the latest blog posts, while on this newer version I opted to display the popular posts. I thought I would share these code snippets here.

Display Recent Blog Post

In your footer.php file, simply use the following code:

<ul>
<? query_posts('showposts=10');?>
<?php while (have_posts()) : the_post(); ?>
<li><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></li>
<?php endwhile; ?>
</ul>

Simply change ‘showposts=10′ to whatever number you want to display more or less than 10 posts.

Display Most Popular Blog Posts

“Most popular” posts in this case is defined by the posts that have the most comments. In order to select these, the following pieces need to be used:

1. Add the following function to your function file:

function most_popular_posts($no_posts = 10, $before = '<li>', $after = '</li>', $show_pass_post = false, $duration='') {
global $wpdb;
$request = "SELECT ID, post_title, COUNT($wpdb->comments.comment_post_ID) AS 'comment_count' FROM $wpdb->posts, $wpdb->comments";
$request .= " WHERE comment_approved = '1' AND $wpdb->posts.ID=$wpdb->comments.comment_post_ID AND post_status = 'publish'";
if(!$show_pass_post) $request .= " AND post_password =''";
if($duration !="") { $request .= " AND DATE_SUB(CURDATE(),INTERVAL ".$duration." DAY) < post_date ";
}
$request .= " GROUP BY $wpdb->comments.comment_post_ID ORDER BY comment_count DESC LIMIT $no_posts";
$posts = $wpdb->get_results($request);
$output = '';
if ($posts) {
foreach ($posts as $post) {
$post_title = stripslashes($post->post_title);
$comment_count = $post->comment_count;
$permalink = get_permalink($post->ID);
$output .= $before . '&raquo; <a href="' . $permalink . '" title="' . $post_title.'">' . $post_title . '</a>' . $after;
}
} else {
$output .= $before . "None found" . $after;
}
echo $output;

In this function, I’ve set the number of posts to 10 – ‘$no_posts = 10‘. Just change this number to display more or less posts.

2. Insert the following in your footer.php

<ul>
<?php most_popular_posts(); ?>
</ul>

WordPress revision control

In an earlier post, I discussed the handy revision control plugin. Plugins are awesome and I truly have immense respect for plugin developers, but I do find them a bit tedious to maintain and sometimes a bit of an overkill.

I am constantly fiddling and updating over 30+ client sites at a time. If WordPress and plugin updates didn’t come out as frequently, I would be more than happy to load my sites with dozens of plugins, but I do find simpler non-plugin methods more handy.

I recently discovered that post revisions can be disabled or limited simply by adding the following bit of code to the wp_config.php file.

define('WP_POST_REVISIONS','5'); //Will limit revision to 5 revisions

define('WP_POST_REVISIONS','false'); //Disables revisions totally

Personally, I think that one line of code is better than a plugin.

Display your latest tweet(s) on your website

I recently worked with Magnify Digital on a website for a very interesting group of people in the Fraser Valley. These folks are concerned about Air Quality and thus have come up with a website and community to address these issues.

A big part of the website was the social media aspect. Thus facebook, twitter and youtube feature prominently on the website. There are plenty of WordPress plugins that allow you to display your latest tweets, but I wanted a simpler solution. The following piece of code proved to be just what I needed:

<?php
$username = "yourTwitterUsername";
$limit = "1"; // Number of tweets to pull in.

/* These prefixes and suffixes will display before and after the entire block of tweets. */
$prefix = ""; // Prefix - some text you want displayed before all your tweets.
$suffix = ""; // Suffix - some text you want displayed after all your tweets.
$tweetprefix = "<p>"; // Prefix - some text you want displayed before each tweet.
$tweetsuffix = "</p>"; // Suffix - some text you want displayed after each tweet.

$feed = "http://search.twitter.com/search.atom?q=from:" . $username . "&rpp=" . $limit;

function parse_feed($feed, $prefix, $tweetprefix, $tweetsuffix, $suffix) {

$feed = str_replace("&lt;", "<", $feed);
$feed = str_replace("&gt;", ">", $feed);
$feed = str_replace("&quot;", "\"", $feed);
$feed = str_replace("&apos;", "'", $feed);
$clean = explode("<content type=\"html\">", $feed);

$amount = count($clean) - 1;

echo $prefix;

for ($i = 1; $i <= $amount; $i++) {
$cleaner = explode("</content>", $clean[$i]);
echo $tweetprefix;
echo $cleaner[0];
echo $tweetsuffix;
}

echo $suffix;
}

$twitterFeed = file_get_contents($feed);
parse_feed($twitterFeed, $prefix, $tweetprefix, $tweetsuffix, $suffix);
?>

Basic blog theme updated

A few years ago, I was asked to teach how to use WordPress to students enrolled in the Electronic Media Design Program at Langara. The goal was to provide the students with enough knowledge and understanding of WordPress so that they can create an online portfolio.

Download the Basic Theme Files

Once the curriculum in place, my first decision to make was what theme to start with. At the time, WordPress version 2.6 was around and I didn’t particularly want to use the Kubrick theme. I always disliked it and found it too messy. I had built quite a few sites with a now defunct theme, and decided that if I removed all of the unnecessary code and style, this theme would be a great starting point for my class and all of my projects. Thus was born the Basic Blog theme.

This theme has all the functionality of a typical WordPress theme but very little styling. It’s a bare bones theme or a framework for you to work from and has the following following features:

• Two column website measuring 960px wide.
• Widget enabled.
• Sidebar can be positioned on the right or left simply by switching the float direction in the CSS.
• Can be used to create a website with blog and static pages or just static pages if no blog is required.
• Requires no plugin.

Having gone through 3 intakes of students, I’ve had many opportunities to refine the theme. With the release of WordPress 3.0, I’ve now had to make further updates and the theme now also includes the following:

• Custom post thumbnails
• Custom menus
• Easy jQuery integration
• Excess information from header file is removed

Here’s a copy of the Basic Theme for you to download and play with. If you have any suggestions, comments on how it could be improved, please let me know.

I would also like to say thanks to Tzaddi and Catherine for providing their input on this theme and of course to all my EMD students who have thought me so much.

Is WordPress a Content Management Solution?

I had the privilege of sharing the stage with Cameron Cavers and Dave Zille this weekend at
WordCamp Vancouver, and discussed the merits of using WordPress as a CMS.

Some of you might have disagreed with me when I answered No to the question ” Is WordPress a CMS?” I probably should have said Yes AND No…

I’ve been using WordPress for a number of years now. Version 1.2 might have been the first version I worked with. Originally built as a blogging platform, WordPress 1.2 mainly focused on Posts. The ability to display anything but your blog posts on your home page didn’t exist and I’m not even sure Pages were around. When compared to larger CMS built by Oracle, IBM and Microsoft some would argue that WordPress isn’t a CMS mainly because of the lack of approval process. Content types in WordPress are also limited, but WordPress 3.0, due for release anytime soon, is about to change that. Custom post type and menu management will offer us much more flexibility to manipulate content and thus enhance WordPress’s CMS ability. No changes in approval processes are expected for WordPress, but personally I don’t think that there’s a need for this. If this is all that it takes for WordPress to gain the title CMS, then I think it can do without. Organizations and companies looking for sophisticated approval processes usually have many layers of bureaucracy and probably won’t be looking for a free CMS anyway.

Looking back at an older versions of WordPress, it’s interesting to see how the platform and community has evolved. I’m not sure that Matt and the folks at Automattic perceived that one day WordPress would become much more than a blogging platform and be used as a CMS. I can only see great improvements and exciting features when I look at WordPress’s evolution and I won’t be looking at another CMS solution for a long time.

WordPress categories vs tags. What’s the difference.

WordPress and most other blogging platforms allow you to organize your content in one of two ways: Categories and tags. I’ve often been asked about tags and so thought I would write my thoughts down. Personally, I don’t use tags. Here’s why.

Categories are easy to grasp
Sorting out your blog posts is crucial. This simple act alone will tell your readers what your blog is about. I currently have 291 posts organized in 22 categories. Visitors to my site can clearly see what my blog is about simply by scanning the category list. I like to think that these categories are similar to the sections of a book store or library. If you’re looking for the latest Neil Gaiman novel, you’re most likely to go in the Fiction section instead of the cookbooks. The same is true for your blog categories.

Thus when planning your blog, you should think of broad categories that will guide your users towards the content they are seeking.

Tags are too personal
On the other hand, tags aren’t very logical. As Michael Fields pointed out in his excellent article, tags are found on items sold at department stores and on Christmas presents. When applied to blog posts, they don’t make as much sense and are highly personal. Sites such as Delicious and Flickr use tags and I find myself frustrated to see that there is no proper tagging convention.

As a result I find myself only using categories and so far have never had a request asking me where are my tags? Perhaps that’s because my blog is simple and doesn’t have that many articles. A blog with numerous writers or that focuses on many different subjects may benefit from the combination of both tags and categories. In fact a complex blog may also benefit from Custom Taxonomy. Michael Feilds’s article describes how custom taxonomy can be used to organize your blog in new and exciting ways. I highly recommend that you have a look at it and learn about the many ways you can use tags appropriately.

Is WordPress Killing Web Design?

During the 2010 SXSW Interactive Festival designers debated whether or not WordPress is killing web design. The idea is that WordPress and other CMS are constraining designers to think outside the box and turning them into lazy designers. I was quite pleased to hear that no one on the panel agreed with this statement. Brendan Dawes, one of the panel members pointed out that WordPress is simply a tool that manipulates data. Said in another way, Gina Bolton confirmed what I believe, which is that WordPress is highly customizable and can be made to do whatever you want.

One of my latest project consisted of converting a design provided by Mizu Creative into a WordPress site for Paul Sangha. The site included a photo gallery which required jQuery animation, a few different templates, random background images and flash on the home page. I’m very proud of this work, but more importantly, by the fact that it looks nothing like a WordPress site.

I’ve worked with many graphic designers in the past and when asked about constraints, my only suggestions is to keep the width of the canvas to 960px. This constraint is only there to ensure that the site will look good on most browsers, but even this is debatable and will depend on the target audience.

The Paul Sangha website is a great example which demonstrates that designers should not be constrained by the CMS.

Customizing widget areas to display different page and post sidebars

Don’t you just hate it when you launch a site, hand it off, get paid and a few weeks later the client says, you know… I think I want to change the templates now. This is not working for me.

My first reaction when I hear this is, “crap, I didn’t do my job properly, how can I fix it“. And the reality is, that without user interaction, it’s often difficult to anticipate what they and the client will want and so this type of feedback should be expected and in fact welcomed.

My last project with Tod Maffin allowed me to learn a great deal from such a request for change.

Continue reading »

Chris Coyier’s Blank WordPress Theme

In case you missed it, a few weeks ago, Chris Coyer, one of the authors of “Digging into WordPress“, released his blank theme. In his article he states the following:

I have a “blank” WordPress theme for myself, because I make a lot of WordPress themes. Starting from Kubrick, or any other pre-made theme, would be absurd. There is to much stuff there that would have to be stripped out or fought against to be useful. So, I have my own.

Music to my ears. When I started using WordPress years ago, I couldn’t get my head around Kubrick. Cleaning the code took way too much time and energy. I originally created my own theme for a WordPress class. In order to teach students how to theme a site in 6 weeks, I needed something clean and void of excess stuff so I set up my Basic Theme.

I was thus curious when I read Chris’s article and downloaded his theme. It’s super clean and to my delight it’s not so different from mine. I have a lot more CSS than he does and he’s got some fancy stuff going on in his header.php, but overall I would highly recommend it. Starting from a clean theme to design a WordPress site is the best way to work. If you haven’t had a chance to try a blank theme, you should check it out.

Add unique styles to your pages using the body_class() function

When WordPress 2.8 was released, a new function called body_class() was made available to developers allowing us to style our pages differently. This new function places a location-specific class on the opening <body> tag. I must admit, I missed this function when it came out and only discovered it recently. But it’s proved very useful. I can now specify different background images for my pages and posts.

Here’s how to do it.

Open up your header.php file and change <body> to <body <?php body_class(); ?>>

The function will automatically generate extra html code. Have a look at the source code to see what classes are available to you and simply create new styles.

For example if you have an about page which has a page id equal to 2, you will notice the following code:

<body class="page page-id-2">

In your css, you could add a new style such as

body.page {background:yellow;}

This would change the background of all your pages to yellow.

Or

body.page-id-2 {background:yellow;}

And now the yellow background will only be applied to the page with id #2.

Nathan Rice wrote up a great article about the body_class() function and you can, of course, get more information by visiting the Codex.