Docs

[borinqen]

Hi! I would like to add a button to the topbar content that is linked to a new page that I am going to add. I would like the button to be the same color as the buttons on the site. How can I go about this?

Tks.

[borinqen]

This reply has been marked as private.

[Joao]

Hi There,

Please add the follwing code to your topbar content

<a href="http://pcnetworked.com/" class="x-btn">Button</a>

Hope it helps

Joao

[borinqen]

Thank you!

[borinqen]

How can I change the color of the font of the color and move it further away from the other content in the top bar (it’s way too close , almost on top of the other words.) Tks.

[borinqen]

I also need a smaller button.

[Rahul]

Hey There,

Thanks for writing in!

Regretfully, at this time I am not entirely certain what it is you’re trying to do.
If you wouldn’t mind providing us with a little more clarification on what it is you’re wanting to do. We’ll be happy to provide you with a response once we have a better understanding of the situation.

Thanks for understanding!

[borinqen]

Joao sent me the link above. I just need to make button smaller and to create some space between the button and the rest of the content as well as the change the font of the words in the button. That is all.

https://www.screencast.com/t/ojj4n5MyW95r

[Joao]

Hi There,

Please try using the following code instead

<a href="http://pcnetworked.com/" style="color: white; margin-left: 20px" class="x-btn-mini x-btn">Button</a>

Hope it helps

Joao

[borinqen]

Tks Joao! Yes, this worked. One more question… I would like my logo and my menu to be on the same line similar to this:

https://www.screencast.com/t/GdJMd5UibZn

Mine currently looks like this:

https://www.screencast.com/t/ISXEBiqj

I have made my logo smaller to see if that helps but it’s not working and I also don’t want to make it too small.

Any ideas?

Thank you,

[Rupok]

Hi there,

Thanks for writing back! You can add this under Custom > CSS in the Customizer.

@media only screen and (max-width: 979px) {
.x-navbar-inner .x-container.max.width {
	width: 95%;
}
.x-navbar .desktop .x-nav > li > a:not(.x-btn-navbar-woocommerce) {
	padding-left: 10px;
	padding-right: 10px;
}
}

Hope this helps.

Cheers!

[borinqen]

I have added this , however, nothing changes on the site.

[Joao]

Hi There,

Would you mind providing us with login credentials so we can take a closer look? To do this, you can make a post with the following info:

– Link to your site
– WordPress Admin username / password

Don’t forget to select Set as private reply. This ensures your information is only visible to our staff.

Thanks

[Kpan3]

This reply has been marked as private.

[Rue Nel]

Hello There,

Thanks for providing the information. I have checked your site and you need to update the given css code. You can make use of this code instead:

@media(min-width: 980px) and (max-width:1190px){
    .x-brand img {
        width: 160px;
    }

    .x-navbar .desktop .x-nav > li > a:not(.x-btn-navbar-woocommerce) {
        padding-left: 5px;
        padding-right: 5px;
    }
}

Please let us know if this works out for you.

[Author]

Posts