Premium version settings

Let’s start with the main zoom options, which you can find in YITH > Product Gallery & Image Zoom > Zoom Options.

• Hide zoom on mobile devices: enable this option to disable the zoom option on mobile devices.
• Zoom window position: choose the position of the zoom window in relation to the product image from Right side or Inside.

• Zoom window size (pixels): set the width and height for the zoom window in pixels. Leave 0 for the default value.

• Show zoom icon: enable to show a magnifying glass icon and customize its colors, size and position in the options below.
• Zoom icon colors: icon and icon on hover, background and background on hover.
• Zoom icon size (px): choose the size of the icon in pixels.
• Zoom icon radius (%): set the border radius to change the shape of the zoom background. From 0% square to 100% round.

• Zoom icon position: choose the position of the icon from top left, top right, bottom left, or bottom right.

• Loading label: set the text that will show over the image when loading. This cannot be appreciated if the site loads images quickly, but it is useful if your users visit the site with a slow connection.
• Lens border opacity: this option controls the opacity of the square or rectangle zoom lens. From 0% invisible to 100% fully visible.

• Blur main image: enable this option to blur the main image when zooming. This effect will be visible only if the zoom box is on the right side of the product image, not when the zoom is set to show inside the image.

The plugin allows you to also enable a lightbox option to show the product images in a modal window. You will find all the options for the Lightbox functionality in YITH > Product Gallery & Image Zoom > Main Image Options > Lightbox.

• Enable lightbox in main product image: enable the lightbox feature on the main product image. This will show an icon that will open the image in a modal window when clicking on it. You can customize the icon with the options below.

• Lightbox icon colors: background and background on hover – icon and icon on hover
• Lightbox icon size (px): set the lightbox icon size in pixels.
• Lightbox icon radius (%): set the border radius to change the shape of the lightbox icon background. From 0% square to 100% round.

• Lightbox icon position: choose in which position to show the lightbox icon on the product image from top left, top right, bottom left or bottom right.
• Lightbox overlay color: set the color for the lightbox overlay. Opacity settings are supported.

From the tab Product gallery options, you can control what the product gallery will look like.

Here, you can configure the following options:

• Hide gallery thumbnails from single product page: enable this option to hide the product gallery thumbnails from the product page. Keep it enabled to configure the gallery and the slider.
• Change main image on:
  • Click – the user must click on the thumbnail to change the main product image
  • Hover – the image will be replaced when the mouse hovers over the thumbnail
• Add opacity on inactive thumbnails: enable to add opacity on inactive thumbnails and let only the active thumbnail stand out.

• Apply grey scale on inactive thumbnails: enable to apply greyscale to inactive thumbnails and let only the active thumbnail stand out.

• Add zoom effect to the thumbnails: add a zoom effect when hovering over the thumbnails.
• Active thumb border color: set the color of the active thumbnail border.

Slider options

• Enable slider: enable this option to show the product gallery images in a slider. If enabled, you will be able to configure colors, arrows and autoplay options from the settings below.

• Thumbnails to show: set the number of thumbnails to show in the slider.
• Slider colors: background – border – arrow (default color and on hover)
• Slider sizes: slider – arrow – border
• Border radius (%): set the border radius to change the shape of the slider. From 0% square corners to 100% round corners.
• Show slider arrows:
  • fixed – keep the slider arrows displayed
  • on hover – display the arrows when hovering over the thumbnail gallery.
• Infinite slider: enable to let the slider show all the images and start again from the first. This can have a different setting:
  • circular – the thumbnail after the last one will be the 1st of the list and the slider will start again.
  • back to the 1st – after the last thumbnail the slider go back and jump to the 1st thumbnail.
• Autoplay slider: the slider will automatically play and let the images rotate when the page is loaded.

If you want, you can disable the zoom option on specific products, tags, or categories.

To do it, go to the Exclusion list tab.

Now click on + Add exclusion, and you will be able to choose among:

• specific products
• categories
• tags

Once the products are added to the Exclusion list, the zoom options on them will not apply.