[shortcodeglut_carousel]
Carousel Slider Shortcode
Complete Documentation for [shortcodeglut_carousel] — Plugin Version 1.5.5
Table of Contents
Overview
The Carousel Slider shortcode displays WooCommerce products as a beautiful full-width carousel with animated slide transitions, navigation arrows, dot indicators, and customizable slide backgrounds.
- Full-width carousel slider with smooth animated transitions
- Auto-advancing slides with configurable interval (or disable)
- Left/right arrow navigation and dot indicator navigation
- Auto-generated product tags (Best Seller, New Release, Hot Deal, etc.)
- Custom backgrounds per slide (solid colors, gradients, or image URLs)
- Each slide shows: tag, title, excerpt, price, Add to Cart button, product image
- Category filtering
- 10 sort options
Basic Usage
[shortcodeglut_carousel]
Displays 6 products as carousel slides with default gradient backgrounds, auto-advancing every 5 seconds, with arrows and dot navigation.
Parameters Reference
| Parameter | Type | Default | Description |
|---|---|---|---|
| autoplay | integer | 5000 | Milliseconds between slide transitions. Set 0 to disable auto-advance. |
| arrows | boolean | true | Show left/right navigation arrows: true or false |
| dots | boolean | true | Show dot indicators at the bottom: true or false |
| section_title | string | Featured Products | Section heading displayed above the carousel |
| posts_per_page | integer | 6 | Number of products/slides to display |
| category | string | empty | Filter by a single category slug. Leave empty for all products. |
| order_by | string | date-desc | Sort preset (see Sort Options below) |
| show_price | boolean | 1 | Show product price on slides: 1 or 0 |
| show_button | boolean | 1 | Show Add to Cart button on slides: 1 or 0 |
| product_bgs | string | empty | Per-product backgrounds. Format: ID:value|ID:value using pipe separator. See tips for details. |
| default_bg | string | linear-gradient(135deg, #667eea 0%, #764ba2 100%) | Default slide background. Supports hex colors, gradients, and image URLs. |
Sort Options
The order_by parameter accepts these preset values:
| Value | Sort Behavior |
|---|---|
| date | Newest First |
| date-desc | Oldest First |
| title-asc | Title: A to Z |
| title-desc | Title: Z to A |
| price-asc | Price: Low to High |
| price-desc | Price: High to Low |
| popularity-desc | Best Selling |
| popularity-asc | Least Selling |
| rating-desc | Highest Rated |
| rating-asc | Lowest Rated |
Usage Examples
Example 1: Default Carousel
[shortcodeglut_carousel]
6 products, auto-advance every 5 seconds, with arrows and dots, default purple gradient backgrounds.
Example 2: No Auto-Advance
[shortcodeglut_carousel autoplay="0"]
Manual-only navigation. Visitors control slides via arrows or dots.
Example 3: Category Filtered, Fast Auto-Advance
[shortcodeglut_carousel category="electronics" autoplay="3000" section_title="Top Electronics"]
Shows electronics products with 3-second auto-advance and a custom section title.
Example 4: Custom Default Background
[shortcodeglut_carousel default_bg="#1a1a2e"]
All slides use a dark navy background instead of the default gradient.
Example 5: Per-Product Backgrounds
[shortcodeglut_carousel product_bgs="12:#e74c3c|34:linear-gradient(135deg, #f093fb, #f5576c)|56:url(https://example.com/bg.jpg)"]
Product 12 gets a red background, product 34 gets a pink gradient, product 56 gets an image background. Others use the default.
Example 6: Minimal — Dots Only, No Price
[shortcodeglut_carousel arrows="false" show_price="0" show_button="0" section_title="Lookbook"]
Image-only slides with dot navigation. No arrows, no price, no button — pure visual showcase.
Example 7: Best Selling Products
[shortcodeglut_carousel order_by="popularity-desc" posts_per_page="4" autoplay="4000"]
4 best-selling products with 4-second auto-advance.
Tips & Best Practices
Use pipe
| to separate products and colon : between the product ID and background value. Supports hex (#ff0000), gradients (linear-gradient(...)), and image URLs (url(https://...) or plain URL). Products not listed use default_bg.
Set
autoplay="0" to disable auto-advance entirely. This gives visitors full manual control via arrows and dots.
Keep
posts_per_page between 4–10 for best visual impact. Too few slides makes the carousel unnecessary; too many can overwhelm.
The Add to Cart button uses WooCommerce AJAX. Out-of-stock or non-purchasable products show a “View Details” link instead.
For image backgrounds, use the
url() wrapper or a plain URL. The image is set as the CSS background property, so it covers the full slide area.
Frequently Asked Questions
Q: How do I disable auto-advance?
A: Set autoplay="0". Visitors will navigate using arrows or dots only.
Q: Can I use a solid color for slide backgrounds?
A: Yes, set default_bg="#yourcolor" for a solid color, or use any valid CSS background value (gradients, image URLs).
Q: How do I set different backgrounds for each slide?
A: Use product_bgs with pipe-separated ID:value pairs: product_bgs="12:#ff0000|34:linear-gradient(...)". Products not listed will use default_bg.
Q: Can I hide the arrows or dots?
A: Yes. Set arrows="false" to hide navigation arrows, or dots="false" to hide dot indicators.
Q: How are product tags determined?
A: Tags are auto-generated based on product data: sales count, creation date, sale status, category membership, and price. You cannot manually override them.
Q: Can I filter by category?
A: Yes, use category="your-slug" to show only products from that category.
ShortcodeGlut — WooCommerce Product Shortcodes Plugin
Version 1.5.5 | Last Updated: May 2026