FROM CACHE - en_header

Dawn Theme Hide Title on Page Template

Solved
Megan_Di_Giovan
New Member
3 0 0

I am trying to figure out in the new Dawn theme how to hide a title on an individual page template. 

I want to hide the title "HDL Star Rewards" from this page: https://www.hopedesignltd.com/pages/hdl-star-rewards-1

Thanks for the help. 

Accepted Solutions (2)

Accepted Solutions
ZestardTech
Shopify Expert
3589 592 832

This is an accepted solution.

Hello There,

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > theme.scss.liquid and paste this at the bottom of the file:

section#shopify-section-template--14168045518950__main {
display: none!important;
}

.spaced-section {
margin-top: 0!important;
}
Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: support@zestard.com
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing

View solution in original post

Ninthony
Shopify Partner
2272 342 950

This is an accepted solution.

Alternatively you could go into main-page.liquid in your sections folder and make a case statement with your page handle and assign a variable to be true if you want to hide the page, then use an unless statement around the title:

<link rel="stylesheet" href="{{ 'section-main-page.css' | asset_url }}" media="print" onload="this.media='all'">
<link rel="stylesheet" href="{{ 'component-rte.css' | asset_url }}" media="print" onload="this.media='all'">

<noscript>{{ 'section-main-page.css' | asset_url | stylesheet_tag }}</noscript>
<noscript>{{ 'component-rte.css' | asset_url | stylesheet_tag }}</noscript>

{% assign hide_page = false %}
{% case page.handle %}
  {% when 'hdl-star-rewards-1' %}
  {% assign hide_page = true %}
{% endcase %}


<div class="page-width page-width--narrow">
  <h1 class="main-page-title page-title h0">
    {% unless hide_page %}{{ page.title | escape }}{% endunless %}
  </h1>
  <div class="rte">
    {{ page.content }}
  </div>
</div>

{% schema %}
{
  "name": "t:sections.main-page.name",
  "tag": "section",
  "class": "spaced-section"
}
{% endschema %}


Then if you should need to hide it on any other pages in the future you can add to the case statement. Say you wanted to hide the title on your about-us page:

<link rel="stylesheet" href="{{ 'section-main-page.css' | asset_url }}" media="print" onload="this.media='all'">
<link rel="stylesheet" href="{{ 'component-rte.css' | asset_url }}" media="print" onload="this.media='all'">

<noscript>{{ 'section-main-page.css' | asset_url | stylesheet_tag }}</noscript>
<noscript>{{ 'component-rte.css' | asset_url | stylesheet_tag }}</noscript>

{% assign hide_page = false %}
{% case page.handle %}
  {% when 'hdl-star-rewards-1' %}
    {% assign hide_page = true %}
  {% when 'about-us' %}
    {% assign hide_page = true %}
{% endcase %}

<div class="page-width page-width--narrow">
  <h1 class="main-page-title page-title h0">
    {% unless hide_page %}{{ page.title | escape }}{% endunless %}
  </h1>
  <div class="rte">
    {{ page.content }}
  </div>
</div>

{% schema %}
{
  "name": "t:sections.main-page.name",
  "tag": "section",
  "class": "spaced-section"
}
{% endschema %}



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 😄

View solution in original post

Replies 11 (11)
ZestardTech
Shopify Expert
3589 592 832

This is an accepted solution.

Hello There,

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > theme.scss.liquid and paste this at the bottom of the file:

section#shopify-section-template--14168045518950__main {
display: none!important;
}

.spaced-section {
margin-top: 0!important;
}
Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: support@zestard.com
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing
Ninthony
Shopify Partner
2272 342 950

This is an accepted solution.

Alternatively you could go into main-page.liquid in your sections folder and make a case statement with your page handle and assign a variable to be true if you want to hide the page, then use an unless statement around the title:

<link rel="stylesheet" href="{{ 'section-main-page.css' | asset_url }}" media="print" onload="this.media='all'">
<link rel="stylesheet" href="{{ 'component-rte.css' | asset_url }}" media="print" onload="this.media='all'">

