Button in NavBar

Support
#1

Hello

I have been trying to add a CTA button to the top right of my nav bar. You will see I have made some progress, but for some reason it has that arrow pointing down and needs to some styling.

I want it to have a blue background to match the site with white text and be rather large and attention grabbing. What should I do?

commonpeople.site

Thanks

#2

Hi There,

I could be done by the custom CSS.

You don’t have to add the button html to the menu label, just add the text.

Then we will provide the CSS code for you.

Regards!

#3

Thanks. Could you provide the CSS? I will make the changes to remove the html

#4

Hi There,

Please try adding the following CSS under Customizer > Custom > Global CSS:

li#menu-item-1136 a {
    padding-top: 8px;
    box-shadow: none;
}
li#menu-item-1136 a span {
    background-color: #2fd262;
    padding: 15px;
    border-radius: 4px;
    color: #fff;
}
li#menu-item-1136 a:hover span {
    background-color: #3c6147;
}

Let us know how it goes!

#5

This works great! What is the color hex code to match the blue that I have? i tried what I thought it was and it made it another shade of green

#6

Hi there,

You can choose your preferred color shade from here https://www.w3schools.com/colors/colors_picker.asp

Hope that helps.

Thanks,

#7

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.