monkeydesign2026

<p><strong>MonkeyDesign Product Carousel</strong> 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.</p>
<p>Looking for a <strong>WooCommerce carousel</strong> or <strong>product slider for Elementor</strong>? This widget gives you both, with a powerful query engine that goes beyond simple product lists.</p>
<p>The main value is not the sliding itself (Swiper handles that), but the <strong>product query engine</strong> and the <strong>card builder</strong>: control where products come from and exactly what each card shows.</p>
<h4>Key free features</h4>
<p><strong>Product sources</strong><br />
* Latest products<br />
* Featured products<br />
* On sale<br />
* Best sellers (cached for performance)<br />
* By category or tag<br />
* Manual product selection (comma-separated IDs)<br />
* Related products</p>
<p><strong>Layout</strong><br />
* Unlimited columns — set independently for desktop, tablet, and mobile<br />
* Two skins: <strong>Classic</strong> (bordered card) and <strong>Minimal</strong> (frameless)<br />
* Configurable gap between slides<br />
* Center mode (active slide centered, adjacent slides partially visible)</p>
<p><strong>Card builder — every element independently toggleable</strong><br />
* Product image (eager LCP on first slide, lazy on the rest)<br />
* Title, price, star rating<br />
* Sale / featured / out-of-stock badge<br />
* Add to cart button<br />
* Short description, stock status</p>
<p><strong>Navigation & autoplay</strong><br />
* Arrow buttons and pagination dots<br />
* Touch drag, mouse drag, keyboard navigation<br />
* Autoplay with configurable delay, pause on hover, infinite loop</p>
<p><strong>Performance</strong><br />
* Swiper.js (not jQuery-dependent Slick)<br />
* No jQuery<br />
* CSS and JS load only on pages that contain the widget<br />
* First slide image gets <code>loading="eager"</code> and <code>fetchpriority="high"</code> — improves LCP</p>
<p><strong>Accessibility</strong><br />
* Screen reader labels on arrows via Swiper’s a11y module<br />
* Full keyboard navigation<br />
* Visible focus styles on all interactive elements<br />
* Arrows are real <code><button></code> elements with <code>aria-label</code><br />
* Respects <code>prefers-reduced-motion</code> (disables autoplay and transition animations)</p>
<h4>PRO features</h4>
<ul>
<li><strong>Quick view modal</strong> — open product details without leaving the page</li>
<li><strong>AJAX add to cart</strong> — add products without page reload</li>
<li><strong>Wishlist button</strong> — let customers save products for later</li>
<li><strong>Sale countdown timer</strong> — display a live countdown on sale products</li>
<li><strong>Navigation style controls</strong> — custom arrow color, size, and background; dot color and active state color</li>
<li><strong>Thumbnail navigation</strong> — row of thumbnail slides below the main carousel</li>
<li><strong>Slider sync</strong> — link two carousels to scroll together</li>
</ul>
<h4>Template override</h4>
<p>Developers can override the card template from their theme:</p>
<ol>
<li>Create <code>your-theme/product-carousel/card.php</code></li>
<li>Copy the contents of <code>product-carousel/templates/card.php</code></li>
<li>Modify as needed</li>
</ol>
<p>The rendered card HTML is also filterable: <code>apply_filters( 'mdpc_card_html', $html, $product, $settings )</code>.</p>


MonkeyDesign Product Carousel for Elementor

WooCommerce product carousel and slider widget for Elementor. Show latest, sale, featured or best-selling products — flexible card builder, no jQuery.

Dan Zakirov

alexandr3000

