View source for Design/Customizing product Zoom

<div style="margin-top:50px">
==What is product zoom ? ==
<div align="justify">
Image zoom enables magnifying feature for your store's product images. This feature automatically shows a high resolution version of the product image when the cursor is moved over the product image.
</div></div>
<div style="margin-top:50px">
==Where to set this feature ==
<div align="justify">
Go to Admin > Setup > Theme > Product Page tab like below


&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;[[image:product_zoom.png | frameless | 1200px]]


You can enable or disable the zooming feature from the product zoom option. And you can choose any zooming type, i.e. window, lens, inner from product zooming type drop-down option.
</div></div>
<div style="margin-top:30px">
===Different kinds of zoom===

Shopnix provides different kinds of zooming features like Window zoom, Inner zoom and Lens zoom.
</div>
<div style="margin-top:30px">
==== Window Zoom====

Hovering over image, displays a zoomed image in a window with the size of your choice.


[[image:window.png | frameless | 1200px]]


</div>
<div style="margin-top:30px">

==== Inner Zoom====

The zoom can be placed inside the image. So the enlarged image is displayed directly in the product image box and it's not overlapping other elements.
 

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;[[image:inner.png | frameless | 1200px]]
</div>
<div style="margin-top:30px">

====Lens Zoom ====
 
Display zoomed image in a circle directly over original image. Feels like you’re examining with a magnifying glass.


&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;[[image:Lens.png | frameless | 1200px]]

 
</div>
<div align="justify">
If you have more queries or would like assistance with this please contact us on [mailto:support@shopnix.in support@shopnix.in].
</div>