Copy-paste a theme-editor section for headers & navigation - Image tiles linking to collections - the visual nav on almost every successful homepage.
1<div class="gpl-tiles" style="--gpl-cols: {{ section.settings.cols }};">2 {%- for block in section.blocks -%}3 {%- assign c = block.settings.collection -%}4 <a class="gpl-tiles__tile" href="{{ c.url | default: '#' }}" {{ block.shopify_attributes }}>5 {%- if block.settings.image or c.image -%}6 {{ block.settings.image | default: c.image | image_url: width: 500 | image_tag: class: 'gpl-tiles__img', loading: 'lazy' }}7 {%- endif -%}8 <span class="gpl-tiles__label">{{ block.settings.title | default: c.title }}</span>9 </a>10 {%- endfor -%}11</div>12 13{% schema %}14{
Full source is for members
One payment - every snippet, guide and bundle