![[BigCommerce] Make product image always centered on product details page](https://cdn11.bigcommerce.com/s-c14n6tful3/images/stencil/830x518/uploaded_images/bigcommerce-make-product-image-centered.jpg?t=1516339262 "[BigCommerce] Make product image always centered on product details page")
[BigCommerce] Make product image always centered on product details page
Add the code below in your Storefront > Footer Script:
<style>
@media (min-width: 801px) {
.productView-imageCarousel-main-item > a {
position: relative;
display: block;
height: 0;
padding-top: 100%;
}
.productView-imageCarousel-main-item > a img {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
}
</style>This code works for these themes:
- Supermarket
- Sarahmarket
- Paralbag
- LaParis
- CARIL
Contact us if you need help or mod for other themes.
19th Jan 2018
Theme design & customization blog
-
Auto update quantity of products bought together according to the main product qty in Supermarket theme
Insert the code below to Storefront > Script Manager:<script>(function($) { $('body').on …9th Sep 2019 -
Identify which products bought together belong to the main product in Supermarket theme
Solution:Create a product option named Parent SKU:Edit the option set of your also bought together p …9th Sep 2019 -
BigCommerce Supermarket Theme Release Notes
September 09, 2021 - v5.0.2 [CORNERSTONE] HTML Entity displayed as is via system/error message o …15th Apr 2019