Over at WebDeveloper+ I stumbled upon a tutorial that shows you how to create a featured content slider for your website using the jQuery UI library. This was so slick that I created a WordPress plugin that either allows you to display your four most recent posts or the four latest WP e-Commerce products in a slider.
You can download the plugin here.
How to
Just install and activate the plugin and you’ll be able to use the shortcode [slider]. You can use it where ever you want, just place this inside a post’s or page’s content (don’t copy the HTML comments but just the stuff in the brackets):
<!-- This shows the four most recent posts --> [slider] <!-- And this displays the four latest products created with WP e-Commerce --> [slider ds=wpec] |
Depending on what you really want to show in the slider’s content I recommend changing the plugin to suit your needs, it’s pretty straight forward.
By default you can attach two custom fields to a post that reference the large image and the thumbnail (via a valid URL): the custom field named Thumbnail denotes the large image and Thumbnail1 contains the location to the thumbnail.
In case you’re using the variant for WP e-Commerce the plugin will scale the images automatically and use the first product image for both, the large image and the thumbnail; no need to specify them separately or scale the images manually.
Thoughts
It’s pretty easy to show off your content with this slider. Since it’s now packaged in a plugin you can adapt it to suit your needs fast. Furthermore, even users who don’t know HTML, CSS or JavaScript will be able to use this.
If you need help changing the plugin to suit your needs, just contact me.
Hey,
I am trying to get this plugin to work on my site. Uploaded and activated the plugin. Want to add the plugin to a Featured Post section on my homepage, so I added [slider] in the index.php but nothing is happening besides the text [slider] showing up on homepage section.
Tested [slider] on a blog post and the plugin showed up besides no showing the images or thumbnail images.
Any suggestions? Conflict with my blog theme maybe?
Thanks in advance.
Hi Chris,
The shortcode won’t be evaluated if you just place it in a PHP file. Instead put it into the content area of a post or a page.
If it doesn’t show any images, you have to add two custom fields to the four most recent posts: one called
Thumbnailand another one namedThumbnail1referencing the large image and the thumbnail for the slider respectively.Putting content in a post or page totally defeats the purpose of the Featured Post slider.
The purpose is to post featured content on a homepage. I don’t see how applying the plugin to a post or page would be helpful.
I guess I need to look for other options.
Hi Chris,
WordPress has got a feature called static front page and you can read more about that here. This allows you to display a page on the front page of your website instead of the list of posts. Using this plugin you can show your featured content on the front page but not just a simple page somewhere on your website.
If you’d like to integrate the slider into your theme, you’ll know PHP and the by looking at the plugin’s code it shouldn’t be much of a problem to integrate one of its functions; at least it provides a quick start and you don’t have to do all the coding again.
Chris you can do this:
Add into any php file the following line:
echo do_shortcode(”[slider]“);
This line between php tag.
Regards.
hi Christian
Thanks for this PLUGIN – however i am runngin WP3.0.1 and finding that the ‘rotate’ tag is not working – the images and text just sit static on screen? and ideas why this may be?
thanks
Phil
Hello Phil,
this can be due to incompatible JavaScript frameworks or maybe jQuery gets included multiple times on the same page. I recommend Firefox and the plugin FireBug to debug issues like this.
Nice slider plugin. Thanks for this info.
Hola, no puedo instalar el pluggin se queda en “descomprimiendo” necesito de verdad un slider o slideshow para mi web saludos.
Hi Paola,
simply try unzipping the plugin manually before uploading it to WordPress. If all that doesn’t work you may want to check out the corresponding jQuery UI components in more detail and implement them yourself into your website.