Copy-paste a theme-editor section for headers & navigation - Scrollable chip-style nav - filter links that look native on mobile.
1<nav class="gpl-pills" aria-label="Quick filters">2 {%- assign rows = section.settings.items | newline_to_br | split: '<br />' -%}3 {%- for row in rows -%}4 {%- assign parts = row | strip | split: '|' -%}5 <a class="gpl-pills__pill{% if forloop.first %} is-active{% endif %}" href="{{ parts[1] | strip }}">{{ parts[0] | strip }}</a>6 {%- endfor -%}7</nav>8 9{% schema %}10{11 "name": "Pills nav",12 "settings": [13 { "type": "textarea", "id": "items", "label": "Pills (label|url per line)", "default": "All|/\nNew in|/collections/new\nBestsellers|/collections/bestsellers\nSale|/collect" }14 ],
Full source is for members
One payment - every snippet, guide and bundle
