Modula Zoom

To install Modula Pro and its extensions please follow our guide: How to Install Modula Pro Extensions.

Our Zoom extension has been created to see the features and the details of your images.

How does it work? Well, you have to activate the Zoom extension from the Modula dashboard in the Settings section.

More precisely, go to Modula -> Galleries -> Select gallery you want -> Zoom and then Enable the option.

As you can see in the picture above, the Zoom extension comes with a few additional features. More exactly:

1. Zoom on Hover 

   Enable this option for the zoom to come up when hovering over an image. Click here to see a demo with this setting. Zoom on hover will automatically turn into zoom on click/tap on mobile devices and touch-enabled laptops.

2. Type of zoom

   Choose your preferred zooming type. You can customize the window size and the place where you would like to set it. Moreover, inner zooms inside the actual image and lens will give you a looking-glass effect.
   -> Basic
   -> Inner
   -> Lens

   Please keep in mind that each type of zoom (Basic, Inner, and Lens) comes with certain settings.

Basic Type of zoom

1. Zoom Window Position

   Where the zoom window will display in the lightbox when you hover over an image. Choose your preferred zoom window position. It has 4 options:

   -> Upper Left
   -> Upper Right
   -> Lower left
   -> Lower Right

2. Zoom Window Size

   You can choose what size should the zoom window have when you hover over an image in the lightbox. Check which option you want for the window size:

   -> Small
   -> Medium
   -> Large
   -> Extra Large

3. Zoom Lens Shape

   The shape of the zoom lens when you hover over an image in the lightbox. Select your zoom lens shape:

   -> Round
   -> Square

4. Tint Color

   It will add an overlay/tint on the image in the lightbox. Select a tint color or leave it blank for no tint. Also, you can enter HEX color codes if you want a specific color. For example, to make it red you would use this color code: #ff0000. Click here to see a demo. See below a screenshot with the code added:

   

5. Tint Opacity

   Select a tint opacity. If you change the opacity to 100, you will see the full color of your image, and if you modify it to 0, the color will not be noticed. Click here to see a demo.

Inner Type of zoom

When you set this type, no additional settings will be displayed.

Lens Type of zoom

1. Zoom Effect

   Choose the effect you want on Zoom. You can choose between:

   -> No effect
   -> Fade In
   -> Fade Out
   -> Easing

2. Lens Size

   The size of the zoom lens when you hover over an image in the lightbox. It can be:

   -> Small
   -> Medium
   -> Large
   -> Extra Large

3. Zoom Lens Shape

   The shape of the zoom lens when you hover over an image in the lightbox. Select your zoom lens shape:

   -> Round
   -> Square