Yup, we had to build a Blog!

We heard that all the cool guys have one. So we thought to give you a place to find out more about what we like - not only in webdesign, but in general. Plus, here you get to be the first to see what our next WP themes will look like.

How to Display your Featured Posts in WordPress

7

How to Display your Featured Posts in WordPress

As we all know, the standard way of displaying posts in WordPress is to have them ordered chronologically one below the other. However, if we take a look at some of the most popular sites on the web, we’ll see that this may not be the most effective approach.

These days, almost every mainstream site uses some kind of a featured posts/content section. Why? Well, there are probably many reasons, but I can only guess that the main one is to make their popular content even more popular, or to point out a piece of content that is likely to be important to the average visitor.

Here are some examples:

Mashable

Mashable

ProBlogger

ProBlogger

TechCrunch

TechCrunch

Now, how to get something similar? … Surprise, surprise, featured posts aren’t a standard functionality in WordPress, but you can take a couple of paths to enable them.

Improving your theme

Basically, your ability to display some featured posts depends on the theme you’re using. And if it doesn’t support featured posts then you will have to force it to do so (tweak the code in one way or the other).

Therefore, the most basic, and hassle-free approach is to simply get a theme that allows you to do this by default (I know that this isn’t the most helpful piece of advice possible, but I’m only reminding you of what we’re doing here at ThemeFuse – creating cool themes; you should get one).

For example, here are three of our themes that support featured posts right from the get-go.

NewsSetter – perfect for all kinds of online magazines.

newssetter

Home Quest – real estate agents brace yourselves!

homequest

Gadgetry – the newest FREE theme in our arsenal.

gadgetry

If getting a new theme is not a possibility for you then fear not, there are other ways.

Featured posts vs. PHP coding

Let’s start with the all-manual way of enabling a featured posts section on your blog. This will involve some PHP coding. Not much though.

Start by creating a new category on your site. Name it “featured” to make everything clear.

Now, whenever someone is creating a new post and they want it to appear in the featured section, the only thing they will have to do is assign it to that category. So even though the method itself involves some PHP coding, the end-user usage is very straightforward.

Here’s the difficult part. You have to edit the index.php file of your theme (or wherever else you want to display the featured posts section) and add some new lines of code.

(It’s actually a lot better to create a child theme and make any changes there. This way if your theme gets updated, you won’t lose your custom code.)

The exact place where you’re going to include this code is up to you and depends on your design, but the most common placement is somewhere above the main content loop:

if(have_posts()) : while(have_posts()) : the_post();

This following piece of code is what you can use (an example I got from here). It creates a new DIV that holds your featured posts section.

<div id=”featured”>
<?php
 query_posts(‘posts_per_page=3&cat=1′); /*1, 2*/
if ( have_posts() ) while ( have_posts() ) : the_post(); ?>
<h2><a href=”<?php the_permalink(); ?>”><?php the_title(); /*3*/ ?></a></h2>
<p><?php the_excerpt(); ?></p>
<p><a href=”<?php the_permalink(); ?>”>continue reading</a></p>
<?php endwhile; ?> <?php wp_reset_query(); /*4*/ ?>
</div>

Notes:

  • *1posts_per_page indicates how many posts should be displayed in the featured section (only the newest posts will be shown),
  • *2cat is the category ID. You can get it by going to your WP admin and hovering over the category name (image below).
  • *3 – here’s where the HTML formatting starts. Feel free to display the posts however you like.
  • *4 – resetting the query (muy importante!).

cat-id

This is basically it. The main strength of this approach is obviously that you can do whatever you wish with your featured posts, as you’re only limited by what can be done in PHP.

