• Overview
  • Adding Gallery with Image Thumbnails
  • Switching to Image Thumbnails Gallery Layout
  • Adding Items to the Image Thumbnail Gallery
  • Image Options
  • Image Thumbnails Options
  • Image Thumbnails in Responsive Modes
  • Product Image Gallery

Gallery with Image Thumbnails is one of the awesome layouts of the Gallery element that helps to represent your images or products.

release-switch-to-image-thumbnails-layout-for-gallery.gif
release-gallery-with-image-thumbnails.jpg

You can add the Gallery with Image Thumbnails from the Elements menu.

add-gallery-thimbnails.png

You can also add Image Thumbnails Gallery from the Slider menu.

add-slider-image-thumbnails.png

You can change the layout to the Gallery with Image Thumbnails for any existing Image Gallery.

release-switch-to-image-thumbnails-layout-for-gallery.gif

Click on the "+" sign to add a new image to the Gallery.

add-item.png

Use tabs to switch between Gallery Items.

switch-items.png

Image Options

You can enable the Zoom Image On Click option or add an image hover effect like Zoon.

gallery-image-options.png

Image Thumbnails Options

You can specify the Height, Width for the Thumbnails and the padding around and spacing between them.

release-image-thumbnails-options.png

Also, you can set the Thumbnail position.

release-image-gallery-thumbnails-poisition.png

Image Thumbnails in Responsive Modes

The Image Thumbnails are placed in a horizontal row in the Responsive Modes.

release-image-thumbnails-in-responsive-modes.gif

This type of Gallery is used by the Product Image Gallery element, which is available for the Product Details element and template.

product-image-gallery.png

- Overview - Adding Gallery with Image Thumbnails - Switching to Image Thumbnails Gallery Layout - Adding Items to the Image Thumbnail Gallery - Image Options - Image Thumbnails Options - Image Thumbnails in Responsive Modes - Product Image Gallery ## Gallery Thumbnails Overview Gallery with Image Thumbnails is one of the awesome layouts of the Gallery element that helps to represent your images or products. !release-switch-to-image-thumbnails-layout-for-gallery.gif! !release-gallery-with-image-thumbnails.jpg! ## Adding Gallery with Image Thumbnails You can add the Gallery with Image Thumbnails from the Elements menu. !add-gallery-thimbnails.png! You can also add Image Thumbnails Gallery from the Slider menu. !add-slider-image-thumbnails.png! ## Switching to Image Thumbnails Gallery Layout You can change the layout to the Gallery with Image Thumbnails for any existing Image Gallery. !release-switch-to-image-thumbnails-layout-for-gallery.gif! ## Adding Items to the Image Thumbnails Gallery Click on the "+" sign to add a new image to the Gallery. !add-item.png! Use tabs to switch between Gallery Items. !switch-items.png! ## Image Options You can enable the Zoom Image On Click option or add an image hover effect like Zoon. !gallery-image-options.png! ## Image Thumbnails Options You can specify the Height, Width for the Thumbnails and the padding around and spacing between them. !release-image-thumbnails-options.png! Also, you can set the Thumbnail position. !release-image-gallery-thumbnails-poisition.png! ## Image Thumbnails in Responsive Modes The Image Thumbnails are placed in a horizontal row in the Responsive Modes. !release-image-thumbnails-in-responsive-modes.gif! ## Product Image Gallery This type of Gallery is used by the Product Image Gallery element, which is available for the Product Details element and template. !product-image-gallery.png! ##