Hi, I have the following code installed in theme.liquid to hide my announcement bar on two of my pages,
{% if page.handle == 'germs-on-toothbrushes' %}
{% endif %}
{% if page.handle == 'toothbrush-sanitizer-effectiveness' %}
however, I have now noticed that there is a massive blank space on top of my header:
How can I fix this space? Website: uvteeth.com. Thank you so much in advance.
Hi Seth,
The reason there’s still a gap at the top one the pages where the announcement bar is hidden is because the CSS rules that push the header down to accommodate for the announcement bar are still in place.
I’ve also simplified your logic to make the code easier to maintain.
{% if page.handle == 'germs-on-toothbrushes' or page.handle == 'toothbrush-sanitizer-effectiveness' %}
{% endif %}
Hope this helps!
Jesse
It worked perfectly, thank you so much for the help! On another note, how could I reduce the space under my header? This is mainly just a problem for those two pages.
You could remove the main page padding which is probably off because you’ve removed the announcement bar.
{% if page.handle == 'germs-on-toothbrushes' or page.handle == 'toothbrush-sanitizer-effectiveness' %}
{% endif %}
Worked perfectly,
thank you!