metafields on pages with different areas so they will have different collection recommendations

[ihs1]

i have a heating website and i have created pages which talk about different areas where you can use these heaters. therfore each area will have a different collection recommended or sometimes a few collections. i have been told to do this by adding a metafield, which i have created for the pages. however when i go the theme customiser, and select collections list and try to add the dynamic source the metafield does not appear. i am on empire theme. please help

[WalkYourStyle]

Can you please show us an image of the customizer and where you want to dynamically apply the recommended collections ?

[ihs1]

[WalkYourStyle]

The reason the metafield you created is not displayed is that the collection list section cannot dynamically connect to the metafield. Only the collection block can dynamically connect to the metafield, and each metafield can only contain one collection.

[WalkYourStyle]

A solution could be to add a recommended collection list to each page by creating a new page template for each page. Set the number of recommended collections according to the collections metafield associated with that page. Then, connect the template to the page so that the recommended collections can be added dynamically.

Check this as well maybe you'll find something:
 https://community.shopify.com/c/technical-q-a/dynamic-number-of-blocks-based-on-metafield-data/m-p/...

[WalkYourStyle]

Another idea is to set a maximum number of recommended collections for a page, such as 10 in the worst-case scenario. Create 10 metafields, each representing a recommended collection. Connect each collection block to a corresponding recommended collection metafield. For pages that need only 2 recommended collections, fill in 2 metafields and leave the remaining 8 blank. Finally, use Liquid to check if a metafield is blank and, if so, do not display that collection.

[ihs1]

Thank you - i have used the last idea which has worked. however please can you advise how to use custom liquid if a metafield is blank, then it does not display anything

[WalkYourStyle]

Can you please share you website's URL?

[ihs1]

https://790027-6a.myshopify.com/?_ab=0&_fd=0&_sc=1

[WalkYourStyle]

In order to be able to help you with the liquid, I would need you to go to your theme's code, find the 'collection-list.liquid' section in the Sections folder and provide me with an image that contains the liquid code of the 'collection-list.liquid'

[ihs1]

<script
type="application/json"
data-section-id="{{ section.id }}"
data-section-type="dynamic-collection-list">
</script>

<script type="application/pxs-animation-mapping+json">
{
"blocks": [".collection__item"],
"elements": [
".collection__item-info"
]
}
</script>

{% style %}
#shopify-section-{{ section.id }} .collection-list__content {
grid-template-columns: repeat({{ section.settings.thumbnail_columns_desktop }}, minmax(auto, 1fr));
}

@media only screen and (max-width: 860px) {
#shopify-section-{{ section.id }} .collection-list__content {
grid-template-columns: repeat({{ section.settings.thumbnail_columns_mobile }}, minmax(auto, 1fr));
}
}
{% endstyle %}

<section class="collection-list__container">
{% if section.settings.title != blank %}
<h2 class="home-section--title">
{{ section.settings.title | escape }}
</h2>
{% endif %}

{% if section.blocks.size > 0 %}
<ul
class="
home-section--content
collection-list__content
collection--image-crop-{{ section.settings.image-crop }}
{% if section.settings.cta_label == blank %}no-cta{% endif %}
"
data-layout="grid"
>
{% for block in section.blocks %}
{% assign collection = collections[block.settings.collection] %}
{% assign collection_title = collection.title %}
{% assign collection_url = collection.url %}

{% assign featured_image = false %}
{% assign featured_image_alt = '' %}

{% if block.settings.image %}
{% assign featured_image = block.settings.image %}
{% assign featured_image_alt = block.settings.image.alt | escape %}
{% endif %}

{%
render 'collection-list-item',
block: block,
collection: collection,
collection_image: featured_image,
collection_image_alt: featured_image_alt
%}
{% endfor %}
</ul>

{% if section.settings.cta_label != blank %}
<a
class="
button-{{ section.settings.cta_button_style }}
collection-list__button
"
{% if section.settings.cta_link != blank %}href="{{ section.settings.cta_link }}"{% endif %}
>
{{ section.settings.cta_label | escape }}
</a>
{% endif %}
{% endif %}
</section>

