hide all of the page title except product series

Solved
sin034
New Member
21 0 0

Hi, I have a problem about page title001.jpg

I think it's too big even thought I made it as small as I can

So I find a way to hide it

By this answer https://community.shopify.com/c/Shopify-Design/Hide-the-page-title/m-p/533698

I use this code and hide all of the page title

 

.section-header{
 display: none;
}

002.jpg

 

so I can just type "the title" in all other pages

003.jpg

But in product series page , I still need a title. And there is a blank space , looks so weird.

 

Can someone help me solved this problem?

Can I hide all the page title except product series page

Or I can find a way to font-size the page title, make it smaller than 20 pixel?

 

my theme is Debut , thanks~

 

0 Likes
Ninthony
Shopify Partner
1973 296 782

Is this a page? Or is it a collection?

 

Take the code that you used to hide the title out of theme.scss.liquid, and instead put it in the top of page.liquid if it is a "page" or in collection.liquid if it is a "collection page"  with style tags and wrap it in an unless statement:

<style>
// this is assuming that the name of your "page" is Product Series
//if it is a collection page, substitute page.handle with collection.handle {% unless page.handle == 'product-series' %} .section-header{ display: none; } {% endunless %} </style>
If my solution helped you, please like it and accept it as the solution!
If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish :D
0 Likes
sin034
New Member
21 0 0

Really thank you!Yes , what I mean is "collections" page

but when I put the code in collection.liquid

.section-header{
 display: none;
}
{% comment %}
  The contents of the collection.liquid template can be found in /sections/collection-template.liquid
{% endcomment %}

{% section 'collection-template' %}
<style>
{% unless collection.handle == 'product-series' %}
.section-header{
 display: none;
}
{% endunless %}
</style>

it became like this

 

004.jpg

did I do something wrong? I check other pages are still ok (title be hiden)

0 Likes
Ninthony
Shopify Partner
1973 296 782

You have the style in there twice, once outside your style tags so it's showing up on your page, remove the top one:

 

.section-header{  // <-------- Get rid of this
 display: none;
}
{% comment %}
  The contents of the collection.liquid template can be found in /sections/collection-template.liquid
{% endcomment %}

{% section 'collection-template' %}
<style>
{% unless collection.handle == 'product-series' %}
.section-header{
 display: none;
}
{% endunless %}
</style>
If my solution helped you, please like it and accept it as the solution!
If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish :D
0 Likes
Ninthony
Shopify Partner
1973 296 782

Oh I also see your title is still hidden, did you remove it out of theme.scss.liquid? 

If my solution helped you, please like it and accept it as the solution!
If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish :D
0 Likes
sin034
New Member
21 0 0

thank you

 

when I change my code in "collection.liquid" like this

{% comment %}
  The contents of the collection.liquid template can be found in /sections/collection-template.liquid
{% endcomment %}

{% section 'collection-template' %}
<style>
{% unless collection.handle == 'product-series' %}
.section-header{
 display: none;
}
{% endunless %}

the title of my "collection" page is still hiden 

005.jpg

and I sure I remove the code in "theme.scss.liquid" , is something wrong here? 

0 Likes
Ninthony
Shopify Partner
1973 296 782

Can you post a link to your store and password if it's password protected so I can check?

 

If my solution helped you, please like it and accept it as the solution!
If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish :D
0 Likes
sin034
New Member
21 0 0

https://obeiobei.myshopify.com/

 

this is our page , really thank you!

0 Likes
Ninthony
Shopify Partner
1973 296 782

This is an accepted solution.

I see what's going on here. You're trying to hide the titles on "pages" but you want them to show on "collections". Remove the code that you have placed in collection.liquid.  And place the same code in page.liquid without any "unless" condition:

 

<style>
.section-header{
 display: none;
}
</style>

To reiterate, remove the old code I had you place in collection.liquid, and place the above code at the top of page.liquid.

If my solution helped you, please like it and accept it as the solution!
If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish :D
0 Likes
sin034
New Member
21 0 0

thank you so much!

I truly appreciate your timely help.

it's finally done

 

0 Likes