How to Remove Image Zoom on Shopify Product Pages

When you create an online store on Shopify, one of the important steps is customizing the look and layout of your product pages. A common feature that can be found on product pages is the image zoom feature, which allows customers to zoom in and see details of product images.

However, in some cases, you may want to remove this feature to meet your specific business needs. In this article, we will discuss step by step how to remove the image zoom feature on Shopify product pages.

1. Go to Online Store -> Theme -> Edit code

2. Search for “Layout” -> “header.liquid” -> Paste below “head” the following code:

<style>

.product__media-toggle {display: none !important;}

.product__modal-opener .product__media-icon {display: none !important;}

</style>

If you prefer, you can also install the “Easy Custom CSS” application, without having to change the active theme. In this case, just remove the <style></style>, as the tool already reads the code and inserts it together with the active theme in Shopify.