Trying to add related products to cart page (Debut theme) - partially successful

Highlighted
New Member
4 0 0

I am trying to add related products to my cart page. I did the foll:

1) I put this code in cart.liquid

{% section 'related-products' %}

2) Then I added a new section related-products.liquid and put the foll. code below in it. It sort of worked in that I got an option for related products to show up on my cart page settings, but nothing happens when I enable it. The page got a bit longer as if something was added and is hidden from view. Can anyone PLEASE HELP!

 

An option for related products shows in the menuAn option for related products shows in the menu         I enable it but no related products are visibleI enable it but no related products are visible

 

Here's the code I put in related-products.liquid

{% if section.settings.show_related_products == true %}
<hr>
<div class="product-template__container page-width" itemscope itemtype="http://schema.org/Product" id="ProductSection-{{ section.id }}" data-section-id="{{ section.id }}" data-section-type="product" data-enable-history-state="true">
 
{% comment %}
  Number of related items per row,
  and number of rows.
{% endcomment %}
 
{% assign number_of_related_products_per_row = section.settings.related_grid_num %}
{% assign number_of_rows = section.settings.related_grid_row %}
 
{% comment %}
  Heading.
  Leave blank if you don't need one.
{% endcomment %}
 
{% assign heading = section.settings.related_title %}
 
{% comment %}
  Set either or both to true, if you want
  to limit yourself to items with same vendor, and/or type.
{% endcomment %}
 
{% assign same_vendor = false %}
{% assign same_type = false %}
 
{% comment %}
  Collections to ignore.
  Never pick related items from those.
{% endcomment %}
 
{% assign exclusions = 'frontpage,all' | split: ',' %}
 
{% comment %}
  Looking for a relevant collection.
{% endcomment %}
 
{% if product.metafields.c_f['Related-Products'] %}
  {% assign collection = collections[product.metafields.c_f['Related-Products']] %}
{% endif %}
 
{% assign found_a_collection = false %}
{% if collection and collection.all_products_count > 1 %}
  {% unless exclusions contains collection.handle %}
    {% assign found_a_collection = true %}
  {% endunless %}
{% endif %}
{% unless found_a_collection %}
  {% for c in product.collections %}
    {% unless exclusions contains c.handle or c.all_products_count < 2 %}
      {% assign found_a_collection = true %}
      {% assign collection = c %}
      {% break %}
    {% endunless %}
  {% endfor %}
{% endunless %}
 
{% comment %}
  If we have a relevant collection.
{% endcomment %}
 
{% if found_a_collection %}
 
  {% assign counter = 0 %}
  {% assign break_at = number_of_rows | times: number_of_related_products_per_row %}
  {% assign current_product = product %}
  
  {% case number_of_related_products_per_row %}
    {% when '1' %}
      {% assign grid_item_width = '' %}
  {%- assign max_height = 700 -%}
    {% when '2' %}
      {% assign grid_item_width = 'small--one-half medium-up--one-half' %}
    {%- assign max_height = 530 -%}
    {% when '3' %}
      {% assign grid_item_width = 'small--one-half medium-up--one-third' %}
      {%- assign max_height = 345 -%}
    {% when '4' %}
      {% assign grid_item_width = 'small--one-half medium-up--one-quarter' %}
  {%- assign max_height = 250 -%}
    {% when '5' %}
      {% assign grid_item_width = 'small--one-half medium-up--one-fifth' %}
  {%- assign max_height = 195 -%}
    {% when '6' %}
      {% assign grid_item_width = 'small--one-half medium-up--one-sixth' %}
  {%- assign max_height = 195 -%}
    {% else %}
      {% assign grid_item_width = 'small--one-half medium-up--one-quarter' %}
  {%- assign max_height = 195 -%}
  {% endcase %}
 
 
  {% capture related_items %}
<div class="grid grid--uniform{% if collection.products_count > 0 %} grid--view-items{% endif %}">
 
  {% for product in collection.products %}
  {% unless product.handle == current_product.handle %}
  {% unless same_vendor and current_product.vendor != product.vendor %}
  {% unless same_type and current_product.type != product.type %}
  <div class="grid__item {{ grid_item_width }}">
    {% include 'product-card-grid', max_height: max_height %}
  </div>
  {% assign counter = counter | plus: 1 %}
  {% if counter == break_at %}
  {% break %}
  {% endif %}
  {% endunless %}
  {% endunless %}
  {% endunless %}
  {% endfor %}
</div>
  {% endcapture %}
 
  {% assign related_items = related_items | trim %}
 
  {% unless related_items == blank %}
 
  <aside class="grid">
    <div class="grid__item">
      {% unless heading == blank %}
      <header class="section-header">
        <h2 class="section-header__title">{{ heading }}</h2>
      </header>
      {% endunless %}
      <div class="grid-uniform">
        {{ related_items }}
      </div>
    </div>
  </aside>
 
  {% endunless %}
     
{% endif %}
  
</div>
{% endif %}
 
{% schema %}
{
  "name": "Related products",
  "settings": [
    {
      "type": "checkbox",
      "id": "show_related_products",
      "label": "Show related products",
      "default": false
    },
    {
      "id": "related_title",
      "type": "text",
      "label": "Section title",
      "default": "Other fine products"
    },
    {
      "type": "select",
      "id": "related_grid_num",
      "label": "Products per row (Desktop)",
      "default": "4",
      "options": [
        {
          "value": "2",
          "label": "2"
        },
        {
          "value": "3",
          "label": "3"
        },
        {
          "value": "4",
          "label": "4"
        },
        {
          "value": "5",
          "label": "5"
        }
      ]
    },
    {
      "type": "select",
      "id": "related_grid_row",
      "label": "Number of rows (Desktop)",
      "default": "1",
      "options": [
        {
          "value": "1",
          "label": "1"
        },
        {
          "value": "2",
          "label": "2"
        },
        {
          "value": "3",
          "label": "3"
        }
      ]
    }
  ]
}
{% endschema %}

 

0 Likes
Highlighted
Astronaut
919 81 109

@kay2000 

can you please share your site link?

you are welcome to contact me.
My email - suyash.patankar@gmail.com
0 Likes