null
[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:

  1. Supermarket
  2. Sarahmarket
  3. Paralbag
  4. LaParis
  5. CARIL

Contact us if you need help or mod for other themes.

19th Jan 2018 Papathemes

Theme design & customization blog

Show More

Did you know?

Free Trial for all our BigCommerce themes.

Request Now

Need help? Don't hesitate to ask us. We'll reply shortly.

All our BigCommerce themes are 100% compatible with the Standard, Pro, Enterpise edition. Built with Stencil / Cornerstone framework.