JetProductGallery. Gallery Anchor Navigation widget. How to create a scrollable product images layout with an anchor navigation element

This tutorial uncovers the way of creating a scrollable product images layout with Gallery Anchor Navigaion widget from JetProductGallery plugin.

With Gallery Anchor Navigation widget you can display images of the product in an attractive way. You can showcase images in the form of a slider with vertical or horizontal pagination and change its appearance with the help of different style settings.

Note, that you will need JetWooBuilder plugin or Elementor Pro to create galleries with JetProductGallery.

Reading this tutorial will help you to create a scrollable product images layout using Gallery Anchor Navigation widget. So, let’s start!

Creating a Gallery Anchor Navigation

Step 1 — Firstly, open the page to which you want to add a Gallery Anchor Navigation widget and click on the Edit with Elementor button to proceed. Then, drag-n-drop the widget to the needed section.

Step 2 — After that, navigate to the General settings block. Here you need to paste the Product id of the product you want to show. Also, you can Enable Gallery and Zoom options.


There’s also an opportunity to change the Image size according to your preferences.


In the Gallery block, you can choose the Button Icon, Show Caption and enable Controls.


Moreover, if you’ve added a Video to your product, you can change its settings in the Video settings block.


Step 3 —The last thing here is the Style settings block. You can change the appearance of your layout using a lot of different style settings to make your website really stylish.


Step 4 — When you’ve done with customization, click on the Publish button and preview the result.

Gallery Anchor Navigation. Preview

That’s all you need to do to create the scrollable product images layout with the help of Gallery Anchor Navigation widget.