Skip to content
Ultra Addons
Ultra Addons

Ultra Addons

Best Elementor addons WordPress Plugin

  • Home
  • Features
    • Extension
    • Widgets
    • Changelog
  • Templates
  • Pricing
  • Products
    • Product Table for WooCommerce
    • Min Max Quantity & Step Control
    • Quantity Plus Minus Button
    • Post Classified for making Documentation
    • Add to Cart Text Changer
    • Astha WordPress Theme
  • Doc
  • Blog
Get UltraAddons
How to add a Product Slider in WooCommerce by Using UltraAddons Elementor —

How to add a Product Slider in WooCommerce by Using UltraAddons Elementor

Adding a product slider in WooCommerce can be a great way to show off your products and increase sales. If you’re looking for a slider to showcase your products on your WooCommerce or Elementor, you may be out of luck. Neither of these platforms has a built-in slider feature, but that’s where UltraAddon comes in.

You can add a product slider in WooCommerce using the UltraAddon Elementor Pro plugin. This plugin allows you to add a product slider to your WooCommerce store easily. UltraAddon is a plugin that lets you create slideshows of your products with just a few clicks. UltraAddon has a slider that lets you easily create an attractive and functional slider to show off your products.

This article will show you how to add a product slider in WooCommerce by using UltraAddon Elementor.

Table of Contents

  • How to add a Product Slider in WooCommerce by Using UltraAddon Elementor pro:
    • A. Query Setting:
    • B. Slider Options:
    • C. Navigation Settings:
    • D. General Settings:
    • E. Animation Options:
    • F. Wrapper Link:
    • G. Hover Effect:
    • Final Words
  • Ultra Addons
      • The Most Popular Elementor Addons

How to add a Product Slider in WooCommerce by Using UltraAddon Elementor pro:

With Ultra Addons, you can integrate a WooCommerce Product Slider into Elementor. It is more convenient than the traditional method. Let’s have a look at how the procedure works.

When you use the Elementor Search Widget box to look for a product slider, you’ll see three different types of sliders.

1. Product Slider
2. Product Carousel
3. Product Flip Carousel

You don’t have to be worried because they’re all following the same process to add a Product  Slider in WooCommerce.

So, here we are discussing only the product Flip carousel.

search product slider widget

When you drag and drop this widget as per your preference, you will see a slider like below.

product carousal show

All your products will show up on your slider. You can customize it, so why not do it?

Have a look at the six types of section tabs that will help you customize your product flip slider on demand.

A. Query Setting:

1. Description Length: product details length.

2. Show Products: How many products do you want to show in your slider? This section will help to do it.

3. Page Number:  Usually, you have lots of product pages; you can choose which shop page products you want to show on your slider.

4. Order:  You can set your products to sort in ascending or descending order.

5. Orderby:  Product is shown in slider order by None, Id, Name, Type, Random, and Modified.

6. Select category: Set products catagory.

7. Select Tag: You can set product attributes as like tags.

8. Product by included IDs:  Add multiple product ids that only you want to show on your slider.

9. Product by excluded IDs:  You can set their product IDs to which product you don’t like to show on your slider. Use comma-separated when you add multiple ids.

query customize on content slider

B. Slider Options:

1. Slider to Show:  You can also decide the number of slides you want to show in each slider from the Slides to Show drop-down menu. Up to 6 slides can be shown in one slider.

2. Gap: This toggle switch button sets the spacing between two products on a slider.

3. Auto Play: Get the slides to rotate automatically, according to the speed you set.

4. Auto Play Interval:  Set the time it takes for the slide to start rotating.

5. Pause on Hover:  The toggle switch button sets the slide to pause when the mouse hovers over it.

6. Reveal: All the content takes the same size of the block on the slider.

slider option set

C. Navigation Settings:

1. Navigation:  Choose to display Round with arrows, Chevron, Arrow, Caret, Caret filled, Square with chevron dots or none.

2. Dark:  This toggle switch button sets the background color of the Navigation.

3. Always Visible:  The toggle switch button allows navigation to be visible on the slider or not.

4. Navigation Outside:  If you use this toggle switch button, the navigation show will be outside the slider.

5. Small:  Reduce the overall size of navigation.

navigation setting on slider

You will see Navigation on a slider like below.

demo navigation show on sloder

Indicators Settings:

1. Indicator Shape:  Choose to display the indicator shape
as Default, Round Square.

2. Indicators:  The toggle switch button allows Indicators to be visible on the slider or not.

3. Indicator Outside: The indicator shown will be outside the slider using this toggle switch button.

4. Indicators Highlight:  You can set Indicators highlight.

5. Indicators Dark: Change the Indicators background color.

6. :  If you want to show Indicator on the mobile device, you can enable this option.

indicators setting on product slider

You will see Indicator on a slider like below.

demo indicators show on below slider

D. General Settings:

1. Animation Style:  Set the animation effect of the content’s display when the slide is shown: horizontal or vertical.

