Why does the carousel preview look different than my storefront?
The appearance of the carousel preview in the Control Panel can differ substantially from the carousel as it appears on your storefront. This is because the preview in the control panel does not take into consideration the CSS styling from the Theme. The carousel on the store-front shows both user-created and template-based styling.
To find the Carousel Builder, go to Storefront Design › Design Options, then click the Carousel & Social Media tab
Fonts and Text Positioning
The user has control over the following aspects of the carousel. These aspects will display the same on the carousel preview in the control panel and the storefront.
- Image order
- Text color
The template controls over the following aspects. These will only show on the storefront, not on the preview in the control panel.
- Image size
- Text font
- Position of text
To get an idea of what your selected theme's carousel will look like, go to Storefront Design › My Themes, click the image of your current theme and select View demo from the Theme Options dropdown.
If the images look blurry, stretched or squished, it may not meet the image dimension requirements for the theme. See Finding Carousel Image Dimensions to learn more about the specifics of image dimensions for your particular theme. To learn how to fix images to fit the theme's image dimensions, see Fixing Distorted Images for detailed instructions.
- Using the Carousel Builder
- BigCommerce University Video — Carousel Tips and Tricks
- Customizing the Built-In Carousel's Fonts (Blueprint)
- Fixing Distorted Images
- Finding Carousel Image Dimensions
- Community Answers — ask specific questions about carousel design and find help for your specific needs from fellow merchants with expertise, partners, and BigCommerce Staff.