Docs

[jrslyrics]

Can’t figure out how to add a button to the header. I have searched and tried a bunch of css but nothing has worked so far.

[Friech]

Hi There,

Thanks for writing in! Are you referring to the Topbar? If so, add this on your topbar content.

<a class="x-btn x-btn-flat x-btn-rounded x-btn-regular" href="#example">Round Button</a>

If this does not work, please clarify where in the header you want to position this button.

Cheers!

[jrslyrics]

I have the topbar disabled for this implementation. I was able to add a button like appearance to the navbar menu by using this code that I found by searching the forum:
`.x-navbar .x-nav > li:last-child a {
border: 2px solid #ccc;
border-radius: 2px;
box-shadow: none !important;
margin-left: 1px;
margin-top: 26px;
max-height: 34px;
padding-left: 20px;
padding-right: 20px;
padding-top: 8px;
}`

Since I want the menu items Left aligned to the logo, How do I get the last child to be right aligned to the header container or add seperate button altogether.

[Rupok]

Hi there,

Let’s provide your URL so that we can try to tailor some code for you. If it’s not possible, we’ll suggest you another approach.

Cheers!

[jrslyrics]

This reply has been marked as private.

[Nabeel A]

Hi again,

Please add the following code in your Customizer via Appearance > Customize > Custom > Edit Global CSS:

.x-nav-wrap.desktop {
    width: 75% !important;
}
.masthead-inline .desktop .x-nav {
    width: 100% !important;
}
li#menu-item-37 {
    float: right !important;
}

Let us know how this goes!

[jrslyrics]

Worked perfectly! Thanks

[Joao]

Glad to hear it,

Joao

[Author]

Posts