Free Digital Courses 1 min a Day

Designed for learners of all ages. Easy to understand. Deaf-friendly.

Start upgrading your skills today!

FAQ

Qn:

[WooCommerce Store] How to Create Scrolling Products Carousel using Elementor Pro

Ans:

Most eCommerce websites have homepages that showcase some products in some form of layout. One popular way to showcase products would be to use the Carousel Element. Do note that this element is only available for those using Elementor Pro.

Here’s how to use the Carousel Element to display your products:

First, look for the “Media Carousel” Element and drag it to a Section at your Homepage.

Under “Content” at the Editor Sidebar, click on “Item #1” and add your product image, then add in your URL link below. Do the same for as many product items as you like.

Once done, scroll down to see “Slides Per View”. You may set how many products you like to see in one visible row. Under “Slides to Scroll”, we usually set it to 1 so that the Carousel moves slowly, one product comes in at a time.

Click on “Additional Options”, set Image Size to “Full” and Image Fit to “Contain”.

If you like each image to show up in a box, you may go to “Style” to set Border Size and Border Colour. Border Radius will determine how round your border will look. Set it as 0 to see a square or rectangle. If you like your box to look more rounded, increase the border radius.

Your carousel should look good by now!

Feel free to comment below if there’s anything more you need to see in your carousel. Meantime, have fun! 🙂

Leave a Reply

Your email address will not be published.

×

Hello!

Click one of our representatives below to chat on WhatsApp or send us an email to [email protected]

× How can I help you?