Soliloquy Blog

WordPress slider tips, Tutorials and Resources.
WooCommerce Product Slider by Soliloquy

How to Create a WooCommerce Product Slider (Step by Step)

by Courtney Robertson on July 14, 2016

Do you want to add a WooCommerce product slider to your website? You can easily add a beautiful responsive product slider in WooCommerce to boost your sales and user engagement. In this tutorial, we will show you how to create a WooCommerce product slider.

Sliders are the perfect way to showcase your products, engaging shoppers and helping you to make money online. With a WooCommerce product slider, you can:

  • Filter –  Products by category, price, availability, featured, or another criteria.
  • Focus – Include specific products only or exclude certain products if you don’t want them appearing in your slider.
  • Sort – Display your products sorted by price.

Creating a WooCommerce Product Slider

First, you need to install and activate the Soliloquy Slider plugin. For more details, see this step by step guide on how to install a plugin in WordPress.

In order to install the WooCommerce Slider addon, make sure your license is verified before you proceed. Go to Soliloquy » Settings to verify your license key.

Soliloquy Validate License Key

Install the WooCommerce Addon

Next, you need to install and activate the WooCommerce addon. Go to Soliloquy » Addons. If you do not see it listed, select Refresh Addons.

Activate WooCommerce Addon

Create a WooCommerce Product Slider

Before you can create a WooCommerce product slider, you will need to have WooCommerce installed and set up. See Woo’s Getting Started guide for help setting up WooCommerce.

Now it’s time to create your first WooCommerce Product slider.  Go to Soliloquy » Add New and External Slider. After giving the slider a name, select WooCommerce slider type. Then save your slider as a draft or publish it.

Select WooCommerce Slider

Scroll down to view the Slider settings. Here you can configure settings such as displaying just featured products, products on sale, or even within a specific price range.

After you have set the slider to display exactly what you want, remember to save and publish the form.

WooCommerce Product Slider Settings

Add a WooCommerce Product Slider to Your Website

You’re almost done. Now it’s time to add your slider to a post or page. Edit the post or page where you want to add the product slider. On the post edit screen, click Add Slider and select your WooCommerce product slider. Then publish or update your post / page.

add WooCommerce product slider to WordPress page

You can now visit your website to see your product slider in action.

WooCommerce product slider demo

We hope this tutorial showed you how to create a WooCommerce product slider. You might also want to check out how to create a WordPress slider with thumbnails.

If you like this article, then please follow us on Facebook and Twitter for more free WordPress tutorials.

Courtney Robertson is a content writer for SoliloquyWP. She loves helping customers create the best WordPress sliders.


    Israel Luna

    July 14, 2016

    Is there a code snippet to show Price below Product Title?


      Waseem Abbas

      July 14, 2016

      Hey Israel, there’s no code snippet to do it. However, we are working on a filter that could help you out with your query. In the meantime, you can drop us a line, so we can update you directly about the solution. 🙂


Leave a Reply

We're glad you have chosen to leave a comment. Please keep in mind that all comments are moderated according to our privacy policy, and all links are nofollow. Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.