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

Accepted Solutions (2)
oscprofessional
Shopify Partner
14801 2218 2707

This is an accepted solution.

@BB17 ,

.template-collection main#MainContent {
    padding: 0;
}
If helpful then Please Like and Accept Solution. Chat on WhatsApp | Skype : oscprofessionals-87 |
Email: pallavi@oscprofessionals.com | Custom Pricing Wholesale App : Free | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing

View solution in original post

oscprofessional
Shopify Partner
14801 2218 2707

This is an accepted solution.

@BB17 ,

.filters-toolbar__item-child {
    padding-top: 19px;
}
If helpful then Please Like and Accept Solution. Chat on WhatsApp | Skype : oscprofessionals-87 |
Email: pallavi@oscprofessionals.com | Custom Pricing Wholesale App : Free | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing

View solution in original post

Replies 14 (14)
diego_ezfy
Shopify Partner
2859 545 798

@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

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

oscprofessional
Shopify Partner
14801 2218 2707

 

.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. Chat on WhatsApp | Skype : oscprofessionals-87 |
Email: pallavi@oscprofessionals.com | Custom Pricing Wholesale App : Free | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing
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

oscprofessional
Shopify Partner
14801 2218 2707

@BB17 ,

oscprofessional_0-1632460564724.png

don't add css in media.

 

If helpful then Please Like and Accept Solution. Chat on WhatsApp | Skype : oscprofessionals-87 |
Email: pallavi@oscprofessionals.com | Custom Pricing Wholesale App : Free | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing
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

oscprofessional
Shopify Partner
14801 2218 2707

This is an accepted solution.

@BB17 ,

.template-collection main#MainContent {
    padding: 0;
}
If helpful then Please Like and Accept Solution. Chat on WhatsApp | Skype : oscprofessionals-87 |
Email: pallavi@oscprofessionals.com | Custom Pricing Wholesale App : Free | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing
BB17
Excursionist
29 0 6

@oscprofessional 

Thanks. 

But the wording "sort by" and "1 product" in the green boxed has moved up... how to make it middle for all collection list/grid?  for desktop view...

Screenshot 2021-09-24 at 2.41.52 PM.png

oscprofessional
Shopify Partner
14801 2218 2707

@BB17 ,

Issue is solved?

If helpful then Please Like and Accept Solution. Chat on WhatsApp | Skype : oscprofessionals-87 |
Email: pallavi@oscprofessionals.com | Custom Pricing Wholesale App : Free | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing
BB17
Excursionist
29 0 6

@oscprofessional 

But please refer the issue i posted yesterday that is still not solve.. Screenshot 2021-09-25 at 2.38.40 PM.png

oscprofessional
Shopify Partner
14801 2218 2707

This is an accepted solution.

@BB17 ,

.filters-toolbar__item-child {
    padding-top: 19px;
}
If helpful then Please Like and Accept Solution. Chat on WhatsApp | Skype : oscprofessionals-87 |
Email: pallavi@oscprofessionals.com | Custom Pricing Wholesale App : Free | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing
BB17
Excursionist
29 0 6
oscprofessional
Shopify Partner
14801 2218 2707

@BB17 ,

Hi

Share your Store URL !

If helpful then Please Like and Accept Solution. Chat on WhatsApp | Skype : oscprofessionals-87 |
Email: pallavi@oscprofessionals.com | Custom Pricing Wholesale App : Free | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing
Nick
Shopify Staff (Retired)
Shopify Staff (Retired)
4531 434 1012

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