This feature is available only for Premium members

NOTE: You can access all the shortcodes via the shortcodes icon on your visual editor. See this document if you need more information

 

Description and Code

 

The Image Carousel shortcode will allow you to put a number of images into a rotating carousel. You can either have the images pop up in a lightbox when clicked, or you can link the images to other pages or other sites. Here's an example of the shortcode in code view:

[image_carousel_component picture_size="original" columns="3" animation_type="0" animation_direction="down" animation_speed="0.1" class="" id=""]
[image link="" link_target="_self" image="" alt=""]
[/image_carousel_component]

 

Parameters

 

Image slider container - [ image_carousel_component ]
  • picture_size
    • sets if the picture size will be original or responsive
    • Possible values - original or responsive
  • columns
    • controls how many columns/items to display in the slider
    • Possible values - 3, 4 or 5
  • animation_type
    • set the animation type of the component
    • Possible values - none, bounce, fade, flash, shake, slide
  • animation_direction
    • set the animation direction of the component
    • Possible values - down, left, right, up
  • animation_speed
    • set the animation speed of the component
    • Possible values - in seconds like 0.1, 1, 5.3 etc.
  • class
    • custom class for CSS of component
    • Possible values - string - like custom-element-class
  • id
    • custom ID for CSS of component
    • Possible values - string - like custom-element-id

 

Image - [ image ]
  • link
    • sets the image link - if the link is set to an image file it enables lightbox effect if turned on in the theme options
    • Possible values - string - like http://example.com or http://example.com/wp-content/uploads/image.jpg etc.
  • link_target
    • sets the image link target
    • Possible values - _self or _blank
  • image
    • defines the path for the image that you want to show
    • Possible values - string - like http://example.com/wp-content/uploads/image.jpg
  • alt
    • set the image alt text
    • Possible values - string - like John Doe

 

Basic Examples

 

3 Columns

 

 

4 Columns

 

 

5 Columns

 

 

Animated Examples