Show Action Bar on Mobile Display

ReneeDupuis · September 2020

How do I add CSS to the site so that the Action Bar displays above the header on mobile devices?

Pablo · September 2020

Hi,
Please always attach a link so we can check it out. If the page is offline(localhost) then our help will be limited, you will have to contact us when the page is online. Also please make sure that the page is not under maintenance before you provide us the link.
thanks

ReneeDupuis · September 2020

Here's an example: https://meadowbrookwebdesigns.com/

The action bar shows on the desktop display, but not on mobile.

Pablo · September 2020

Please paste that CSS code into Theme Options > Custom CSS & JS > CSS

#Action_bar{display: block !important;}

thanks

ReneeDupuis · September 2020

OK - that somewhat works (phone, email and social media display) but the slogan is still not displaying. Is there any way to include that?

Pablo · September 2020

Of course, provide to the same location this additional CSS code:

#Action_bar .slogan{display:block !important;}

thanks

ReneeDupuis · September 2020

THANK YOU so very much! AWESOME theme!!!

Webmastertroubles69 · March 14

Hi Guys

I used your altest code an it worked well, so the slogan is shown on mobile. But after I used your code I saw, that on desktop view, it is now on 2 lines. I'd prefer Slogan and Contact Details on 1 line.

Can you help?

Site: https://www.messing-bleifrei.ch/

Cheers

Rob

Phil · March 15

Hi @Webmastertroubles69,

Please use this CSS code instead:

#Action_bar .slogan{display:inline-block !important;}

Best regards

Webmastertroubles69 · March 15

thx this worked well

Show Action Bar on Mobile Display

Comments