How to Create a Dynamic Footer Carousel

In my piece on How to Build an Effective Footer, one of the tips I mentioned was making your footer more dynamic by including links to posts that are currently popular on your website. It’s something I do on the bottom of this website. I’ve gotten a few emails asking how, so I figured I’d turn it into a tutorial.

One method you could use is selecting the most recent posts from a specific category. I covered how to do that in my How to Add a Carousel Post. However, for my footer, I wanted something with a date aspect to it. What I really wanted was to display the most popular posts from the current day. Since I’m pushing out 4-6 archived posts on twitter per day, this does a really good job of keeping the footer from looking active. Additionally if I have a really popular post that links to another post, it’s pretty likely to populate  the footer as well.

Most of the heavy lifting is done via the WordPress popular posts plugin, which does all the calculating for you. It can spit out the code for you via widget, but chances are it won’t fit nicely into your theme. You’re going to need to do a bit of customization–thankfully the plugin has that functionality built in. You don’t have to use Thesis to make this work, but it is a lot easier (see Thesis Review).

We need to open up our custom functions file and, if you don’t already have a footer function, you’ll need to add one like this:

// Footer output
function my_footer() {

}
Inside of that function we’re going to add the code that tells the plugin to pick the most popular posts for the past day along with a bunch of other info like this:

// Footer output
function my_footer() {

get_mostpopular("range=daily&limit=6&order_by=avg&pages=0&title_length=35
&thumbnail_width=140&thumbnail_height=140&thumbnail_selection=usergenerated&
stats_comments=0&cats_to_exclude=209,210,217&post_start='<div class=caroselu>'&post_end=</div>&do_pattern=1&pattern_form={image}{title}");

}

I’ll step you through what each of the parameters means

range=daily – Use the daily time frame. You can also use weekly or monthly.
limit=6 – I want 6 items. You can choose more or less (see warning at end of post).
order_by=avg – What order you want the post in. I want average views.
pages=0 – I only want posts, not pages.
title_length=35 – How many characters are in the post, which keeps the formatting neat.
thumbnail_width=140 – the width of the thumbnail image (see below for more).
thumbnail_height=140 – the height of the thumbnail (see below for more).
thumbnail_selection=usergenerated – The theme generates a new file based on the Featured Image for the post.
stats_comments=0 – I’m not using comments so I tell it to ignore them.
cats_to_exclude=209,210,217 – I don’t want some posts to appear, so I use this to ignore them.
post_start='<div class=”caroselu”>’ – HTML to put at the beginning.
post_end=</div> – HTML to put at the end.
pattern_form={image}{title} – What format I want the individual output in.

Once that’s all done make sure you are calling the footer.

add_action('thesis_hook_footer', 'my_footer');

At this point you might see a bunch of empty boxes. That means you aren’t using the “featured image” field for your posts. So you’ll need to edit some of your older posts and put that in. If you’re images are stacked one on top of each other, you’ll need to float them by adding something like this t your CSS file.

.caroselu {float:left;padding:3px;text-align:center;margin:0px;}

The code can also be adapted and expanded; for example my Most Popular Posts page uses a variation of the code with a longer time frame and larger number of posts.

The Bad News

There are some downsides to implementing this code. As some hosting companies have explained to me, this is a very resource intensive plugin. If you are on shared hosting you may go over your CPU limits if you have a busy website or include a lot of images. Secondly, the more images you use, the slower you make your pages, and page speed plays a small role in rankings (see How to Speed Up WordPress). Lastly I haven’t been able to get the plugin to generate rectangular shaped images. I can make them wider but all it does is stretch the square image out. If the featured image is a rectangle it won’t just use the rectangle.

GraywolfSEO.com runs on the Genesis Framework

Genesis Framework

Genesis lets you to quickly and easily build amazing websites with WordPress. Whether you're a novice or advanced developer, Genesis provides the secure and search-engine-optimized foundation that takes WordPress to places you never thought it could go.
It's that simple - start using Genesis now!


Take advantage of the 6 default layout options, comprehensive SEO settings, rock-solid security, flexible theme options, cool custom widgets, custom design hooks, and a huge selection of child themes ("skins") that make your site look the way you want it to. With automatic theme updates and world-class support included, Genesis is the smart choice for your WordPress website or blog.


tla starter kit

Advertisers:

  1. Text Link Ads - New customers can get $100 in free text links.
  2. BOTW.org - Get a premier listing in the internet's oldest directory.
  3. Need an SEO Audit for your website, look at my SEO Consulting Services
  4. TigerTech - Great Web Hosting service at a great price.
Read previous post:
Make WordPress Search Engine Friendly

Here are some tips for setting up wordpress and making it more search engine friendly, please feel free to rate...

No One Wants to be Fat and Poor

There's a famous quote that goes something like "why do people rob banks ... because thats where the money is"....

Is the BlogHer Conference Guilty of Sex Discrimination

Last week July 18th through the 20th was this years BlogHer Conference. According to the Blogher website their mission is:...

Close