The image carousel will let you add images into a horizontal box which can be scrolled through. See examples here.
| Option | Default | Example | Description |
|---|---|---|---|
| width | (empty) | width="500px" | Add a width for the Image carousel in pixels or percentage. |
| space | (empty) | space="10" | The amount of space between each image in percent. |
| items | 1 | items="3" | The number of items visible at one time. |
| responsive | (empty) | responsive="0:1,600:2,960:3" | This option allows you to show a different number of items depending on the width of the browser viewport. Each setting, separated by a comma, corresponds to a minimum width followed by a colon then the number of items to show for that minimum width. The example to the left means the following:
|
| speed | 500 | speed="500" | The speed of the animation in milliseconds (1000 = 1 second). |
| autoplay | 0 | autoplay="1" | Transition automatically without user interaction. |
| autoplay_timeout | 2500 | autoplay_timeout="5000" | How long the carousel should pause before transitioning again in milliseconds (1000 = 1 second). |
| autoplay_hover_pause | 0 | autoplay_hover_pause="1" | Pause autoplay on mouse hover. |
| dots | 0 | dots="1" | Dots navigation below slides. |
| loop | 0 | loop="1" | Infinity loop. |
| mouse_drag | 1 | mouse_drag="0" | Mouse drag enabled. |
| touch_drag | 1 | touch_drag="0" | Touch drag enabled. |
| hide | (empty) | hide="hide-phone" | This gives you the ability to hide this shortcode on the devices you select:
|
Examples
[image_carousel width="400px" autoplay="1"] [image src="http://www.example.com/image1.png"] [image src="http://www.example.com/image2.png"] [image src="http://www.example.com/image3.png"] [/image_carousel]