Docs

[thelistener]

Hola X Team! I am in need of some assistance. I need to make the “For Limited Reservations” and the phone number in masthead of the site I’m working on look like the one attached. Also, how do I remove the underline on hover?

[Rahul]

Hey there,

#1. From my understanding, you can add a new layer into the slider revolution and add your data into it.

#2. To remove the underline on menu item hover, please add the following CSS code via Appearance > Customize > Custom > CSS:

.x-navbar .desktop .x-nav > li > a:hover > span, .x-navbar .desktop .x-nav > li.x-active > a > span, .x-navbar .desktop .x-nav > li.current-menu-item > a > span {
box-shadow: none !important;
}

Let us know how this goes!

[thelistener]

Rahul, so basically replace the menu with one made in Slider Revolution? I’m sorry I meant to say I need to customize the menu link to look like the attached image.

[Friech]

Hi There,

I did checked the site, there is the “reservations info” on the left of the header just like your screenshot. Would you mind to clarify what you’re trying to achieve, please.

We’ll be happy to provide you with a response once we have a better understanding of the situation.

Thanks.

[thelistener]

Yes I was able to get that into the menu, but i couldn’t figure out the styling. “For Limited Reservations” is gray and a bit smaller than the number. Plus I need to align both lines to the right.

[Thai]

Hi There,

Please replace your navigation label with this:

<span>For Limited Reservations</span><br>+1 941 356 8428

After that add the following CSS under Customizer > Custom > Global CSS:

.x-navbar .desktop .x-nav > li#menu-item-175 > a > span {
    font-size: 16px;
    text-align: right;
}
.x-navbar .desktop .x-nav > li#menu-item-175 > a > span > span {
    font-size: 14px;
    color: #000;
    display: block;
}

http://i.imgur.com/XJQLTxw.png

Hope it helps 🙂

[thelistener]

Thank you so so so much!

[Rahul]

You’re welcome!

[Author]

Posts