Solved

How to remove header and footer on a single page, dawn theme

vcockerham2002
Tourist
26 0 1

Hi there! I'm making a landing page for my site and want to remove the header and footer on just this page.  

Accepted Solution (1)
ThePrimeWeb
Shopify Partner
2114 605 470

This is an accepted solution.

Hey @vcockerham2002,

 

Go to your theme's "Edit Code" Option, then in the search bar type "theme.liquid"
Below the tag "<head>" tag paste the following. Screenshot attached for reference.

<style>
body:has(#shopify-section-template--22085400625472__image_banner_W6FMBP) .section-header,
body:has(#shopify-section-template--22085400625472__image_banner_W6FMBP) footer,
body:has(#shopify-section-template--22107004698944__image_banner_cmCx6f) .section-header,
body:has(#shopify-section-template--22107004698944__image_banner_cmCx6f) footer {
    display: none !important;
}
</style>

 

Screenshot is for reference only, the correct code to paste is the one shown above.

ThePrimeWeb_0-1708442829441.jpeg

 

Was I helpful?

Buy me a coffee

🙂

Need help with your store? contact@theprimeweb.com or check out the website
Check out our interview with Shopify!

View solution in original post

Replies 4 (4)

ThePrimeWeb
Shopify Partner
2114 605 470

Hey @vcockerham2002

 

Can you share the link to this page you want the header and footer to be removed?

Was I helpful?

Buy me a coffee

🙂

Need help with your store? contact@theprimeweb.com or check out the website
Check out our interview with Shopify!
ThePrimeWeb
Shopify Partner
2114 605 470

This is an accepted solution.

Hey @vcockerham2002,

 

Go to your theme's "Edit Code" Option, then in the search bar type "theme.liquid"
Below the tag "<head>" tag paste the following. Screenshot attached for reference.

<style>
body:has(#shopify-section-template--22085400625472__image_banner_W6FMBP) .section-header,
body:has(#shopify-section-template--22085400625472__image_banner_W6FMBP) footer,
body:has(#shopify-section-template--22107004698944__image_banner_cmCx6f) .section-header,
body:has(#shopify-section-template--22107004698944__image_banner_cmCx6f) footer {
    display: none !important;
}
</style>

 

Screenshot is for reference only, the correct code to paste is the one shown above.

ThePrimeWeb_0-1708442829441.jpeg

 

Was I helpful?

Buy me a coffee

🙂

Need help with your store? contact@theprimeweb.com or check out the website
Check out our interview with Shopify!
vcockerham2002
Tourist
26 0 1

worked perfect! Thank you!