What's your biggest current challenge? Have your say in Community Polls along the right column.

Studio Theme - Need help hiding collections from list using True/False metafield

Solved

Studio Theme - Need help hiding collections from list using True/False metafield

cuttlepods
Visitor
3 0 1

I'm looking for advice on how to hide multiple collections from the All Collections List, using a True/False metafield at the collection level.

 

I'm hoping there is a way to utilize the metafield so that when it is FALSE, the collection is not hidden; but can only be accessed through a URL link if set to TRUE (metafield key is custom.hide_collection_from_storefront ).

Accepted Solution (1)

WalkYourStyle
Trailblazer
450 54 70

This is an accepted solution.

Instructions

1. Go to 'Online Store' -> Themes 

2. From your Active Theme -> Click on the 3 dots (...) -> Edit Code

3. In the Sections Folder locate the file called 'main-list-collections.liquid' or something similar

4. Find the below for loop

{%- for collection in collections -%}
  <li
    class="collection-list__item grid__item{% if settings.animations_reveal_on_scroll %} scroll-trigger animate--slide-in{% endif %}"
    {% if settings.animations_reveal_on_scroll %}
      data-cascade
      style="--animation-order: {{ forloop.index }};"
    {% endif %}
  >
    {% render 'card-collection',
      card_collection: collection,
      media_aspect_ratio: section.settings.image_ratio,
      columns: 3
    %}
  </li>
{%- endfor -%}

5. Surround everything inside the for loop with this:

{%- for collection in collections -%}
  {% if collection.metafields.custom.hide_collection_from_storefront.value == false %}
  <li
    class="collection-list__item grid__item{% if settings.animations_reveal_on_scroll %} scroll-trigger animate--slide-in{% endif %}"
    {% if settings.animations_reveal_on_scroll %}
      data-cascade
      style="--animation-order: {{ forloop.index }};"
    {% endif %}
  >
    {% render 'card-collection',
      card_collection: collection,
      media_aspect_ratio: section.settings.image_ratio,
      columns: 3
    %}
  </li>
{% endif %}
{%- endfor -%}

Hope this helps

View solution in original post

Replies 2 (2)

WalkYourStyle
Trailblazer
450 54 70

This is an accepted solution.

Instructions

1. Go to 'Online Store' -> Themes 

2. From your Active Theme -> Click on the 3 dots (...) -> Edit Code

3. In the Sections Folder locate the file called 'main-list-collections.liquid' or something similar

4. Find the below for loop

{%- for collection in collections -%}
  <li
    class="collection-list__item grid__item{% if settings.animations_reveal_on_scroll %} scroll-trigger animate--slide-in{% endif %}"
    {% if settings.animations_reveal_on_scroll %}
      data-cascade
      style="--animation-order: {{ forloop.index }};"
    {% endif %}
  >
    {% render 'card-collection',
      card_collection: collection,
      media_aspect_ratio: section.settings.image_ratio,
      columns: 3
    %}
  </li>
{%- endfor -%}

5. Surround everything inside the for loop with this:

{%- for collection in collections -%}
  {% if collection.metafields.custom.hide_collection_from_storefront.value == false %}
  <li
    class="collection-list__item grid__item{% if settings.animations_reveal_on_scroll %} scroll-trigger animate--slide-in{% endif %}"
    {% if settings.animations_reveal_on_scroll %}
      data-cascade
      style="--animation-order: {{ forloop.index }};"
    {% endif %}
  >
    {% render 'card-collection',
      card_collection: collection,
      media_aspect_ratio: section.settings.image_ratio,
      columns: 3
    %}
  </li>
{% endif %}
{%- endfor -%}

Hope this helps

cuttlepods
Visitor
3 0 1

Oh my gosh thank you so much!! I've been trying to figure this out ALL day. What you suggested worked immediately and your explanation was basically foolproof.