vineri, 18 februarie 2011

How to Create a Dynamic Footer Carousel Graywolf's SEO Blog

How to Create a Dynamic Footer Carousel Graywolf's SEO Blog


How to Create a Dynamic Footer Carousel

Posted: 18 Feb 2011 07:44 AM PST

Post image for 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.

tla starter kit

Related posts:

  1. How to Build an Effective Footer Footers are one of the most often underused, misused and...
  2. How to Add a Carousel to Your Thesis Blog If you’ve spent any time visiting blogs lately chances are...
  3. How To Make Your Homepage More Dynamic One of the problems I encounter on large client websites–or...
  4. How To Silo Your Website: The Footer This post is part of a series on How to...
  5. WordPress SEO: How to Create Living URL’s If you watched any of the congressional hearings about the...

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. Ezilon.com Regional Directory - Check to see if your website is listed!
  4. Directory Journal - Get permanent deep links in a search engine friendly directory
  5. Glass Whiteboards - For a professional durable white board with no ghosting, streaking or marker stains, see my Glass Whiteboard Review
  6. Need an SEO Audit for your website, look at my SEO Consulting Services
  7. Link Building- Backlink Build offers 45 PR5+ Backlinks for $295
  8. KnowEm - Protect your brand, product or company name with a continually growing list of social media sites.
  9. Scribe SEO Review find out how to better optimize your wordpress posts.
  10. TigerTech - Great Web Hosting service at a great price.

This post originally came from Michael Gray who is an SEO Consultant. Be sure not to miss the Thesis Wordpress Theme review.

How to Create a Dynamic Footer Carousel

Niciun comentariu:

Trimiteți un comentariu