SlideItMoo Wordpress Plugin

SlideItMoo plugin for Wordpress implements the MooTools plugin having the same name into an easy to use plugin that allows you to set image galleries into your posts and pages with only a few clicks. The JavaScript source can be found here with various examples and implementation instructions.

If you know SlideItMoo, you know that it can be used in various ways ( as banner rotator, image slider, featured content presentation etc. ) but this Wordpress plugin only implements the image slider functionality for the horizontal slider. As for features, it allows displaying as many image sliders as needed into a post or page, each having its own properties and images. Also, you can call the plugin from your template files by passing it only 2 arrays, one containing the slider settings and one containing the images ids. Everything is kept as simple as possible to allow you to easily define sliders into your posts.

Additionally to SlideItMoo, the plugin also uses Slimbox, a very well written Lightbox script for MooTools 1.2.

Installation

To install this plugin, simply download the source files and copy the whole wp_slideitmoo folder into your Wordpress installation plugins folder. After doing that, activate the plugin and then visit Settings->SlideItMoo Settings to set up some default values.

Usage

There are 2 ways of using this plugin. First one is from Wordpress admin, when adding or editing a post or page. After activating the plugin, the text editor will display a new icon above it.

When that icon is clicked, it will display a modal page that allows to set up a new slider to display within that post or page. There are 2 things to set up: the slider properties and the images to display.
Slider properties are:

• number of visible items,
• number of elements that will slide at once,
• auto slide delay in milliseconds
• and forward-back links display.

After defining the slider properties it’s time to put some images into the slider. To do that, click the Add Images tab and a list of images containing all entries from the Media LIbrary will be displayed. Check the images you want the slider to display and hit Done. Depending on whether you use the visual or html editor, you will notice a code being inserted into your post/page.

Example code:

<!--[SlideItMoo itemsVisible='3' showControls='1' images='639,638,637,636,635']-->

It’s best if, when inserting a new slider, the editor is switched to HTML instead of visual so changes can be visible.

Second way of using this plugin is by doing it manually directly into the template files where you need it displayed. To do that, you will need to insert a piece of code similar to the one below:

<?php 
	if( function_exists( 'wp_slideitmoo' ) ){
		$params = array(
			'itemsVisible'=>2,
			'elemsSlide'=>1,
			'showControls'=>1,
			'autoSlide'=>3000
		);
		$images = array(639,638,637,636,635,634,633,632,631,630);
		echo wp_slideitmoo($params, $images);
	}	
?>

As you can see, there are 2 arrays that need to be passed to wp_slideitmoo(). First one, $params, contains the slider settings and $images contains the image ids from your wp database.

Demo & download

sign_512

search_512

rss2_512

news_512

mail_512

home_512

comment_512

calendar_512

ads_512

address_512

Related posts

• YouTube player embed with attached playlist (129)
• SlideItMoo – image slider (636)
• MooTooltips – easy to make good looking tooltips (104)
• MooTools Fancy Animated Tabs (0)
• MooTools 1.2 image slider – SlideItMoo (76)
• MooTools 1.2 Beginner’s Guide – book review (0)
• MooHover – CSS hover the MooTools way (34)
• JavaScript chained select with MooTools 1.2 (19)
• How to modify input type file aspect (5)

Was this useful? Show your support.