2. Select Front Title Tag:  Set the Front Title’s tag to H1-H6 or Div.

3. Select Back Title Tag:  Set the Back Title’s tag to H1-H6 or Div.

main setting for product slider

E. Animation Options:

1. Enable Animation:  If you want to set the animation effect overall slider, you must enable the toggle switch button.

2. Select Animation:  You can set the animation effect all-around sliders.

animation customized for product slider

Related Post

How to create an image gallery with Elementor

F. Wrapper Link:

just like other cool widgets of Ultra Addons, the Ultra Slider also brings the Wrapper Link section where you can insert your desired URL; not only you can insert an URL but also add a nofollow rule to it, make it open in a new window, and insert Custom Attributes by clicking the settings icon.

wrapper link set on full slider content

You can also include Dynamic Content by clicking the link beside the settings icon. Then, press the SEE IT IN ACTION button to find out more.

wrapper link dynamic

G. Hover Effect:

Ultra Addons feature numerous hover effects for all of its widgets. Just head towards the Hover Effect section and select the animation that you like the most for the Pricing Table.

hover set it on slider animation

Final Words

Adding a product slider in WooCommerce is a great way to showcase your products and increase sales. UltraAddon Elementor makes it easy to add a slider, and there are many customization options available, so you can make the slider look precisely the way you want. So be sure to check out UltraAddon Elementor if you’re going to add a product slider to your WooCommerce store. Elementor and WooCommerce do not have a built-in option to create a product slider, but UltraAddon does. This plugin is easy to use and can be customized to fit your needs. If you are looking to showcase your products, UltraAddon is the best option available.

Special Discount for ultra addons

Ultra Addons

The Most Popular Elementor Addons

Get Up To 53% Discount
Elementor Elementor Pro Product Slider website wordpress

Share

Post navigation

Previous: How to Copy a Page in WordPress Elementor (with 3 Simple Steps)
Next: What Happens When You Remove Elementor Pro

Get Started Now

Download UltraAddons Elementor Lite for completely
free and start making beautiful websites today.

Free Download
Get Premium
Subscribe to our Newsletter
Resource
  • Ready Templates
  • Documentation
  • Changelog
  • Video Tutorial
  • Blog & News
  • Write For Us
Company
  • Our Service
  • Get Quote
  • Refund Policy
  • Support Policy
  • Privacy Policy
  • Terms of Service
Our Products
  • Product Table for WooCommerce
  • Min Max Quantity & Step Control
  • UltraAddons Elementor Lite
  • Quantity Plus Minus Button
  • Post Classified for making Documentation
  • Add to Cart Text Changer
  • Astha WordPress Theme
Facebook-f Twitter Linkedin Instagram Youtube
© 2022, UltraAddons from CodeAstrology. All Rights Reserved
We use cookies on our website to give you the most relevant experience by remembering your preferences and repeat visits. By clicking “Accept All”, you consent to the use of ALL the cookies. However, you may visit "Cookie Settings" to provide a controlled consent.
Cookie SettingsAccept All
Manage consent

Privacy Overview

This website uses cookies to improve your experience while you navigate through the website. Out of these, the cookies that are categorized as necessary are stored on your browser as they are essential for the working of basic functionalities of the website. We also use third-party cookies that help us analyze and understand how you use this website. These cookies will be stored in your browser only with your consent. You also have the option to opt-out of these cookies. But opting out of some of these cookies may affect your browsing experience.
Necessary
Always Enabled
Necessary cookies are absolutely essential for the website to function properly. These cookies ensure basic functionalities and security features of the website, anonymously.
CookieDurationDescription
cookielawinfo-checkbox-analytics11 monthsThis cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Analytics".
cookielawinfo-checkbox-functional11 monthsThe cookie is set by GDPR cookie consent to record the user consent for the cookies in the category "Functional".
cookielawinfo-checkbox-necessary11 monthsThis cookie is set by GDPR Cookie Consent plugin. The cookies is used to store the user consent for the cookies in the category "Necessary".
cookielawinfo-checkbox-others11 monthsThis cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Other.
cookielawinfo-checkbox-performance11 monthsThis cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Performance".
viewed_cookie_policy11 monthsThe cookie is set by the GDPR Cookie Consent plugin and is used to store whether or not user has consented to the use of cookies. It does not store any personal data.
Functional
Functional cookies help to perform certain functionalities like sharing the content of the website on social media platforms, collect feedbacks, and other third-party features.
Performance
Performance cookies are used to understand and analyze the key performance indexes of the website which helps in delivering a better user experience for the visitors.
Analytics
Analytical cookies are used to understand how visitors interact with the website. These cookies help provide information on metrics the number of visitors, bounce rate, traffic source, etc.
Advertisement
Advertisement cookies are used to provide visitors with relevant ads and marketing campaigns. These cookies track visitors across websites and collect information to provide customized ads.
Others
Other uncategorized cookies are those that are being analyzed and have not been classified into a category as yet.
SAVE & ACCEPT