README

Magento 2 Product Hover Images

The module is designed to display alternative image when mouse cursor is hovering a product in product listing

IMPORTANT: if you like the extension, could you please add a star to this GitHub repository in the top right corner. This is really important for us. Thanks.

Installation

Using Composer (recommended)

Go to your Magento root folder

Download the extension using composer:

composer require magestyapps/module-hover-image

Run setup commands:

php bin/magento setup:upgrade;
php bin/magento setup:di:compile;
php bin/magento setup:static-content:deploy -f;

Manually

Go to your Magento root folder:
```
cd <magento_root>
```
Copy extension files to app/code/MagestyApps/HoverImage folder:
```
git clone https://github.com/MagestyApps/module-web-images.git app/code/MagestyApps/HoverImage
```
NOTE: alternatively, you can manually create the folder and copy the extension files there.

Run setup commands:

php bin/magento setup:upgrade;
php bin/magento setup:di:compile;
php bin/magento setup:static-content:deploy -f;

Configuration

General Settings

You can find the module's settings under:

Stores > Configuration > MagestyApps Extensions > Product Hover Image

In the Hover Effect setting you can choose the preferred styling for the hover effect. Possible options are:

Slide Left
Slide Right
Slide Up
Slide Down
Fade

Assigning a hover image for a product

In order to select a specific image to be displayed as an alternative image for a product, you should do the following:

Edit the product in admin panel and go to the Media Gallery section.
Select the necessary image
In the modal window in the 'Role' field, select the 'Hover Image' option
Save the product
Flush Magento cache if needed

Other Extensions

You can find more useful extensions for Magento 2 by visiting MagestyApps Official Website

magestyapps / module-hover-image

Maintainers

Details