{% schema %}
{
"name": "t:sections.collection_list.name",
"class": "collection-list--section",
"max_blocks": 20,
"settings": [
{
"type": "text",
"id": "title",
"label": "t:sections.collection_list.title.label",
"default": "Collection list"
},
{
"type": "range",
"id": "thumbnail_columns_desktop",
"label": "t:sections.collection_list.thumbnail_columns_desktop.label",
"min": 3,
"max": 6,
"step": 1,
"default": 5
},
{
"type": "range",
"id": "thumbnail_columns_mobile",
"label": "t:sections.collection_list.thumbnail_columns_mobile.label",
"min": 1,
"max": 3,
"step": 1,
"default": 2
},
{
"type": "select",
"id": "image-crop",
"label": "t:sections.collection_list.image-crop.label",
"info": "t:sections.collection_list.image-crop.info",
"options": [
{
"value": "original",
"label": "t:sections.collection_list.image-crop.option_1"
},
{
"value": "circle",
"label": "t:sections.collection_list.image-crop.option_2"
},
{
"value": "round",
"label": "t:sections.collection_list.image-crop.option_3"
}
]
},
{
"type": "header",
"content": "t:sections.collection_list.header_1.content"
},
{
"type": "text",
"id": "cta_label",
"label": "t:sections.collection_list.cta_label.label",
"default": "View All"
},
{
"type": "url",
"id": "cta_link",
"label": "t:sections.collection_list.cta_link.label"
},
{
"id": "cta_button_style",
"type": "select",
"label": "t:sections.collection_list.cta_button_style.label",
"options": [
{
"value": "primary",
"label": "t:sections.collection_list.cta_button_style.option_1"
},
{
"value": "secondary",
"label": "t:sections.collection_list.cta_button_style.option_2"
}
],
"default": "primary"
}
],
"blocks": [
{
"type": "collection",
"name": "t:sections.collection_list.blocks.collection.name",
"settings": [
{
"id": "collection",
"type": "collection",
"label": "t:sections.collection_list.blocks.collection.collection.label"
},
{
"id": "image",
"type": "image_picker",
"label": "t:sections.collection_list.blocks.collection.image.label"
},
{
"id": "title",
"type": "text",
"label": "t:sections.collection_list.blocks.collection.title.label"
}
]
}
],
"presets": [
{
"name": "t:sections.collection_list.presets.collection_list.name",
"category": "t:sections.collection_list.presets.collection_list.category",
"blocks": [
{
"type": "collection"
},
{
"type": "collection"
},
{
"type": "collection"
},
{
"type": "collection"
},
{
"type": "collection"
}
]
}
],
"disabled_on": {
"groups": ["*"]
}
}

{% endschema %}

[WalkYourStyle]

Modify the for loop and and surround it's content with an if statement like this

{% for block in section.blocks %}
  {% assign collection = collections[block.settings.collection] %}
  {% if collection %}
   {% assign collection_title = collection.title %}
   {% assign collection_url = collection.url %}

   {% assign featured_image = false %}
   {% assign featured_image_alt = '' %}

   {% if block.settings.image %}
     {% assign featured_image = block.settings.image %}
     {% assign featured_image_alt = block.settings.image.alt | escape %}
   {% endif %}

   {%
   render 'collection-list-item',
   block: block,
   collection: collection,
   collection_image: featured_image,
   collection_image_alt: featured_image_alt
   %}
  {% endif %}
{% endfor %}

[ihs1]

HI - unfortunately this isnt working. it still shows empty collections 

[WalkYourStyle · Accepted solution]

Try this

{% for block in section.blocks %}
  {% assign collection = collections[block.settings.collection] %}
  {% if collection != blank %}
   {% assign collection_title = collection.title %}
   {% assign collection_url = collection.url %}

   {% assign featured_image = false %}
   {% assign featured_image_alt = '' %}

   {% if block.settings.image %}
     {% assign featured_image = block.settings.image %}
     {% assign featured_image_alt = block.settings.image.alt | escape %}
   {% endif %}

   {%
   render 'collection-list-item',
   block: block,
   collection: collection,
   collection_image: featured_image,
   collection_image_alt: featured_image_alt
   %}
  {% endif %}
{% endfor %}

[ihs1]

Wow thank you so much for your help on this one