All things Shopify and commerce
Hi there! I'm making a landing page for my site and want to remove the header and footer on just this page.
Solved! Go to the solution
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.
Hey @vcockerham2002
Can you share the link to this page you want the header and footer to be removed?
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.
worked perfect! Thank you!
Discover how to increase customer engagement on your store with articles from Shopify A...
By Jacqui Apr 23, 2025Hey Community 👋 Did you know that March 15th is National Everything You Think Is W...
By JasonH Apr 1, 2025Discover how to increase the efficiency of commerce operations with Shopify Academy's l...
By Jacqui Mar 26, 2025