How to Improve Collection Page Speed on GTM Suite

❗️
Data Layer 1.0. has been depreciated
Please follow our upgrade guide to update to our latest version.

Some custom catalog implementations can see site speed issues - see how to put a fix in

We've had reports of some themes that see a slower than normal time to first byte on collection pages after installing GTM Suite app.

Generally, this is due to a conflict of the way our dataLayer builds out your entire collection/product object variables. For example - if you have an infinite scroll we will load every single product.

We have two options for this:

Modifying part of collection liquid logic to force limit of products
Commenting out completely

Option 1: Modify Liquid Logic

In your theme go to the elevar-body-end.liquid snippet and go to ~ row 314 to find if template .name == "collection"

Then replace this block of code circled below:

With this:

var visibleProducts = [];

var productLimit = 36;

Array.prototype.slice.call(document.querySelectorAll('a[href*="/products/"]')).slice(0, productLimit).forEach(function(item) {

Which should then look like this:

You can change the 36 in the code to anything you'd like - this is the number of products returned.

Once done then click save. You should then be good to go.

Option 2: Comment Out

If you'd prefer to comment out completely then do this:

Include here:

Then include here:

Then save.

If you have any additional issues or questions please let us know!

📘
Worried You’re Making Decisions on Data You Can’t Trust?
Check out our blog and discover Shopify Optimization & Analytics Tips from Elevar's data experts.