How to hide header and footer on just one page - debut theme

Store Design
,
1

I’m using a highly customized version of the debut theme, and I have a landing page that I want to hide the header and footer on. I can see the elements in the developer tools and delete them, but for the life of me I cannot figure out how to stop them from loading when the page is refreshed. I’ve tried messing with the theme.liquid file and the custom.css file, as well as the specific page file.

They show up as a div with shopify-section-header and shopify-section-footer.

I’m not much of a developer, so please be understanding.

2

I feel stupid, but I figured it out. I just had to add the right CSS to the page.

3

Hi @dhendriksen ,

To hide the header and footer on a page create a new page template example “no-header-footer”. Then apply conditional logic on the header file. Edit your header.liquid and add the below code:

{% unless template == 'page.no-header-footer' %}

{% endunless %}

Same for footer.liquid also:

{% unless template == 'page.no-header-footer' %}

{% endunless %}

Assign the template to the page and check the changes.

I hope this helps! If it does, please like it and mark it as a solution!
If you need further assistance, feel free to reach out!

Regards,
Sweans