Debut Theme - How to remove header for collection list

Solved
BB17
Excursionist
29 0 6

Hi, i am using debut theme. Wondering how to remove header for collection list? There are 4 collection list... i need to remove header for all 4 of them. Screenshot 2021-09-23 at 3.20.28 PM.pngScreenshot 2021-09-23 at 3.23.46 PM.png

0 Likes

@BB17,

1. In your Shopify Admin go to online store > themes > actions > edit code
2. In your theme.liquid file, find the </body> (press CTRL + F or command + F on Mac)
3. paste this code right above the </body> tag:

<style>

#shopify-section-collection .section-header{
    display: none !important;
}
</style>



Kind regards,
Diego

◦ Slideshow section not looking good or cutting off? Try the Slideshow (PRO) section. No apps required.
◦ Replace apps with copy/paste code snippets. Examples here.
◦ In need of coding help? I'm available for hire! ezfycode@gmail.com
0 Likes

@BB17 ,

Hi

Share your Store URL !

If helpful then please Like and Accept Solution. Free Website Review and advice for sale from Hire us
Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO | Digital Marketing | Site Speed Optimization | Performance Site Audit
For Quick Chat Whats app | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87
0 Likes
Nick
Community Moderator
Community Moderator
4135 401 843

Hi @BB17,

Just to clarify do you mean the heading highlighted here?

23-24-xqgpm-3dm9d

If so, this might be coded into the theme to have a title for this page. Because this is the Debut theme which is a free Shopify developed theme, you can use the 60 minutes free design time from the theme support team and they can see if this is possible and do it for you if you aren't comfortable doing it yourself? You can log in and contact the support team for this here

Nick | Community Moderator @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

0 Likes
BB17
Excursionist
29 0 6

@diego_ezfy 

After adding the code, the header still can be seen.... example from one of the collection list /gridScreenshot 2021-09-23 at 3.20.28 PM.png

0 Likes

 

.collection-hero__image.ratio-container.js.lazyloaded {
    display: none;
}
#shopify-section-collection-template .section-header.text-center {
    display: none;
}

 

@BB17 ,

Add this css at the bottom of
Online Store->Theme->Edit code->Assets->theme.scss.liquid

If helpful then please Like and Accept Solution. Free Website Review and advice for sale from Hire us
Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO | Digital Marketing | Site Speed Optimization | Performance Site Audit
For Quick Chat Whats app | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87
0 Likes
BB17
Excursionist
29 0 6

@oscprofessional 

But for mobile view, the header still can be seen and not removed for all collection list/grid... 

Please help.. Thanks Screenshot 2021-09-24 at 1.10.50 PM.png

0 Likes

@BB17 ,

oscprofessional_0-1632460564724.png

don't add css in media.

 

If helpful then please Like and Accept Solution. Free Website Review and advice for sale from Hire us
Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO | Digital Marketing | Site Speed Optimization | Performance Site Audit
For Quick Chat Whats app | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87
0 Likes
BB17
Excursionist
29 0 6

@oscprofessional 

but how come there is still this part which i think supposed to be the header ? Can this part (green box) be removed totally in desktop and mobile view ? 

Screenshot 2021-09-24 at 1.58.35 PM.png

0 Likes

This is an accepted solution.

@BB17 ,

.template-collection main#MainContent {
    padding: 0;
}
If helpful then please Like and Accept Solution. Free Website Review and advice for sale from Hire us
Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO | Digital Marketing | Site Speed Optimization | Performance Site Audit
For Quick Chat Whats app | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87
0 Likes