REA Product Carousel widget allows you to showcase your products in a carousel with many customizing features.
Note: This widget requires the WooCommerce plugin to be installed and activated as displays only WooCommerce products.
Content #
Layout Settings #
- 1.Layout – Select the layout from the given options.
- 2.Show Title – Show/Hide the title.
- 3.Title Tag – Select the HTML tag for the title.
- 4. Title Length – Set the length for the title.
- 5.Show Product Rating? – Show/Hide Product Rating.
- 6.Show/Hide Product Price? – Show/Hide Product Price.
- 7.Show Description? – Show/Hide Product Description.
- 8.Image Size – Set the Product Image Size.
- 9.Image Stretch – Enable/Disable Image Stretch.
- 10.Not Found Message – Add the message to display when there are no posts found.
- 11.Show Quick View? – Enable/Disable the Quick View feature.
- 12.Quick View Title Tag – Select the title tag for Quick View.
- 13.Image Clickable? – Enable/Disable clickable image.
Carousel Settings #
- 1.Effect – Select the carousel effect.
- 2.Visible Product – Set the number of the products to be visible initially.
- 3.Items Gap – Set the gap between the items in the carousel.
- 4.Speed – Set the transition speed of the carousel.
- 5.Autoplay – Enable/Disable the autoplay settings of the carousel.
- 6.Infinite Loop – Enable/Disable the infinite loop settings of the carousel.
- 7.Grab Cursor – Enable/Disable the grab cursor settings of the carousel.
- 8.Arrows – Enable/Disable the arrows navigation settings of the carousel.
- 9.Dots – Enable/Disable the dots navigation settings of the carousel.
- 10.Image Dots – Enable/Disable the image dots navigation settings of the carousel.
- 11.Direction – Select the direction for the transition of the carousel.
Query #
- 1.Filter By – Select the products filtering parameter.
- 2.Order By – Select the products display ordering parameter.
- 3.Order – Select the type of order in which the products should be displayed.
- 4.Products Count – Set the number of products to be displayed.
- 5.Offset – Set the products offset.
- 6.Product Type – Add the type for which the products should be displayed.
- 7.Product Categories – Add the categories for which the products should be displayed.
- 8.Product Tags – Add the tags for which the products should be displayed.
- 9.Product Color – Add the colors for which the products should be displayed.
- 10.Product Size – Add the size for which the products should be displayed.
Sale/Stock Out Badge #
- 1.Style Preset – Select the style preset for the badge.
- 2.Alignment – Set the alignment of the badge.
- 3.Sale Text – Add the sale text for the badge.
- 4.Stock Out Text – Add the stock out text for the badge.
Style #
Products #
- 1.Background Color – Set the background color for the products.
- 2.Margin – Set the margin for the products.
- 3.Border Type – Set the border settings for the products for Normal and Hover states.
- 4.Border Color – Set the border color for the products for Normal and Hover states.
- 5.Box Shadow – Set the box shadow properties for the products.
- 6.Border Radius – Set the border radius for the products.
- 7.Padding – Set the padding for the Product Details section in the product slides.
Color & Typography #
Product Title #
- 1.Product Title Color – Set the color for the product title.
- 2.Typography – Set the typography options for the product title.
Product Price #
- 1.Product Price Color – Set the color for the product price.
- 2.Typography – Set the typography options for the product price.
Star Rating #
- 1.Rating Color – Set the color for the rating stars.
- 2.Icon Size – Set the icon size for the rating stars.
Sale Badge #
- 1.Sale Badge Color – Set the color for the sale badge.
- 2.Sale Badge Background – Set the background color for the sale badge.
- 3.Typography – Set the typography options for the sale badge.
Stock Out Badge #
- 1.Stock Out Badge Color – Set the color for the stock out badge.
- 2.Stock Out Badge Background – Set the background color for the stock out badge.
- 3.Typography – Set the typography options for the stock out badge.
Button #
- 1.Width – Set the width of the button.
- 2.Height – Set the height of the button.
- 3.Normal State –
- 1.Color – Set the color of the button.
- 2.Background Color – Set the background color of the button.
- 3.Border Type – Set the border settings of the button.
- 4.Border Radius – Set the border radius of the button.
- 4.Hover State –
- 1.Color – Set the color of the button.
- 2.Background Color – Set the background color of the button.
Popup #
Title #
- 1.Typography – Set the typography options of the title of the popup.
- 2.Title Color – Set the color of the title of the popup.
Price #
- 1.Typography – Set the typography options of the product price.
- 2.Title Color – Set the color of the price.
- 3.Sale Price Color – Set the color of the sale price.
Content #
- 1.Typography – Set the typography options of the content in the popup.
- 2.Content Color – Set the color of the content in the popup.
- 3.Review Color – Set the color for the review in the popup.
- 4.Review Link Color – Set the color of the review link in the popup.
- 5.Review Link Hover – Set the hove color of the review link in the popup.
- 6.Border Color – Set the border color of the content in the popup.
Sale #
- 1.Typography – Set the typography options of the sale text.
- 2.Color – Set the color of the sale text.
- 3.Background Color – Set the background color of the sale text.
Quantity #
- 1.Typography – Set the typography options of the quantity.
- 2.Color – Set the color of the quantity.
- 3.Background Color – Set the background color of the quantity.
- 4.Border Color – Set the border color of the quantity.
Cart Button #
- 1.Typography – Set the typography options for the cart button.
- 2.Normal State –
- 1.Color – Set the color of the cart button.
- 2.Background Color – Set the background color of the cart button.
- 3.Border Type – Set the border settings for the cart button.
- 4.Border Radius – Set the border radius for the cart button.
- 3.Hover State –
- 1.Color – Set the color of the cart button.
- 2.Background Color – Set the background color of the cart button.
SKU #
- 1.Typography – Set the typography options of the SKU in the popup.
- 2.Title Color – Set the title color of the SKU.
- 3.Content Color – Set the color of the content of the SKU in the popup.
- 4.Hover Color – Set the hover color for the SKU in the popup.
Close Button #
- 1.Icon Size – Set the icon size of the close button.
- 2.Button Size – Set the button size.
- 3.Color – Set the color.
- 4.Background – Set the background color.
- 5.Border Radius – Set the border radius of the button.
- 6.Box Shadow – Set the box shadow properties of the button.
- 1.Border Radius – Set the border radius of the popup window.
- 2.Background Type – Set the background of the popup window.
- 3.Box Shadow – Set the box shadow properties of the popup window.
Dots #
- 1.Preset – Select the preset style for the dots.
- 2.Position – Select the position of the dots.
- 3.Use Custom Width/Height? – Enable/Disable the custom width and height controls for the dots.
- 4.Normal State –
- 1.Color – Set the color of the dots.
- 2.Border Type – Set the border settings of the dots.
- 3.Border Radius – Set the border radius of the dots.
- 4.Padding – Set the padding of the dots.
- 5.Hover State –
- 1.Color – Set the color of the dots.
- 2.Border Color – Set the border color of the dots.
- 6.Active State –
- 1.Color – Set the color of the dots.
- 2.Width – Set the width of the dots.
- 3.Height – Set the height of the dots.
- 4.Border Radius – Set the border radius of the dots.
- 5.Shadow – Set the shadow properties of the dots.
Arrows #
- 1.Choose Arrow – Select the arrow.
- 2.Arrows Size – Set the size of the arrows.
- 3.Icon Size – Set the icon size.
- 4.Align Left Arrow – Set the alignment of the left arrow.
- 5.Align Right Arrow – Set the alignment of the right arrow.
- 6.Normal State –
- 1.Background Color – Set the background color of the arrows.
- 2.Color – Set the color of the arrows.
- 3.Border Type – Set the border settings of the arrows.
- 4.Border Radius – Set the border radius of the arrows.
- 5.Box Shadow – Set the box shadow properties of the arrows.
- 7.Hover State –
- 1.Background Color – Set the background color of the arrows.
- 2.Color – Set the color of the arrows.
- 3.Border Color – Set the border color of the arrows.
- 4.Box Shadow – Set the box shadow properties of the arrows.