<p>The plugin replaces the standard related and upsells products on carousel slider using a script glide.js that does not depend on the jquery, which much faster than its analogues.</p>
<p>Simply activate the plugin and a carousel of related products will already appear in your store. Among other things, you can separately configure related products and recommended(Upsells) products.</p>
<p>The design of the product cards will match the design of your template, but it should be noted that some templates have their own custom carousels of recommended or related products.</p>
<h3>Settings plugin</h3>
<ol>
<li>Woocommerce → Settings → Products → Related Product Carousel</li>
<li>Woocommerce → Settings → Products → Upsells Product Carousel</li>
</ol>
<h3>Features:</h3>
<ol>
<li>Replaces the standard output of related products and recommended(upsells) products with a carousel</li>
<li>No dependence on the jquery, loading is very fast</li>
<li>You can change the titles of the standard sections</li>
<li>You can enable or disable autoplay</li>
<li>You can change the time interval for scrolling the carousel</li>
<li>You can specify the number of products in the carousel</li>
<li>You can specify the number of visible products (specify the grid)</li>
<li>You can specify the number of displayed products on mobile devices and tablets</li>
<li>Standard accompanying and recommended products not displayed if their number is less than the indicated visible products in the carousel. That is, a carousel is not created. Only high-quality optimization.</li>
<li>You can disable the carousel and control other functions – section header, number of displayed products, number of columns</li>
</ol>
<h3>New advanced settings</h3>
<ol>
<li>Hint on a mobile device (see. Screenshots)</li>
<li>Styling a mobile hint (see. Screenshots)</li>
<li>Central mode with cropping (see. Screenshots)</li>
<li>Central mode on mobile device only</li>
<li>Choosing a carousel transition animation</li>
<li>Setting duration of the transition animation</li>
<li>Setting the distance between products</li>
<li>The choice of navigation icons (see. Screenshots)</li>
<li>Setting the color of navigation</li>
</ol>
<p>All new options have tips right in the admin panel. You can always fine-tune the carousel.</p>
<h3>Plugin Benefits</h3>
<p>The most important advantage of the “Carousel Upsells and Related Product for Woocommerce” plugin is that it uses a javascript library of glide.js and has no jQuery dependencies. The main JS file of the plugin weighs only ~ 23kb, and in compressed form only ~ 7kb. Compared to similar carousel-slides, such as Slick Slider (88kb, and in compressed 44kb), Swiper Slide (more than 100kb) or OWL carousel (89kb, and in compressed 44kb) is many times smaller and I will remind glide.js without jQuery dependencies. With all this, glide.js has Touch Swipe mode, which allows the finger (touch on the element) to move the carousel in the right direction.</p>
<p>As a result, this carousel works faster and directly instantly loads your goods in the carousel. By the way, remember to optimize your images, now owners of online stores fight for each kb as search engines love fast sites.</p>
<h3>Required Plugins</h3>
<ul>
<li><a href="https://wordpress.org/plugins/woocommerce/" rel="ugc">WooCommerce</a></li>
</ul>
<h3>Great thanks</h3>
<ul>
<li>Thanks for the wonderful javascript carousel Glide.js <a href="https://glidejs.com/" rel="nofollow ugc">Jędrzej Chałubek</a></li>
<li>Thanks for the help <a href="https://profiles.wordpress.org/campusboy1987/" rel="nofollow ugc">Сampusboy</a></li>
<li>Thanks for the help <a href="https://profiles.wordpress.org/kaggdesign/" rel="nofollow ugc">KAGG Design</a></li>
<li>Thanks for helping the developer <a href="https://profiles.wordpress.org/artabr/" rel="nofollow ugc">Artem Abramovich</a></li>
<li>For help <a href="https://t.me/c_wordpress" rel="nofollow ugc">Telegram chat “WordPress & WooCommerce” and all participants</a></li>
<li>For the best documentation in Russian by WordPress <a href="https://wp-kama.ru/" rel="nofollow ugc">Site wp-kama.ru</a></li>
</ul>
<h3>Donate link:</h3>
<p><a href="https://www.paypal.com/cgi-bin/webscr?&cmd=_xclick&business=studia55x5@yandex.ru&currency_code=USD&amount=16&item_name=On coffee for the developer" rel="nofollow ugc">Pay with Paypal</a></p>
<h3>Translations</h3>
<p>If you wish to help translate this plugin, you are most welcome!<br />
To contribute, please visit <a href="https://translate.wordpress.org/projects/wp-plugins/carousel-upsells-and-related-product-for-woocommerce/" rel="nofollow ugc">translate.wordpress.org</a></p>


Carousel Upsells and Related Product for Woocommerce

The plugin replaces the standard related and upsells products on carousel slider using a script glide.js that does not depend on the jquery, which muc …

MonkeyDesign Product Carousel for Elementor vs Carousel Upsells and Related Product for Woocommerce