It's very interesting. But in real case, we can't just add some CSS, because promobar can have different height based on content. We can add css to add some space to body with only simple promobar. So we need show promobar always (without js logic to show-hide it). or ignore this jump
Thanks for pointing that out, you're correct that static height isn't always appropriate on an announcement bar that has varying height from day to day. The ideal solution would be to have the bar present in the original HTML from the server so the height is set from the beginning as you said! Many Shopify store owners aren't technically inclined and won't be comfortable enough to build out the announcement bar themselves in the Liquid code. Most Shopify stores just use a promo bar app which sets the content using JavaScript and this is helpful in those instances.
It's very interesting. But in real case, we can't just add some CSS, because promobar can have different height based on content. We can add css to add some space to body with only simple promobar. So we need show promobar always (without js logic to show-hide it). or ignore this jump
Thanks for pointing that out, you're correct that static height isn't always appropriate on an announcement bar that has varying height from day to day. The ideal solution would be to have the bar present in the original HTML from the server so the height is set from the beginning as you said!
Many Shopify store owners aren't technically inclined and won't be comfortable enough to build out the announcement bar themselves in the Liquid code. Most Shopify stores just use a promo bar app which sets the content using JavaScript and this is helpful in those instances.