(00:01)
Hey guys! Are you trying to figure out how to edit your carousel in BigCommerce? In this video, I’m going to show you several ways to do that.
Before we get started, my name is Cal. I’m a developer, store owner, and I run the eCommerce Growth community for Facebook, which is for store owners just like you and me. Each week, I post more eCommerce videos, so if you find this one helpful, subscribe and hit the bell to see more.
(00:33)
Let me share my screen and show you a couple of different ways to edit your slideshow, carousel, or whatever you want to call it on BigCommerce.
Now, I’m running the Cornerstone theme, and this is the default carousel that’s built into it.
Before I show you how to do this, a quick caveat: why have a carousel in the first place? You should know that studies have shown that having a slideshow above the fold on your homepage can reduce your conversion rate. So, if making sales is important to you, ask yourself if you really need a slider.
If you have a good reason, great! If not, maybe consider a static image instead.
(01:52)
In this video, I’ll show you several ways to edit or create a carousel.
Before we begin, let’s create a couple of slides. I’ve already made some using Canva. If you haven’t used Canva before, check out canva.com—it’s a free graphic editing tool. There’s a paid version with more features, but the free one is great too.
Text on Image vs. HTML Text
One big question when creating slides is whether to put text directly on the image or use HTML to add text afterward. I prefer putting text directly on the image to control the design more precisely. Using HTML for text can work, but you lose some control over placement.
(03:04)
Now that I’ve exported the slides, let’s go back to BigCommerce. This is how the default slider looks on the Cornerstone theme with their standard placeholder images.
Here’s where you can go to edit the settings of this built-in slider:
Go to Storefront -> My Themes -> Customize.
In the page builder, click on Theme Styles, then under the Homepage section, you’ll find the slider settings. You can:Turn the carousel on or off.
Show or hide the carousel arrows.
Enable or disable the play/pause button.
Allow the image to stretch across larger screens (not recommended).
Once you’ve made your changes, click Save.
(06:10)
Now, let’s look at the homepage carousel. With BigCommerce’s built-in carousel, you can have up to five slides—no more.
If you delete a slide and only have one left, it effectively becomes a static image, which isn’t bad, but you’re still loading all the slider functionality in the background.
Option 1: Using the Built-in Slider
To use the built-in slider, you can upload an image, add text, and adjust settings like the slide duration. For example, you can change the slide timing to 4 seconds.
(07:20)
Let’s see how the built-in slider looks with a new image. You’ll notice it automatically overlays text on the image, but I’m not a big fan of that because it obscures the image.
This is why I prefer putting text directly on the image itself—it gives me full control over how it looks.
(09:09)
You can customize the built-in slider further with a developer, adjusting where the text shows up, its opacity, and colors. However, it’s a bit limited in terms of creative control without developer help.
(10:13)
Option 2: Using Static Images
Instead of using a carousel, consider just using a static image. Let me show you how that works.
Turn off the homepage carousel in the Theme Styles settings.
Add a static image instead. You can upload an image directly, and it looks clean without the distractions of a carousel.
(12:23)
Option 3: Using BigCommerce’s Widget Carousel
If you want more control, you can use BigCommerce’s widget carousel feature.
Go to the page builder and drag a carousel widget into any widget-enabled section of your page. You can upload images, adjust text, and more.
This method provides more flexibility than the built-in slider.
(15:00)
Option 4: Using a Custom Widget (Epic Page Builder Widgets App)
We’ve developed an app called the Epic Page Builder Widgets App that adds more advanced widgets, including an advanced slider.
Once installed, you’ll find new options like the Advanced Slider widget in the customizer. This widget offers more functionality, such as:
Displaying part of the next slide to entice viewers to keep scrolling.
Better customization over text placement and styling.
Tabs for easier navigation.
This gives you a more refined slider that doesn’t auto-scroll and offers unique design elements.
Summary
To recap, there are four main ways to add or edit a carousel on BigCommerce:
The built-in homepage carousel (limited to five slides).
The static image option (faster and simpler).
BigCommerce’s widget carousel (available on any widget-enabled page).
Our advanced slider from the Epic Page Builder Widgets App (more control and features).
I hope this video helped you explore the different options! If you found this useful, hit the like button and consider joining our community at JoinEcommerceGrowth.com.
If you need a developer, reach out to me at EpicDesignLabs.com. I’ve been doing this for over 10 years, and I love helping store owners build successful eCommerce businesses.
Thanks for watching, and I’ll see you in the next video!