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. 1.
    Layout - Select the layout from the given options.
  2. 2.
    Show Title - Show/Hide the title.
  3. 3.
    Title Tag - Select the HTML tag for the title.
  4. 4.
    Title Length - Set the length for the title.
  5. 5.
    Show Product Rating? - Show/Hide Product Rating.
  6. 6.
    Show/Hide Product Price? - Show/Hide Product Price.
  7. 7.
    Show Description? - Show/Hide Product Description.
  8. 8.
    Image Size - Set the Product Image Size.
  9. 9.
    Image Stretch - Enable/Disable Image Stretch.
  10. 10.
    Not Found Message - Add the message to display when there are no posts found.
  11. 11.
    Show Quick View? - Enable/Disable the Quick View feature.
  12. 12.
    Quick View Title Tag - Select the title tag for Quick View.
  13. 13.
    Image Clickable? - Enable/Disable clickable image.
  1. 1.
    Effect - Select the carousel effect.
  2. 2.
    Visible Product - Set the number of the products to be visible initially.
  3. 3.
    Items Gap - Set the gap between the items in the carousel.
  4. 4.
    Speed - Set the transition speed of the carousel.
  5. 5.
    Autoplay - Enable/Disable the autoplay settings of the carousel.
  6. 6.
    Infinite Loop - Enable/Disable the infinite loop settings of the carousel.
  7. 7.
    Grab Cursor - Enable/Disable the grab cursor settings of the carousel.
  8. 8.
    Arrows - Enable/Disable the arrows navigation settings of the carousel.
  9. 9.
    Dots - Enable/Disable the dots navigation settings of the carousel.
  10. 10.
    Image Dots - Enable/Disable the image dots navigation settings of the carousel.
  11. 11.
    Direction - Select the direction for the transition of the carousel.

Query

  1. 1.
    Filter By - Select the products filtering parameter.
  2. 2.
    Order By - Select the products display ordering parameter.
  3. 3.
    Order - Select the type of order in which the products should be displayed.
  4. 4.
    Products Count - Set the number of products to be displayed.
  5. 5.
    Offset - Set the products offset.
  6. 6.
    Product Type - Add the type for which the products should be displayed.
  7. 7.
    Product Categories - Add the categories for which the products should be displayed.
  8. 8.
    Product Tags - Add the tags for which the products should be displayed.
  9. 9.
    Product Color - Add the colors for which the products should be displayed.
  10. 10.
    Product Size - Add the size for which the products should be displayed.

Sale/Stock Out Badge

  1. 1.
    Style Preset - Select the style preset for the badge.
  2. 2.
    Alignment - Set the alignment of the badge.
  3. 3.
    Sale Text - Add the sale text for the badge.
  4. 4.
    Stock Out Text - Add the stock out text for the badge.

Style

Products

  1. 1.
    Background Color - Set the background color for the products.
  2. 2.
    Margin - Set the margin for the products.
  3. 3.
    Border Type - Set the border settings for the products for Normal and Hover states.
  4. 4.
    Border Color - Set the border color for the products for Normal and Hover states.
  5. 5.
    Box Shadow - Set the box shadow properties for the products.
  6. 6.
    Border Radius - Set the border radius for the products.
  7. 7.
    Padding - Set the padding for the Product Details section in the product slides.

Color & Typography

Product Title

  1. 1.
    Product Title Color - Set the color for the product title.
  2. 2.
    Typography - Set the typography options for the product title.

Product Price

  1. 1.
    Product Price Color - Set the color for the product price.
  2. 2.
    Typography - Set the typography options for the product price.

Star Rating

  1. 1.
    Rating Color - Set the color for the rating stars.
  2. 2.
    Icon Size - Set the icon size for the rating stars.

Sale Badge

  1. 1.
    Sale Badge Color - Set the color for the sale badge.
  2. 2.
    Sale Badge Background - Set the background color for the sale badge.
  3. 3.
    Typography - Set the typography options for the sale badge.

Stock Out Badge

  1. 1.
    Stock Out Badge Color - Set the color for the stock out badge.
  2. 2.
    Stock Out Badge Background - Set the background color for the stock out badge.
  3. 3.
    Typography - Set the typography options for the stock out badge.

Button

  1. 1.
    Width - Set the width of the button.
  2. 2.
    Height - Set the height of the button.
  3. 3.
    Normal State -
    1. 1.
      Color - Set the color of the button.
    2. 2.
      Background Color - Set the background color of the button.
    3. 3.
      Border Type - Set the border settings of the button.
    4. 4.
      Border Radius - Set the border radius of the button.
  4. 4.
    Hover State -
    1. 1.
      Color - Set the color of the button.
    2. 2.
      Background Color - Set the background color of the button.

