Make a menu link active in color in header PRO

Support
#1

I noticed when a menu item is selected and you go to that page the menu name is not active in colour. How do you style the menu for active menu items to appear a different colour than the primary colour?

2 Likes
#2

Hello There,

Thanks for writing in! This is a known issue in Pro theme. This shall be resolve in the next release update which will be out anytime soon. Please watch out for it.

Thank you for your understanding.

#3

Hi, I am also experiencing this issue. Look forward to an update.

#4

Hello There,

Thanks for updating in! Our developers is already fixing this. This issue may be resolve in the next release updates. Please watch out for it.

Thank you for your understanding.

#5

In news on this update?

Thanks!

#6

Hi @SEVERO,

Thanks for writing around! You can add the following code in your Customizer to fix the issue:

.current-menu-item > a .x-anchor-text-primary {
    color: #0041ff !important;
}

Let us know how this goes!

#7

PERFECT!! Thank you!

#8

You’re most welcome!

#9

Hi there

Is it possible to change the colour of the toggle menu items including rollover?

Thanks

#10

Hi again,

By toggle menu items you mean mobile menu items? If yes then you can change the colors of the menu items and the hover color via header builder, Inspect your Navigation Collapsed > Top Links > PRIMARY TEXT STYLE

Hope this helps!

#11

Hi there

Yes but there’s no active colour like with the main menu above.

I was wanting to use a diiferent active colour other than the one specified in the code below for the mobile menu.

.current-menu-item > a .x-anchor-text-primary {
color: #0041ff !important;
}

Thanks

#12

Hey there,

I see what you mean, you can make use of the following code:

/* For desktop version */
.current-menu-item > a .x-anchor-text-primary {
    color: #8618d1 !important;
}

/* For mobile version */
.x-menu-collapsed .current-menu-item > a .x-anchor-text-primary {
    color: #ffc300 !important;
}

Cheers!

#13

Excellent!!

Thank you very much

#14

Glad we could help.

Cheers!

#15

Hello, is it possible to change the color background of the active menu (here in red).

#16

Hi @Lyser,

Thanks for writing around! Yes you can change the background color of the active menu as well, add the following code in your Customizer:

/* For desktop version */
.current-menu-item > a {
    background-color: #fff !important;
}

/* For mobile version */
.x-menu-collapsed .current-menu-item > a {
    background-color: #00b5fc !important;
}

Cheers!

#17

Perfect, thank you :slight_smile:

#18

You’re most welcome!

#19

Hello, do you think there is a way to make like a arrow at the end of the background ?

what i’ve got :

what i would like :

#20

Hi There,

Unfortunately, that is not a feature offered by X.

It could be done with custom development but would fall out of the scope of our support.

Thanks for understanding.