Now, this might be a good moment to point out the different types of featured content sections you can use:

  • Simple listings (text + thumbnail). This is what TechCrunch uses. Not intrusive. Lets your visitors notice the content without interrupting their normal experience.
  • Big listings. Similar to the previous type, but bigger and attracting more attention as they push the latest content further down the page. The only downside is that you need to update this section quite often, otherwise your site may end up looking like it’s out of date.
  • Single article focus. Featuring only one article at a time. Good if you really want to promote something hard. Used on ProBlogger.
  • Sliders. A highly engaging method. Since the content is moving around it is sure to attract the visitor’s attention very quickly. This is what many big online publishers use.

Featured posts vs. plugins

I’m sure you’ve seen this one coming… Anyway, not surprisingly, plugins are the lazy man’s way of doing this (kind of – more on that in a minute).

There are three plugins I’d like to recommend for enabling featured posts sections on a WordPress site:

Simple Featured Posts Widget

This is a simple widget that will do the job 90% of the time. It’s customizable (you can set your featured categories, number of posts to display, the display order, thumbnail size). You can also tweak the widget’s CSS to match your site. No fancy features, just the essential stuff.

Featured Post with thumbnail

Another simple widget. And this one makes assigning posts to the featured section even easier. It adds and additional box in your editing screen (when editing or adding new posts) that allows you to mark the current post as featured.

Apart from that, you also get the standard set of features (select the number of posts, the display order, thumbnail size, etc.).

Meteor Slides

This is the most feature-rich plugin on this short list. It actually provides a way to display cool JavaScript sliders showcasing whatever you wish, not just selected content.

Once you install the plugin, a new content type will be created on your blog – Slides – and you will be able to manage them just like other types (posts and pages).

The plugin provides nice animation features and easy to integrate environment (through template tags, shortcodes, and widgets).

This might be the best plugin available to not only enable featured content sections, but also make your content more engaging as a whole at the same time.

Now, a couple of paragraphs ago I said that the plugins are kind of the lazy man’s way of doing this. That’s because even though you’re using a plugin, you still need to define some new widget areas in your theme.

The most common place for a widget area is the sidebar (almost every modern theme offers widget areas in the sidebar). However, it isn’t the most optimized placement for your featured content. It simply won’t get the attention it deserves if it’s displayed in the sidebar.

As experience shows, most publishers make the move to display their featured content as high up the page as possible (usually below the top-level menu). So if your theme doesn’t allow that, you’re going to have to do some manual tweaking (again, use child themes).

What’s your opinion on featured posts sections? Do you have them on your WordPress site?

written by Karol

Karol K. (@carlosinho) is a 20-something year old web 2.0 entrepreneur from Poland, and a grad student at the Silesian University of Technology. He shares his thoughts at newInternetOrder.com and ThemeFuse. Tune in to get his blogging and online business advice.

Comments

  1. vajrasar, December 8, 2012

    Well instead of query_posts, I used WP_Query. This is because I read somewhere that using WP_Query is a better way, is it?

    reply
    • Karol K, December 12, 2012

      WP Codex says that WP_Query is better in some situations as query_posts alters the main loop. In this case you can go with either method.

  2. dermatrix, February 23, 2013

    best plugins

    reply
  3. Designgirl, May 15, 2013

    Hi, I´ll searching for a slider today and came to your site. I´ll try the Meteor Slider for a customer website. Thanks for this listing and Greetings from Germany!

    reply
  4. RJO, May 22, 2013

    Dang, Pagination wont work with this?

    reply
  5. wajid khan, December 25, 2013

    Nice thanks for useful information. I followed your method of displaying featured post and it works :) thanks again

    reply
  6. Nick, March 3, 2014

    Thank you so much for this. Saved me prolonged headaches of editing “featured posts” plugins to have the same simple functionality and flexibility.

    reply

Add a comment

Top
(it will not be shared)

PixelKit creates premium UI kits & design resources ready to rock your next design!

A leading provider of web hosting services to over 100,000 websites from small to large.

Articles, Web desgin, Freebies, WordPress. Your favorite creative web resource. Stay tuned!

A blog providing advice on how you can use the almighty internet and start an online business

WPHub is a portal about WordPress themes, hosting, plugins, tutorials, and much more!