Woo Featured Products Slider Element

Last Update: April 17, 2024

The Woo Featured Products Slider Element is a great way for you to showcase your WooCommerce products. It’s very similar to the Woo Carousel Element, only with this Element it’s automatically using your featured products for the content. You can also choose to show or hide information such as category, price and buttons. Read below to discover more about this awesome E-Commerce Element!

For privacy reasons YouTube needs your permission to be loaded.

How to Use the Woo Featured Products Slider Element

To use the Woo Featured Products Slider Element, follow the simple steps below.

Navigate to the Products section of your WordPress admin. Look for the Featured column, which is the one with the star icon (see screenshot below). Click the star icon next to all products that you want to be featured. You need to do this one product at a time, as the page will refresh each time. Doing this makes the product a featured product.

Next, go to the page where you want the featured products to appear. Add the Woo Featured Products Slider Element and select your preferred options. Your featured products will now appear in a slider on your page.

WooCommerce Starred Products

Element Options

Note: The displayed option screens below show ALL the available options for the element. If you have Avada’s Option Network Dependencies turned on, you will only see options relevant to your selections, and so the options screen may look somewhat different.

HeadingDescription
Picture Sizefixed = width and height will be fixed auto = width and height will adjust to the image.
CategoriesSelect a category or leave blank for all.
Number of ProductsSelect the number of products to display.
Product OffsetThe number of products to skip. ex: 1.
Order ByDefines how products should be ordered. NOTE: If Order by Price is not working, please regenerate the Product Lookup Tables here.
OrderDefines the sorting order of products.
Include Out Of Stock ProductsChoose to include or exclude products which are out of stock.
Carousel LayoutChoose to show titles on rollover image, or below image.
Carousel AutoplayChoose to autoplay the carousel.
Maximum ColumnsSelect the number of max columns to display.
Column SpacingInsert the amount of spacing between items without 'px'. ex: 13.
Scroll ItemsInsert the amount of items to scroll. Leave empty to scroll number of visible items.
Show NavigationChoose to show navigation buttons on the carousel.
Mouse ScrollChoose to enable mouse drag control on the carousel. IMPORTANT: For easy draggability, when mouse scroll is activated, links will be disabled.
Show CategoriesChoose to show or hide the categories.
Show PriceChoose to show or hide the price.
Show Sale BadgeChoose to show or hide the sale badge.
Show ButtonsChoose to show or hide Add to Cart / Details buttons on the rollover.
MarginEnter values including any valid CSS unit, ex: 4%.
Element VisibilityChoose to show or hide the element on small, medium or large screens. You can choose more than one at a time.
CSS ClassAdd a class to the wrapping HTML element.
CSS IDAdd an ID to the wrapping HTML element.

Useful Links & Resources

In this article