Images Gallery thumbnails not switching main image in Elementor template

I am using the WoodMart theme → Elementor Templates → Xtemos Blocks
and inserted the template:

➡ “Choose your pair of shoes”
This template includes:

Images Gallery widget → showing the large product image carousel

Images Gallery widget → showing the small color swatches (thumbnail carousel)

The structure is fully from your built-in template, I did not change the widgets.

Hi,

I am following up because the issue is still not solved.

I am using the WoodMart Elementor Template → “Choose your pair of shoes” from Xtemos Blocks.

This template includes two Images Gallery widgets:

Large product image carousel

Small color swatches carousel (thumbnails)

In your official demo, these two galleries are linked together, so when clicking a small swatch:

The large image changes accordingly

The selected swatch gets an active state

The previous large image hides, and the new one shows

Everything works smoothly

However, on my website:

❌ Clicking a small swatch does NOT switch the large image gallery
❌ No JavaScript event is triggered
❌ No “active” state appears
❌ The two galleries are visually correct but not linked
❌ Interaction is completely broken

I did not modify the structure of the template — I only replaced the demo images with my own product images.
Because the linkage logic is not working, I cannot continue editing this section.

Please help check:

Why my two “Images Gallery” widgets are not connecting like your demo?

Is there any dependency, script, or setting required to link both galleries?

Is this a bug in the template, or something missing in my installation?

Your assistance is urgently needed since this affects my product presentation.

Thank you!

Attachments:

You must be logged in to view attached files.

Hello,

Please share some screenshots for better understanding that demonstrate the problem so we can understand and reproduce it on your website.

Also, share your Site WP-ADMIN Login details in the Private Content field along with the page url where the issue persists so that we can check this concern on your Site and help you out accordingly.

Best Regards,

Hello,

Thank you for your reply.

Here are the screenshots you requested:

1. Official demo behavior (works correctly)

Small color swatches control the large image

Clicking a swatch updates the main image

Active state is applied to the selected swatch

2. My website behavior (not working)

Small swatches do NOT switch the large image

No active state

No interaction

Both galleries are static and not linked

(Please see the screenshots attached.)

Let me know if you need a video as well — I can record one.

I have added the WP-Admin access and the page URL in the Private Content section below.

Thank you.

Attachments:

You must be logged in to view attached files.

hello ,I’m waiting for your reply.

hello ,I’m waiting for your reply.

Hello,

Can you please share the page URL where the issue persists so I can further check on your site and give you a possible solution?

Best Regards,

My website has blocked access. You need to log in to the backend, then go to the frontend, click the Dome page, and then navigate to the module listed below.

hello

Hello,

I have checked your site and the image gallery is working fine when clicked on it.

See this video for clarification: https://jumpshare.com/s/mKWhVXeEnM8BpSkDROjR

Best Regards,

Yes, that’s the effect I want. This involves JavaScript code, and I want to achieve this effect. How can I do it?

hello，help me please

Hello,

The effect is achieved through the synchronization option in the Images Gallery widget.

This built-in synchronization links the large product carousel with the thumbnail/color swatches, so the galleries update together automatically.

You don’t need any additional custom code—just ensure the “Synchronize galleries” option is enabled in the widget settings, and the effect will work exactly like in the template.

Best Regards,

I don’t quite understand. Do you have a detailed video tutorial or documentation for me to refer to? Because someone sitting next to me did the same thing and didn’t achieve the same result.

hello，can u help me?

Hello,

You need to have two separate image galleries on the same page.

1. First gallery > Set as Synchronization: Parent
2, Second gallery > Set as Synchronization: Child

When you click or swipe the image, then the other will also be changed.

See Screenshots for a better understanding:
https://postimg.cc/ygTyxYt4
https://postimg.cc/BXzcXzY5

Best Regards,

[Author]

Posts