Google 跟踪代码管理器 - 产品页面上的图像跟踪

Question

I am working on a Shopify website, I want to track how users interact with images on the product page. let's say a user sees the first image (a tag should fire), then he scrolls on the second product image (another tag should fire), and so on.

So I can know how many images on average the user sees on a PDP, what is the conversion rate of users who see 2 images vs 3 images, etc. (On GA)

This would require a custom javascript event which has to be passed on GTM, I looked at different resources available but could not find the right way.

Any help with how to proceed with this, or resources I can refer to would help.

Answer 1

I think you can try the element visibility trigger.

Here is the setting detail

1. Add a good name about it.

2. Choose the CSS Selector since you have multiple images.

3. Set the right CSS Selector. If you don't know how to set it. You might need to give us the URL of your website and we can provide you the selector.

4. Choose Once Per Element

5. You can decide when the image shows more than x%. Fire the trigger.

---

Since you need the order of the image. You can refer about this

#GTMTIPS: GET POSITION INDEX OF VISIBLE ELEMENT

If you have further question. Feel free to leave comment and I'll update accordingly