Image Carousel

The Image Carousel shortcode for WordPress can be used to display an image carousel container within post or page content. The carousel showcases a modern design, with customization on image size, number of images and captions. Check below for example implementations and shortcode documentation:

Image Carousel Examples

Slide 1
World Clocks shortcodes
Slide 2
News Ticker shortcodes
Slide 3
Heading Styles shortcodes

Image Carousel Shortcodes

Image Carousel Shortcode
[x3m-carousel image="https://x3mmedia.com/wp-content/uploads/world-clocks.jpg;https://x3mmedia.com/wp-content/uploads/news-ticker.jpg" crop="16:9" maxwidth="100%" showcaptions="yes" captions="World Clocks shortcodes;News Ticker shortcodes" color="white" autoplay="5" align="center"]
The shortcode can be used to displays a set of selected images in a carousel style container. Images can be hosted either in WordPress or can be accessed from external sources. The carousel design is modern and can use any number of images along with some customization options like image crop size, captions or auto-play. Above example displays a 3 image carousel with 5 seconds autoplay option active.

Image Carousel Documentation

Here are the shortcode option settings available for Image Carousel:

Shortcode Settings Details
image=”image links here” This is used to set the link of the images desired to be displayed. When multiple images included, we use the “;” as separator between the image links.
crop=”16:9″ This is used to defines the cropping aspect ratio:

Options: “1:1”, “2:1”, “3:2”, “4:3”, “5:4”, “16:9”, “1:2”, “2:3”, “3:4”, “4:5”, “9:16”

maxwidth=”100%” This is used to define the maximum width of the carousel container in percentage (ex “100%”) or pixels (ex “400px”).
showcaptions=”yes” This is used to set weather the image captions will be displayed on the images in the carousel or not. Available options are “yes” or “no”.
captions=”Caption 1;Caption 2″ This is used to set the captions desired for each image in the carousel. Multiple captions must be separated by “;”.
color=”white” This is used to set the caption text color.

Color names or HEX color codes can be used to set the desired color.

autoplay=”5″ This is used to set the number of seconds before the next image displays automatically (if not set, users will have to navigate manually).
align=”center” This is used to set the carousel container alignment. For the cases when the carousel width is lower than that of the page, the carousel can be aligned “left”, “center” or “right”.