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

vcockerham2002 · ‎02-20-2024

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

ThePrimeWeb · ‎02-20-2024

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.

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

ThePrimeWeb · ‎02-20-2024

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!

vcockerham2002 · ‎02-20-2024

Its actually 2 landing pages:

https://appleblossomgiftbaskets.com/pages/landing-page-real-estate?_pos=1&_psq=landing&_ss=e&_v=1.0#...

and

https://appleblossomgiftbaskets.com/pages/landing-page-corporate-gifts?_pos=2&_psq=landing&_ss=e&_v=...

ThePrimeWeb · ‎02-20-2024

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.

Was I helpful?