missing h1 on "show all collections" page

3 0 0

Hi All,

So one of the stores I work with's collection-template.liquid adds the H1 dynamically like so <h1 class="section-header--title section-header--left h1">{{ collection.title }}</h1>. (ignore the class, there's 2 separate H1s that show depending on a rule)

However, we have a mass product page with every brand category on it. The page is set up as per the screenshot below.


Now, the template works a treat when it's a collection page as each collection has a specifiable {{ collection.title }}. However, selecting "All" means we are selecting a page without a {{ collection.title }}.

Any workaround for this?

I was thinking duplicating the collection-template.liquid file and calling it something like all-collection-template.liquid, changing {% section 'collection-list-template' %} to {% section 'all-collection-template.liquid' %} and swapping <h1 class="section-header--title section-header--left h1">{{ collection.title }}</h1> for <h1 class="section-header--title section-header--left h1">My Lovely New H1</h1> for this specific page.

But it seems like a big workaround on a "beginner-friendly" platform like Shopify.



Reply 1 (1)
Shopify Partner
178 26 58

Hi @A1SEOGlasgow

I'm not 100% sure that I understood your issue completely but, if have done so correctly, you can go about it another way. If it's the collections/all collection you're worried about, you can use an if statement inside your current template, in order to keep everything clean and avoid duplicates. You could replace your current h1 tag, with something like the following: 

{% if collection.handle == 'all' %}
<h1 class="section-header--title section-header--left h1">My Lovely New H1</h1>
{% else %}
<h1 class="section-header--title section-header--left h1">{{ collection.title }}</h1>
{% endif %}


If I missed the issue completely, just let me know, and I'll see if I can help. 

Panos Voulgaris
Creative director / Partner @ MALVI
Founder @ function( )