Title

  1. 1.
    Typography - Set the typography options of the title of the popup.
  2. 2.
    Title Color - Set the color of the title of the popup.

Price

  1. 1.
    Typography - Set the typography options of the product price.
  2. 2.
    Title Color - Set the color of the price.
  3. 3.
    Sale Price Color - Set the color of the sale price.

Content

  1. 1.
    Typography - Set the typography options of the content in the popup.
  2. 2.
    Content Color - Set the color of the content in the popup.
  3. 3.
    Review Color - Set the color for the review in the popup.
  4. 4.
    Review Link Color - Set the color of the review link in the popup.
  5. 5.
    Review Link Hover - Set the hove color of the review link in the popup.
  6. 6.
    Border Color - Set the border color of the content in the popup.

Sale

  1. 1.
    Typography - Set the typography options of the sale text.
  2. 2.
    Color - Set the color of the sale text.
  3. 3.
    Background Color - Set the background color of the sale text.

Quantity

  1. 1.
    Typography - Set the typography options of the quantity.
  2. 2.
    Color - Set the color of the quantity.
  3. 3.
    Background Color - Set the background color of the quantity.
  4. 4.
    Border Color - Set the border color of the quantity.

Cart Button

  1. 1.
    Typography - Set the typography options for the cart button.
  2. 2.
    Normal State -
    1. 1.
      Color - Set the color of the cart button.
    2. 2.
      Background Color - Set the background color of the cart button.
    3. 3.
      Border Type - Set the border settings for the cart button.
    4. 4.
      Border Radius - Set the border radius for the cart button.
  3. 3.
    Hover State -
    1. 1.
      Color - Set the color of the cart button.
    2. 2.
      Background Color - Set the background color of the cart button.

SKU

  1. 1.
    Typography - Set the typography options of the SKU in the popup.
  2. 2.
    Title Color - Set the title color of the SKU.
  3. 3.
    Content Color - Set the color of the content of the SKU in the popup.
  4. 4.
    Hover Color - Set the hover color for the SKU in the popup.

Close Button

  1. 1.
    Icon Size - Set the icon size of the close button.
  2. 2.
    Button Size - Set the button size.
  3. 3.
    Color - Set the color.
  4. 4.
    Background - Set the background color.
  5. 5.
    Border Radius - Set the border radius of the button.
  6. 6.
    Box Shadow - Set the box shadow properties of the button.
  1. 1.
    Border Radius - Set the border radius of the popup window.
  2. 2.
    Background Type - Set the background of the popup window.
  3. 3.
    Box Shadow - Set the box shadow properties of the popup window.

Dots

  1. 1.
    Preset - Select the preset style for the dots.
  2. 2.
    Position - Select the position of the dots.
  3. 3.
    Use Custom Width/Height? - Enable/Disable the custom width and height controls for the dots.
  4. 4.
    Normal State -
    1. 1.
      Color - Set the color of the dots.
    2. 2.
      Border Type - Set the border settings of the dots.
    3. 3.
      Border Radius - Set the border radius of the dots.
    4. 4.
      Padding - Set the padding of the dots.
  5. 5.
    Hover State -
    1. 1.
      Color - Set the color of the dots.
    2. 2.
      Border Color - Set the border color of the dots.
  6. 6.
    Active State -
    1. 1.
      Color - Set the color of the dots.
    2. 2.
      Width - Set the width of the dots.
    3. 3.
      Height - Set the height of the dots.
    4. 4.
      Border Radius - Set the border radius of the dots.
    5. 5.
      Shadow - Set the shadow properties of the dots.

Arrows

  1. 1.
    Choose Arrow - Select the arrow.
  2. 2.
    Arrows Size - Set the size of the arrows.
  3. 3.
    Icon Size - Set the icon size.
  4. 4.
    Align Left Arrow - Set the alignment of the left arrow.
  5. 5.
    Align Right Arrow - Set the alignment of the right arrow.
  6. 6.
    Normal State -
    1. 1.
      Background Color - Set the background color of the arrows.
    2. 2.
      Color - Set the color of the arrows.
    3. 3.
      Border Type - Set the border settings of the arrows.
    4. 4.
      Border Radius - Set the border radius of the arrows.
    5. 5.
      Box Shadow - Set the box shadow properties of the arrows.
  7. 7.
    Hover State -
    1. 1.
      Background Color - Set the background color of the arrows.
    2. 2.
      Color - Set the color of the arrows.
    3. 3.
      Border Color - Set the border color of the arrows.
    4. 4.
      Box Shadow - Set the box shadow properties of the arrows.