fbpx
  • Days
  • Hours
  • Minutes
  • Seconds
Wpwax Offer
Save up to 35%
on any purchase
Grab the Deal
blog left design shape
How to use a product slider for WooCommerce plugin

How to Use a Product Slider for WooCommerce Plugin 

WooCommerce is the most popular eCommerce plugin that enables businesses to sell their products online. WordPress comes with various types of eCommerce plugins, depending on the diverse capabilities of the WooCommerce plugin. Moreover, considering the functionalities of WooCommerce, WordPress offers a wide range of product slider plugins that businesses can use to showcase products on their website.

A product slider is an essential tool for any WooCommerce store. It lets you showcase multiple products in a single space, which is great for highlighting new arrivals, top sellers, or special offers. Product sliders for WooCommerce plugins are easy to set up and can be added to any post or page on your website.

Throughout this practical guide, we will demonstrate the process on how to use a WooCommerce product slider plugin. Let’s jump right into the details.

How to Use a Product Slider for WooCommerce Plugin

There are different kinds of product slider WordPress plugins for WooCommerce that you can use to display the products of your eCommerce store ingeniously and effortlessly. For this tutorial, We will use a WooCommerce product slider plugin named ‘Product Carousel, Slider and Grid Ultimate for WooCommerce’. 

We will be displaying how you can use this dynamic product slider plugin. Before that, ensure you have installed the mighty WooCommerce on your website. 

Step 1: Install and activate the plugin

To initiate the process, install ‘Product Carousel, Slider, and Grid Ultimate for WooCommerce’ on your website from the WordPress plugin repository. To do this, go to Dashboard and click on Plugins ➤ Add New

You will be on the Add Plugins page. Now, search by writing the plugin’s name. Once the plugin appears, click on Install Now to install it.

Product slider for WooCommerce: Install the plugin.

After installing, click on Activate to make the plugin functional. 

Product slider for WooCommerce:  Activate the plugin.

So, you have successfully activated the plugin on your website.

Step 2: Take a tour of the plugin 

‘Product Carousel, Slider, and Grid Ultimate for WooCommerce’ is used to add WooCommerce products anywhere on your website. That’s why this product slider WordPress plugin allows you to add as many products as you using a single shortcode on your website. Let’s see how you can use this robust product slider for the WooCommerce plugin. 

First, click on WooCommerce Product Ultimate ➤ Add New from your Admin Dashboard. You will land on the Add New page. Here you can create shortcodes for products to display on your website using a carousel or grid style. 

You will find Shortcode along with three different settings: Shortcodes, General Settings, Carousel/ Grid Settings, and Style Settings. Let’s take a tour of each of them. 

Product slider for WooCommerce:  Add new shortcode.

Shortcode:

In Shortcode, you can copy the automatically generated shortcode of any product slider and display sliders anywhere on your website. 

Product slider for WooCommerce: Automatically generated shortcode.

General Settings: 

General Settings includes different layouts for displaying products like Carousel and Grid. You will get 3 different themes for the Carousel and Grid sliders to display products. You can also set the number of products to display and select from different product types to make the product displaying process easier.  

Product slider for WooCommerce: General Settings.

Carousel Settings:

You can display your store’s product in carousel view with the carousel settings. To make it more dynamic, you can control any slider’s transition using the Auto Play option, Products Column on different devices, slide customization, navigation customizations, and many more. 

Product slider for WooCommerce: Carousel settings.

Grid Settings: 

From the Grid Settings option, you can set the number of columns to display on different devices, different pagination styles, and more to display products more efficiently in grid view. 

Product slider for WooCommerce: Grid settings.

Carousel Style Settings:

In the Carousel Style Settings, you can customize the style of your product’s carousel display. Here you can customize the style of different fonts of your Carousel slider and stylize product price font, Add to Cart button, and more. 

Product slider for WooCommerce: Carousel style settings.

Grid Style Settings:

From the Grid Style Settings, you can customize the style of the Grid product display. It also includes different Settings options to make the Grid product display more efficiently. 

Product slider for WooCommerce: Grid style settings.

Step 3: Using ‘Product Carousel, Slider, and Grid for WooCommerce’ to display the product

By using this dynamic product slider for the WooCommerce plugin, you can display products of any quantity using Carousel and Grid sliders on your website. You need to copy the automatically generated Shortcode, paste it to any post or page, and display products. 

To display products using the Carousel view, go to WooCommerce Product Ultimate ➤ Add New. You will land on the ‘Settings and Shortcode Generator page. Now, click on General Settings and select the Carousel Layout.

Product slider for WooCommerce: Go to General Settings and select carousel layout.

Once you select the carousel layout, you can go to the ‘Carousel Settings’ and do the necessary customization. After finishing the essential customization, you can make your carousel display ready for display. 

When you finish everything, go to the Shortcode tab, copy the automatically generated shortcode, and click on Publish.

Product slider for WooCommerce: Copy and publish the automatically generated shortcode.

Similarly, when you like to display products in the Grid view, all the processes are almost identical, but the difference is that you need to select the Grid in place of the Carousel view when you choose the layout. After that, if any change is necessary, you can go to the ‘Grid Settings’ and do it carefully.

Product slider for WooCommerce: Go to General Settings and select the grid layout.

Next, go to the Style settings and customize the Grid’s view product display style. When everything is done, go to the Shortcode option and copy the automatically generated Shortcode and click on Publish to finish the procedure. 

Product slider for WooCommerce:  Copy and paste the automatically generated shortcode.

Step 4: Paste the copied shortcode to display products in the carousel or grid view

When you are done, you can display products by pasting the copied shortcodes on any page or post of your website in a carousel or grid view using this product slider for WooCommerce plugin.

Product view in carousel 

Product slider for WooCommerce:  Product display in carousel view.

Product view in grid

Product slider for WooCommerce: Product display in grid view.

Finishing Off

The more strategic you are in presenting your service to your customers, the more chances you will have to be successful in your business. That’s why using a product slider is a very efficient way to promote your products attractively to potential clients.

Today’s post has shown how to use a product slider for the WooCommerce plugin for your eCommerce website. From now on, you won’t be in the dark anymore about the usage of product sliders. 

If you liked this post, don’t forget to subscribe to our blog so that we can notify you once any post is published. Finally, you can also follow wpWax on FacebookTwitter, and LinkedIn for more exciting news, offers, and product updates.

Share
URL copied to clipboard!
Written by

Abdullah Al - Harun

Abdullah Al Harun is a technical content writer at wpWax and a digital marketing enthusiast. Apart from tech, he enjoys reading books on different aspects of communication, journalism, science, and arts. On his time off, you will find him playing cricket with his teammates.

Share
URL copied to clipboard!

Leave a Reply