Cacher is the code snippet organizer for pro developers

{% assign products = '' %}
{% assign related_products = false %}

{% for tag in product.tags %}
  {% if tag contains 'related' %}
    {% assign related_products = true %}
	{% assign product_handle = tag | split: '_' %}
	{% assign products_handle = products_handle | append: product_handle.last | append: '_' %}
    {% assign products = products_handle | split: '_' %}
  {% endif %}
{% endfor %}

{% assign products_length = products | size %}

{% case products_length %}
  {% when '2' %}
    {%- assign grid_item_width = 'medium-up--one-half' -%}
  {% when '3' %}
    {%- assign grid_item_width = 'small--one-half medium-up--one-third' -%}
  {% when '4' %}
    {%- assign grid_item_width = 'small--one-half medium-up--one-quarter' -%}
  {% when '5' %}
    {%- assign grid_item_width = 'small--one-half medium-up--one-fifth' -%}
{% endcase %}

{% case products_length %}
  {% when 2 %}
    {%- assign max_height = 530 -%}
    {%- assign grid_item_width = 'medium-up--one-half' -%}
  {% when 3 %}
    {%- assign max_height = 345 -%}
    {%- assign grid_item_width = 'small--one-half medium-up--one-third' -%}
  {% when 4 %}
    {%- assign max_height = 250 -%}
    {%- assign grid_item_width = 'small--one-half medium-up--one-quarter' -%}
  {% when 5 %}
    {%- assign max_height = 195 -%}
    {%- assign grid_item_width = 'small--one-half medium-up--one-fifth' -%}
{% endcase %}

{% if related_products %}
  <div class="page-width">
    <h2 class="related_title">{{ 'products.product.related_products_title' | t }}</h2>
    {% for related_product in products %}
      {% assign item = all_products[related_product] %}
      <div class="grid__item {{ grid_item_width }}">
        {% include 'product-card-grid', max_height: max_height, item: item %}
      </div>
    {% endfor %}
  </div>
{% endif %}