MonkeyDesign Product Carousel adds a fully featured WooCommerce product carousel and slider widget to Elementor. Drop it on any page, pick your product source, style the cards — done.
Looking for a WooCommerce carousel or product slider for Elementor? This widget gives you both, with a powerful query engine that goes beyond simple product lists.
The main value is not the sliding itself (Swiper handles that), but the product query engine and the card builder: control where products come from and exactly what each card shows.
Key free features
Product sources
* Latest products
* Featured products
* On sale
* Best sellers (cached for performance)
* By category or tag
* Manual product selection (comma-separated IDs)
* Related products
Layout
* Unlimited columns — set independently for desktop, tablet, and mobile
* Two skins: Classic (bordered card) and Minimal (frameless)
* Configurable gap between slides
* Center mode (active slide centered, adjacent slides partially visible)
Card builder — every element independently toggleable
* Product image (eager LCP on first slide, lazy on the rest)
* Title, price, star rating
* Sale / featured / out-of-stock badge
* Add to cart button
* Short description, stock status
Navigation & autoplay
* Arrow buttons and pagination dots
* Touch drag, mouse drag, keyboard navigation
* Autoplay with configurable delay, pause on hover, infinite loop
Performance
* Swiper.js (not jQuery-dependent Slick)
* No jQuery
* CSS and JS load only on pages that contain the widget
* First slide image gets loading="eager" and fetchpriority="high" — improves LCP
Accessibility
* Screen reader labels on arrows via Swiper’s a11y module
* Full keyboard navigation
* Visible focus styles on all interactive elements
* Arrows are real <button> elements with aria-label
* Respects prefers-reduced-motion (disables autoplay and transition animations)
PRO features
- Overlay skin — image fills the card, content slides up on hover
- Quick view modal — open product details without leaving the page
- AJAX add to cart — spinner, success state, and toast notification on add to cart
- Wishlist button — let customers save products for later
- Sale countdown timer — display a live countdown on sale products
- Navigation style controls — custom arrow icon, color, size, background, and shadow; dot color and active state color
- Progress bar — animated progress bar below the carousel
- Fraction display — current / total slide counter
- Scrollbar — draggable scrollbar navigation
- Thumbnail navigation — row of thumbnail slides below the main carousel
- Slider sync — link two carousels on the same page to scroll together
Template override
Developers can override the card template from their theme:
- Create
your-theme/product-carousel/card.php - Copy the contents of
product-carousel/templates/card.php - Modify as needed
The rendered card HTML is also filterable: apply_filters( 'mdpc_card_html', $html, $product, $settings ).
Screenshots
The Product Carousel widget on a page — Classic skin, 3 columns desktop layout.
The Elementor panel showing the 🐒 MonkeyDesign section with the Product Carousel widget.
Query controls — product source selector with category, tag, and manual selection options.
Card element toggles — enable or disable image, title, price, rating, badge, and add to cart independently.
Autoplay controls — delay, pause on hover, infinite loop, and transition speed settings.
Minimal skin variant — frameless cards with outline add-to-cart button.
The plugin Settings page — system status showing WooCommerce and Elementor versions.