<noscript>{{ 'section-main-page.css' | asset_url | stylesheet_tag }}</noscript>
<noscript>{{ 'component-rte.css' | asset_url | stylesheet_tag }}</noscript>

{% assign hide_page = false %}
{% case page.handle %}
  {% when 'hdl-star-rewards-1' %}
  {% assign hide_page = true %}
{% endcase %}


<div class="page-width page-width--narrow">
  <h1 class="main-page-title page-title h0">
    {% unless hide_page %}{{ page.title | escape }}{% endunless %}
  </h1>
  <div class="rte">
    {{ page.content }}
  </div>
</div>

{% schema %}
{
  "name": "t:sections.main-page.name",
  "tag": "section",
  "class": "spaced-section"
}
{% endschema %}


Then if you should need to hide it on any other pages in the future you can add to the case statement. Say you wanted to hide the title on your about-us page:

<link rel="stylesheet" href="{{ 'section-main-page.css' | asset_url }}" media="print" onload="this.media='all'">
<link rel="stylesheet" href="{{ 'component-rte.css' | asset_url }}" media="print" onload="this.media='all'">

<noscript>{{ 'section-main-page.css' | asset_url | stylesheet_tag }}</noscript>
<noscript>{{ 'component-rte.css' | asset_url | stylesheet_tag }}</noscript>

{% assign hide_page = false %}
{% case page.handle %}
  {% when 'hdl-star-rewards-1' %}
    {% assign hide_page = true %}
  {% when 'about-us' %}
    {% assign hide_page = true %}
{% endcase %}

<div class="page-width page-width--narrow">
  <h1 class="main-page-title page-title h0">
    {% unless hide_page %}{{ page.title | escape }}{% endunless %}
  </h1>
  <div class="rte">
    {{ page.content }}
  </div>
</div>

{% schema %}
{
  "name": "t:sections.main-page.name",
  "tag": "section",
  "class": "spaced-section"
}
{% endschema %}



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 😄
Megan_Di_Giovan
New Member
3 0 0

Thanks! Both solutions work, but I ended up going with the second. 

ItzALifestyle
New Member
2 0 3

i cant find:

Asset > theme.scss.liquid

Can someone help please?

taitery
Tourist
6 0 4

Asset > theme.scss.liquid does not exist in the Dawn theme. What would it be for this theme, specifically?

jaouad12
Excursionist
16 0 11

Hi @ZestardTech 

I could not find (Asset > theme.scss.liquid) where to paste your suggested code to hide the default page title. I have a Theme.liquid file but it did not work out

Here is my website: https://consulting-for-good.myshopify.com/

I would really appreciate your help.

KR,

 

 

Charanl
Tourist
5 0 2

Hi,

I am not able to find 
Find Asset > theme.scss.liquid and paste this at the bottom of the file.

I searched for it in the Code and Assets and could find it.

I would like to remove all page titles from the pages.
Not sure why they are even there?

Thanks for your help.

Charan

 

Charanl
Tourist
5 0 2

HI,

Looks like you did figure out how to remove the page titles. May ask how you did it?

Like you, I am unable to find the theme.scss that he refers to.

Thanks,

Best.

Charan L.

leseltzer
New Member
1 0 0

I'm currently using the dawn theme and i pasted the code at the bottom of the base.css file and it is still showing the page title. Any tips?

MyCartridges
Tourist
4 0 0

For those (like me) who couldn't find the theme.scss.liquid asset, I followed this other post and it worked for me:

 

https://community.shopify.com/c/shopify-design/how-do-i-remove-a-page-title-from-a-new-page-in-the-d... 

MyCartridges
Tourist
4 0 0

I had the same issue, see below a post that I followed that actually works:

 

https://community.shopify.com/c/shopify-design/how-do-i-remove-a-page-title-from-a-new-page-in-the-d...