Testing Page
{%- capture section_settings -%}
{
"stackable": false,
"layout": "vertical"
}
{%- endcapture -%}
{% schema %}
{
"name": "Collection with image",
"settings": [
{
"type": "collection",
"id": "collection",
"label": "Collection"
},
{
"type": "range",
"id": "products_count",
"label": "Products to show",
"min": 4,
"max": 48,
"step": 4,
"default": 12
},
{
"type": "image_picker",
"id": "image",
"label": "Image",
"info": "1000 x 400px .png with transparency recommended (hidden on mobile)"
},
{
"type": "color",
"id": "background",
"label": "Background",
"default": "#0774d7"
},
{
"type": "color",
"id": "text_color",
"label": "Text",
"default": "#ffffff"
},
{
"type": "text",
"id": "title",
"label": "Heading",
"default": "Featured collection"
},
{
"type": "textarea",
"id": "content",
"label": "Text",
"default": "Tell more about your product, collection..."
},
{
"type": "header",
"content": "Button"
},
{
"type": "color",
"id": "button_background",
"label": "Background",
"default": "#ffffff"
},
{
"type": "color",
"id": "button_text_color",
"label": "Text",
"default": "#0774d7"
},
{
"type": "text",
"id": "button_text",
"label": "Text",
"default": "Learn more"
},
{
"type": "url",
"id": "button_link",
"label": "Link",
"info": "If left empty, collection URL is used."
}
],
"presets": [
{
"category": "Collection",
"name": "Collection with image",
"settings": {}
}
]
}
{% endschema %}
{%- assign collection = collections[section.settings.collection] -%}
{%- if section.settings.title != blank -%}
{{ section.settings.title | escape }}
{%- endif -%} {%- if section.settings.content != blank -%}{{ section.settings.content | escape | newline_to_br }}
{%- endif -%} {%- if section.settings.button_text != blank -%} {{ section.settings.button_text | escape }} {%- endif -%}
{%- assign grid_classes = '1/2--lap 1/3--desk 1/4--wide' -%}
{%- unless collection.empty? -%}
{%- for product in collection.products limit: section.settings.products_count -%}
{%- render 'product-item', product: product, grid_classes: grid_classes -%}
{%- endfor -%}
{%- else -%}
{%- for i in (1..section.settings.products_count) -%}
{%- render 'product-item-placeholder', grid_classes: grid_classes -%}
{%- endfor -%}
{%- endunless -%}