Customizing Collection List page that uses link list

New Member
1 0 0

Hey guys, 

 

I created a collections-list based off a menu following this

https://help.shopify.com/en/themes/customization/collections/featuring-collections-using-link-lists

I copied the exact code it told me to.

 

The problem is now it's just a list of one collection per row, all centered. Look:

https://designershopmia.myshopify.com/pages/brands

Password: auchia

 

I want it to be a grid with 6 collections per row. Any idea how to make that happen? I've spent hours looking through the code and can't figure it out.

 

I'm using a purchased theme Eva (from envato store)

If it helps, here is the code from the theme's default collection list page. There you can choose how many collections per row.

<div id="primary" class="content-area">
  {%- include 'page-header' -%}
  <div id="content" class="site-content">
    <article class="page">
      <div class="row">
        <div class="large-12 columns">
          <div class="entry-content">
            {%- case section.settings.columns -%}
              {%- when 6 -%}
                {%- assign collections_per_row = 6 -%}
                {%- assign collections_per_row_xl = 6 -%}
                {%- assign collections_per_row_l = 6 -%}
                {%- assign collections_per_row_m = 3 -%}
              {%- when 5 -%}
                {%- assign collections_per_row = 5 -%}
                {%- assign collections_per_row_xl = 5 -%}
                {%- assign collections_per_row_l = 5 -%}
                {%- assign collections_per_row_m = 3 -%}
              {%- when 4 -%}
                {%- assign collections_per_row = 4 -%}
                {%- assign collections_per_row_xl = 4 -%}
                {%- assign collections_per_row_l = 4 -%}
                {%- assign collections_per_row_m = 3 -%}
              {%- when 3 -%}
                {%- assign collections_per_row = 3 -%}
                {%- assign collections_per_row_xl = 3 -%}
                {%- assign collections_per_row_l = 3 -%}
                {%- assign collections_per_row_m = 2 -%}
              {%- else -%}
                {%- assign collections_per_row = 2 -%}
                {%- assign collections_per_row_xl = 2 -%}
                {%- assign collections_per_row_l = 2 -%}
                {%- assign collections_per_row_m = 2 -%}
            {%- endcase -%}
            {% case section.settings.sort %}
            {% when 'products_high' or 'products_low' %}
            {%- assign list_collections = collections | sort: 'all_products_count' -%}
            {% when 'date' or 'date_reversed' %}
            {%- assign list_collections = collections | sort: 'published_at' -%}
            {% else %}
            {%- assign list_collections = collections -%}
            {% endcase %}
            {% if section.settings.sort == 'products_low' or section.settings.sort == 'date' or section.settings.sort == 'alphabetical' %}
            <div class="row product-category-list {{ section.settings.shop_collections_hover }} small-up-1 medium-up-{{ collections_per_row_m }} large-up-{{ collections_per_row_l }} xlarge-up-{{ collections_per_row_xl }} xxlarge-up-{{ collections_per_row }} columns-{{ collections_per_row }}">
              {%- for my_collection in list_collections -%}
                {%- unless my_collection.handle == 'all' -%}
                  {%- include 'collection-item' -%}
                {%- endunless -%}
              {%- endfor -%}
            </div>
            {% else %}
            <div class="row product-category-list {{ section.settings.shop_collections_hover }} small-up-1 medium-up-{{ collections_per_row_m }} large-up-{{ collections_per_row_l }} xlarge-up-{{ collections_per_row_xl }} xxlarge-up-{{ collections_per_row }} columns-{{ collections_per_row }}">
              {%- for my_collection in list_collections reversed -%}
                {%- unless my_collection.handle == 'all' -%}
                  {%- include 'collection-item' -%}
                {%- endunless -%}
              {%- endfor -%}
            </div>
            {% endif %}
          </div>
        </div>
      </div>
    </article>
  </div>
</div>
0 Likes

Hi,

 

I'll help you as per your requirement. Please share with me your admin login so I'll fix the complete issue as per your need. You can drop me an email at: info@gtechwebindia.com 

 

We are professionals and Shopify Experts

 

Thanks,

Manish

0 Likes