REA Product Carousel

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.

  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.

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.

Last updated