Carousel Slider: Turn Hover Effects into a Sliding Carousel - Oxilab

Pro Feature: Carousel Slider requires the Image Hover Effects Ultimate Pro license.

The Carousel Slider extension wraps your hover effect items into a sliding carousel. It supports three carousel engines: Slick, Flipster, and Swiper, each with its own layout style and settings.

Step 1: Navigate to Carousel Slider

Go to Dashboard → Image Hover. On the main page, scroll down to the Extensions section and click the Carousel Slider card.

Step 2: Create a New Carousel

You’ll see a grid of layout templates. Click Create Style on any template.

A modal will appear. Enter a Name for this carousel (e.g., “Homepage Carousel”), then click Save.

Note: After saving and reloading the settings page, the full carousel settings will become available.

Step 3: Select a Carousel Style

The Carousel Style field is the most important setting. It links your carousel to an existing hover effect shortcode: this defines what each slide looks like, the image, overlay, animations, and hover behavior all come from that shortcode.

Haven’t created a hover effect yet? Start here:

Once you have a shortcode ready, select it from the Carousel Style dropdown.

Step 4: Select Your Carousel Engine

Choose one of the three engines. Each has its own settings:

Slick

Slides to Show: Number of slides visible at once
Slides to Scroll: How many slides move per swipe/click
Autoplay: Enable automatic sliding
Autoplay Speed: Delay between slides (ms)
Speed: Transition animation speed (ms)
Dots: Show navigation dots
Arrows: Show prev/next arrows
Infinite Loop: Loop back to start when reaching the end
Center Mode: Highlight center slide
Responsive Breakpoints: Override slides-to-show at tablet/mobile widths

Flipster

Style: Choose from coverflow, carousel, flat, or wheel layout
Spacing: Distance between slides
Start: Which item is centered on load (index or “center”)
Autoplay: Enable auto-flip with interval (ms)
Loop: Enable infinite looping
Buttons: Show navigation arrows

Swiper

Slides Per View: Number of visible slides
Space Between: Gap between slides (px)
Effect: Slide, fade, cube, coverflow, or flip
Autoplay: Enable with delay (ms)
Loop: Infinite loop
Pagination: Dots navigation
Navigation: Prev/next arrows
Breakpoints: Responsive slide counts

Step 5: Save and Get the Shortcode

Click Save. Your shortcode will appear at the top, copy and paste it into any page, post, widget, or page builder block.

Notes

Each engine has a different visual feel, try Slick for classic carousels, Flipster for 3D coverflow, and Swiper for modern mobile-friendly sliders.