Slider Styles
Medium Slider
Small Slider
Slider shortcode instructions:
There are 2 different slider shortcodes. The first one show post/page image attachments and has the following arguments:
- size: big, medium, small. (default: medium)
- effect: random, fold, fade, sliceDown, sliceUp, sliceDownRight, sliceDownLeft, sliceUpRight, sliceUpLeft, sliceUpDown. (default: random)
- slices: number of slices used in the animation. (default: 15)
- animspeed: number of milliseconds of each transition animation. (default: 500)
- pausetime: number of milliseconds between transitions (default: 4000)
- numberimages: number of images to get from post/page attachments (default: 20)
- lightbox: true, false (default: true)
- exclude: use this argument to exclude attachments from the slider using a comma separated list of IDs
- include: use this argument to only include the attachments you specify using a comma separated list of IDs
Example usage:
[slider size="big" effect="fade" slices="10" numberimages="5" exclude="14,16" /]
The second one enables you to build a slider from images URLs (they can be hosted elsewhere) and has the following arguments:
- size: big, medium, small. (default: medium)
- effect: random, fold, fade, sliceDown, sliceUp, sliceDownRight, sliceDownLeft, sliceUpRight, sliceUpLeft, sliceUpDown. (default: random)
- slices: number of slices used in the animation. (default: 15)
- animspeed: number of milliseconds of each transition animation. (default: 500)
- pausetime: number of milliseconds between transitions (default: 4000)
Example usage:
[slider_custom size="big"]
<a href="#" rel="lightbox[1]"><img src="http://breeze.unispheredesign.com/wp-content/uploads/placeholders/900x300.jpg" alt="" title="Image 1" /></a>
<a href="#" rel="lightbox[1]"><img src="http://breeze.unispheredesign.com/wp-content/uploads/placeholders/900x300.jpg" alt="" title="Image 2" /></a>
<a href="#" rel="lightbox[1]"><img src="http://breeze.unispheredesign.com/wp-content/uploads/placeholders/900x300.jpg" alt="" title="Image 3" /></a>
[/slider_custom]
You can also use the [image] shortcode to add the images to the [slider_custom] shortcode like for example:
[slider_custom size="big"]
[image img="http://breeze.unispheredesign.com/wp-content/uploads/placeholders/900x300.jpg" url="http://breeze.unispheredesign.com/wp-content/uploads/placeholders/900x300.jpg" alt="Image 1"/]
[image img="http://breeze.unispheredesign.com/wp-content/uploads/placeholders/900x300.jpg" url="http://breeze.unispheredesign.com/wp-content/uploads/placeholders/900x300.jpg" alt="Image 2"/]
[image img="http://breeze.unispheredesign.com/wp-content/uploads/placeholders/900x300.jpg" url="http://breeze.unispheredesign.com/wp-content/uploads/placeholders/900x300.jpg" alt="Image 3"/]
[/slider_custom]
Note: If you use the [slider_custom] shortcode make sure to resize the images as they won’t automatically resize.