Related products based on grouping tags limit memory. Use instead collection with certain handle tag

Solved
Highlighted
Shopify Partner
35 4 10
I end up to this custom and working code: 
{% comment %}
 Get dynamic tag from product and create static collection handle 
{% endcomment %}
    {% for tag in product.tags %}
        {% if tag contains 'IDSeries_' %}
            {% assign ser_tag = tag %}
<li>
<a href="/collections/all/{{ ser_tag | handleize }}"> <h2>{{ ser_tag | remove: "IDSeries_" | prepend: "Go to products with Serie ID number:" }}</h2> </a> </li> {% endif %} {% endfor %}

{% comment %}
Return products by using the extracted tag
{% endcomment %}
{% for product in collections.all.products %} {% if product.tags contains ser_tag %} {{ product.title }}   {% endif %} {% endfor %}
This above it does work. But it's not the solution!
because limited memory, it works only for the first bunch of products and not for all.
 
  • By considering I have twenty five thousands products all with an incremental "IDSeries_'INT'"
  • My goal is: to show products with same specific "IDSeries_'INT'". 
  • Since when this already happens at collection tag url like this `<a href="/collections/all/{{ ser_tag | handleize }}">`
  • I was wondering if I can return products (into a section products) that are already filtered at the collection handle tag url layer.

So at Themes/Debut/Sections/product-template.liquid

I am trying the following with no luck:

{% assign collection_handle = ser_tag %}
    {% for product in collections.all[collection_handle].products %}
        {{ product.title }}
{% endfor %}

Question:

Any clue on how to achieve a consistent result for such a big stock of products?

 

 

Extra question:

  • For a store with 30k products each with five tags (so 150k tags in total).
  • Does tags have any limitation?

 

I also created a Stackoverflow question https://stackoverflow.com/q/62125144/4740661

1 Like
Highlighted
Shopify Partner
35 4 10

Consider my goal is to return related products section in a store with 30k product_ids related to each other with 5k series_ids.

To achieve this, I attached tags to products automatically by using Admin API,

to better understand the scope with this related issue, let me explain with this `fruits` example below:
imagine you have 30k different fruits, with common series_ids:

apple_id_1 => series_id_1,
apple_id_2 => series_id_1,
...
orange_id_1 => series_id_2,
orange_id_2 => series_id_2,
...

So when you are at the product page `apple_id_1`, you also would like to display apples with the same `series_id` as related products.

As you know Shopify does limit tags functionalities and in a store with 30k product_ids related to each other with 5k series_ids I am approaching in different ways with no luck

 

- I thought about collections but then having about 5k collections would be unmanageable in the long run.

- I thought about metafields but those are related only to current products not for all, right? So it is not a solution.

Any idea on how to solve it?

0 Likes
Highlighted
Shopify Partner
35 4 10

This code above does produce a correct result like here:
https://osculati.myshopify.com/products/osculati-0123001-ean-8033137066030-adattatore-cima-catena-10...

 

Then with older products like this, it is not showing anything. Why this behaviour?
https://osculati.myshopify.com/products/osculati-0120803-ean-8033137065941-master-mooring-20-2300-kg

 

Scroll the page to "PRODOTTI DELLA SERIE `INT` CORRELATI"

0 Likes
Highlighted
Shopify Partner
2294 117 353

UX - Related products - don't force excessive amounts of items onto customer devices anyway until they request it.

If it's insisted be sure tests provie it's okay, see https://github.com/Shopify/shopify-theme-inspector

 

https://shopify.github.io/liquid-code-examples/example/recommended-products-by-tag

https://shopify.github.io/liquid-code-examples/example/product-recommendations

 https://shopify.dev/tutorials/develop-theme-recommended-products-using-liquid

 

If the series is static and unlikely to change and you have to have lots of items just premake that list of related items and just stuff it into a metafield namespaced to that "tag".

metafields can hold json_string's

 

Alot of the time getting around pagination limits means just going through pagination with an ajax solution on the frontend.

There is a reason why most related product apps or customizations just use ajax.

https://shopify.dev/docs/themes/liquid/reference/objects/paginate

https://shopify.dev/tutorials/customize-theme-filter-collections-with-product-tags

https://shopify.dev/docs/themes/liquid/reference/objects/current-tags

(1,000 tag return limit) https://shopify.dev/docs/themes/liquid/reference/objects/collection#collection-all_tags

 

Or just stow the related ID's into a tag on the product, keeping in mind you need to hide such tags from customers.

 

Generally for 'related products' you should have some other logic constraint that prevents having to loop over thousands of products.

Such as only working in the same collection, a set of collections, or defined product types or vendors.

 

    {% for product in collections.all[collection_handle].products %}

Should just be  {% for product in collections.[collection_handle].products %}

Still that would be for a literal existing collection not a tag filter.

For large inventories means lots and lots of automated tag based collections which typically need to be hidden from users but still be available in liquid, and have some SEO work on them.

AFAIK you cannot filter collection with a tag inside liquid but you can get the info from a collection url with a tag filter /shrug

 

As for why your getting different output for older products if it's not a cache issue it's either a code or data issue.

 

Problem Solved? ✔️Accept and ? Like the solution so you can help others.
Buy me a coffee ☕ paypal.me/paulnewton or donate to eff.org
Confused? Busy? Buy a custom solution paull.newton+shopifyforum@gmail.com
0 Likes
Highlighted
Shopify Partner
35 4 10

This is an accepted solution.

Solved!

At the end of the day to display tag search results in to a Shopify section I used fetch() javascript and the script looks like this:

<script>  
  {% for tag in product.tags %}
  {% if tag contains 'IDSeries_' %}
  {% assign ser_tag = tag %}
  {% endif %}
  {% endfor %}
  const url = '/search?view=serie_list&q={{ ser_tag }}';  
  fetch(url)
  .then(response => response.text( 
  ))
  .then(data => {
    $('#serie_list_id').html(data);
});
</script>

As the magic @drip said on Stackoverflow (see link on comment above) I also created a separate search template with {% layout none %} at the top and some other style

0 Likes
Highlighted
Shopify Partner
2294 117 353

Optimizing tag Logic - If your dealing with a lot of tags or many tag loops on products there may be a gain by first checking for string existence in product.tags(or assigned to a string)  before executing a loop on each tag.

 

This is on my list of perf optimizations to validate as true with the new theme-inspector tooling but I also want to see other anecdotes.

https://github.com/Shopify/shopify-theme-inspector/

Gains here might only be with cases where tags have already been assigned to a string, or with large amounts of tags, many tags conditions, multiple tag loops,etc.

 

 

Problem Solved? ✔️Accept and ? Like the solution so you can help others.
Buy me a coffee ☕ paypal.me/paulnewton or donate to eff.org
Confused? Busy? Buy a custom solution paull.newton+shopifyforum@gmail.com
0 Likes
Highlighted
New Member
28 0 0

Hello bro, please I would greatly appreciate your help in editing my header, 1st) I want to change my menu on desktop to hamburger menu 2nd) I would like the hamburger menu to align with the cart icon beneath the logo on all devices. Any help from you would be greatly appreciated, Thank you very much

PS. My store URL is - tradatheaterequip.com

0 Likes