U Choose Slider Plugin

December 31, 2012

This is a WordPress plugin I wrote that stores information about slider images in the database. It also gives you a template tag that you can use to loop over the images and implement your own JS Slider in your theme. It has a management page in the wp-admin dashboard so that you can add a title, description, link to follow, image url, and the ability to make it active or inactive. On the Github repo there are examples of how to implement this plugin with both jQuery Cycle and Twitter Bootstrap Carousel. All this does is store data, so it should in theory work with ANY slider script. Here is the link to the repo: Github Repo The plugin is in use on the following sites: Sustainable Living Association (jQuery Cycle) Be Local Northern Colorado (Twitter Bootstrap Carousel) Note: If you find any issues or have any questions, please leave a comment at the bottom of the post.

Here is the Twitter Bootstrap Carousel Example:

<script>
jQuery(document).ready(function() {
    jQuery('.carousel').carousel(); 
});
</script>

<div id="my_carousel" class="carousel slide">
    <div class="carousel-inner">
        <?php $slider_images = get_ucs_slider_images(); ?>
        <?php
        $i = 0 ;
        foreach ( $slider_images as $img ) : ?>
        <div class="<?php echo ( $i == 0 ) ? 'active ' : ''; ?>item">
            <a href="<?php echo $img->slider_link; ?>">
            <img src="<?php echo $img->slider_image; ?>">
            <div class="carousel-caption">
                <h4><?php echo $img->slider_title; ?></h4>
                <p><?php echo $img->slider_description; ?></p>
            </div>
            </a>
        </div>
        <?php $i++; endforeach; ?>
    </div>
    <a class="carousel-control left" href="#my_carousel" data-slide="prev">â€¹</a>
    <a class="carousel-control right" href="#my_carousel" data-slide="next">â€º</a>
</div>