Topbar button

Hi there

I want to make the little triangular button that opens the topbar a bit bigger. It’s going to have a Ubermenu in there with a ton of content and I fear it’s a bit measly for people to notice.

I’d also like to change the colour of the topbar background (the one that shows before the little triangle button is pressed) and also stop the text being in capitals.

Actually - is it possible to just put a shortcode in for a menu that just shows (I need two at the top of this site, one for the products and the other for all the background info) without having to click the button?

Will add log in once i post this so you can see behind maintenance screen.

thanks, Gina.

Hello There,

Thanks for writing in! I guess you are referring to the header widget area.

To make it bigger, please add the following CSS code in the X > Launch > Theme Options > Global CSS (http://prntscr.com/evui3r)

.x-btn-widgetbar {
    border-top: 35px solid hsl(302,100%,50%);
    border-left: 35px solid transparent;
    border-right: 35px solid hsl(302,100%,50%);
    border-bottom: 35px solid transparent;
}

.x-btn-widgetbar i {
    font-size: 25px;
    color: #fff;
    top: -25px;
    right: -23px; 
}

To change the background color of the topbar and prevents the text from being in uppercase, you can make use of this code:

.x-topbar {
    background-color: #e5e5e5;
}

.x-topbar .p-info {
    text-transform: none;
}

With regards for the menu shortcode, please give further clarifications as to where you want to put the shortcode and which shortcode because at the moment, there isn’t a menu shortcode available in X.

Hope this helps. Kindly let us know.

1 Like

Hi there, thank you very much. The code is great, I can control the look of that as well and get the look of what is up there a bit more in line with what I want.

I was confused between the widget area and the topbar (it looked to me as if the topbar was a sort of cover of the widget area.)

As it turns out, I found another support post here: https://theme.co/apex/forum/t/how-to-add-a-button-in-topbar/4798/2

and I have successfully put a second UberMenu shortcode in it. Horrible colours at the moment but it works.

Thanks for your help. Always appreciated.

Hey There,

You’re welcome! We are just glad we were able to help you out.
Thanks for letting us know that it has worked for you.

Cheers.

1 Like