A user is attempting to hide the header, announcement bar, and footer on specific product pages using Liquid’s unless command. While the elements successfully hide, a large white space appears above the content.
Proposed Solutions:
Tag-based approach: Use conditional logic checking for specific product tags (e.g., {% if product.tags contains 'exampleTag' %}) to selectively hide elements
Product ID targeting: Edit the product template file and add CSS targeting specific product IDs (e.g., {% if product.id == 'your-product-id' %})
Reference resource: A community link was shared pointing to a previous discussion about removing headers and footers from specific product pages
The white space issue likely stems from CSS styling or container elements that remain even when header/footer content is hidden. The solutions focus on proper conditional rendering rather than just hiding elements, which should eliminate the spacing problem.
Hey, I tried to use a unless command to hide the header, announcment bar and footer. It worked but above the content is a huge white space. What did I wrong and how can I fix it so that the content just fills the blank space?
I used this command
{% unless template == ‘product.DAS TEMPLATE WAS ICH VERWENDE’ %}
{% endunless %}
The first content is a rich text.
Use code for that product tag
{% if product.tags contains 'tagExample' %}
{% endif %}
Hello There,
{% if product.id == 'your-product-id' %}
{% endif %}
Hello @Spanier865
Please refer to this Link: it will be helpful to you -