magento 2 override the default "luma" fotorama-item product detail page slider .phtml

Question

I want to change the fotorama-item and palace the custom zoom functionality on the product detail page. I am using the default "luma" theme not my custom theme.

I have gone to the admin panel and Enabled Template Path Hints for Storefront and it's using the below file:

E:/xampp/htdocs/learnmagento/vendor/magento/module-catalog/view/frontend/templates/product/view/gallery.phtml

So, just want to remove fotorama and palace the below example when we hover on the image.

http://www.elevateweb.co.uk/image-zoom/examples

I want to use the Inner Zoom.

Anybody can help me how I can palace the Inner Zoom functionality when user hove on the image.

Answer 1

If you want to use zoom functionality within (Inner Zoom) the Image,

\vendor\magento\theme-frontend-luma\etc\view.xml

You can enable the magnifier ‘true’ as referenced,

<var name="magnifier">
<var name="fullscreenzoom">5</var> <!-- Zoom for fullscreen (integer)-->
<var name="top"></var> <!-- Top position of magnifier -->
<var name="left"></var> <!-- Left position of magnifier -->
<var name="width"></var> <!-- Width of magnifier block -->
<var name="height"></var> <!-- Height of magnifier block -->
<var name="eventType">hover</var> <!-- Action that activates zoom (hover/click) -->
<var name="enabled">true</var> <!-- Turn on/off magnifier (zoom) (true/false) -->
</var>

Recommended to change the changes by creating custom theme.