Woocommerce - show site wide message prominently

Support
#1

Hello,
I have read the articles and topics and haven’t seen this one… yet.
In the woocommerce settings there is a place to check a box to “show site wide message” (SCREENSHOT), after doing so a dialog box opens to enter the text you wish to display. After editing and saving the settings the message does appear at the very bottom of the page in a discrete manner (SCREENSHOT). With other themes this message uses the message colorations and is placed at the top of the page (SCREENSHOT).
Please let me know how to make this message more prominent.
Thank you in advance,
Rob

Store notice below header
#2

Hello There,

Thanks for writing in and the very detailed post information. To resolve your issue, please add the following CSS code in the X > Launch > Theme Options > Global CSS (http://prntscr.com/evui3r) or in the customizer, Appearance > Customize > Custom > Edit GLOBAL CSS

p.woocommerce-store-notice.demo_store {
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99999;
    padding: 20px;
    background-color: blue;
    color: #fff;
    text-align: center;
}

Feel free to change colors to match with your site design.

#3

Thank you! This did in fact add a colored bar to the top of the website, but it did not include the content that I added in the available dialog box for “Store notice text”.
Please advise on how to make the Global CSS add the colored bar inclusive of the store notice text.
Thank you in advance!,
Rob

#4

Hi there Rob,

That’s strange! The code Runel provided should have also moved the text with the box itself, can you link to your site please, we can then tailor the code specifically for your website.

Thanks!

#5

Thanks, Jack… https://ideas-global.org/

Also, we need the “dismiss” and the ‘x’ (to close) message to be inline with the notice and bar.
Thank you!

#6

Hi Rob,

I’ve taken a closer look an this appears to be happening because of an HTML syntax issue. It looks like you might be using a <p> tag inside the content. WooCommerce is already wrapping that in a <p> tag, so you won’t be able to use one inside. You could remove any p tags, or replace them with span. Once this is done, the text should start appearing in the box again. From there we can take another look at the dismiss link.

#7

That worked, thank you!

#8

Glad to hear it’s sorted.

Cheers!