Enters Viewport with Pagination

[tryingM]

I'm implementing the enters viewport (impressions) event type on a listings page. The page has 20 listings and is working as designed on the first page. Our site can have over 20 pages and each page can have 20 listings. The problem arises when moving to page 2 of the listings. None of the listings are triggered anymore. Visitors get to page two by clicking on a pagination on the bottom of the page.

It's as if the listings on page 2 (and 3.4.5.etc.) has already triggered. I know the enters viewport function will not allow an impression to happen twice on a single page and I get the feeling that is what it is doing.

Has anyone experienced this before and did you develop a solution?

Tyring

[jantzen_b]

It sounds like your website might be using a single page app framework. As you pointed out, the enters viewport fiction will not allow and impression to happen twice on a single page.

Do you know if the page reloads when the user moves to the next page?

[tryingM]

Hi Jantzen,

The page does not reload a new page. It is using the react framework and yes it is a single page app. Is there a way besides using direct call I can design a solution using only DTM and some good javascript?

trying

[jantzen_b]

Unfortunately, there isn't a built in event that would work for this use case. As you stated, you'd need to use direct call rules or write a custom event handler that could trigger an event based rule.

We can definitely leave this thread open to see if anyone else in the community has come up with a solution though.

[tryingM · Accepted solution]

Okay, thanks for the reply. Because I don't have access to the production code I can't do direct call rules. Sounds like I will have to write a custom event handle that will trigger the enters viewport event. Thank you for leaving the thread open. I will post my solution if I get it working for other in the future.

Tying

[jantzen_b]

Sounds great! I look forward to hearing the solution.