Sections/Snippets - Page Headers

general-header.liquid

<div class="page-header" style="background-image: url({{ settings.general-header | img_url: 'master' }})">
  {{ settings.general-header | img_url: 'master' | img_tag }}
  <h1>{{ page_title }}</h1>
</div>

page-header.liquid

<div class="page-header {{ block.shopify_attributes }}" style="background-image: url({{ block.settings.image | img_url: 'master' }})">
  {{ block.settings.image | img_url: 'master' | img_tag }}
  <h1>{{ page.title }}</h1>
</div>

page-headers.liquid

{% assign found_match = false %}

{% for block in section.blocks %}
  {% assign title = block.settings.page %}
  {% if page.handle == title %}
  {% assign found_match = true %}
    {% include 'page-header' %}
  {% endif %}
{% endfor %}

{% if found_match == false %}
  {% include 'general-header' %}
{% endif %}

{% schema %}
{
  "name": "Page Headers",
  "settings": [
    {
      "type": "image_picker",
      "id": "general-header",
      "label": "General Header Image"
    }
  ],
  "blocks": [
    {
      "type": "headers",
      "name": "Headers",
      "settings": [
        {
          "type": "page",
          "id": "page",
          "label": "Page"
        },
        {
          "type": "image_picker",
          "id": "image",
          "label": "Header Image"
        }
      ]
    }
  ]
}
{% endschema %}