Superfly Menu - apply CSS to specific menu item

[nualexan]

Hello,

I’m trying to have different font size in on menu item on a Superfly Menu.
As suggested in this forum, i applied a CSS Class to the menu item as you can see in image below:

But now i’m enable to configure the CSS.
I put this css code in the Advanced Settings of Superfly Menu

sfm_footermenu {
font-size: 20px;
}

But nothing happens.
I checked with inspector and the class is not applied to the menu item.
Can you help me?
My site is http://cervejavadia.pt/novosite2018/ and the menu only appears in mobile dimensions.

Best regards,
Nuno

[albrecht]

Hi Nuno,

It looks like Superfly Menu didn’t apply the class you added.

But you can use the default class that were given to the menu items by default by wordpress.

So you can add this custom CSS

#sfm-sidebar .sfm-menu .sfm-menu-item-202 a{
    font-size: 22px;
}

Hope this helps.

Thanks.

[nualexan]

Thank you Albrecht,

Is there anyway to put SFM working with class that we named in the menu?
I’m asking this as I wanted to apply the font size to 5 items (to simplify I just asked for one item…) and i wanted something more “friendly” to make changes if necessary in the future.
Thanks in advance.
BR
Nuno

[friech]

Hi There,

So the real issue here is the Class given to the menu item is not applied on the front end. I can’t replicate this issue on my end, please do a test for a plugin conflict. You can do this by deactivating all third party plugins, and seeing if the problem remains. If it’s fixed, you’ll know a plugin caused the problem, and you can narrow down which one by reactivating them one at a time.

And if you have a caching plugin or internal caching, please purge it.

If nothing works, please provide us login credentials in a secure note so we can take a closer look.

Cheers!

[nualexan]

Hello Friech,

I couldn’t manage to notice any conflict.
Every plugins that I have installed (except one for backup) are all from Theme.co package.
I’m going to send credentials to see if you can take a look, ok?
Many thanks,

Nuno

[albrecht]

Hi Nuno,

The login credentials you provided is not working.

Can you recheck? Thanks

[nualexan]

Hello Albrecht!

Thank you!
I double checked and worked for me.
I’m going to send again login and pass only in different paragraphs.
Best regards,

      Nuno

[albrecht]

Hi Nuno,

Currently the superfly plugin removes the class we give to the menu item. So we can’t use that class to edit the menu items.

But we can use the permalink of the page to edit it’s menu item.

For example this Loja page.

We just need to get the tip of the permalink , which is in this case is ‘loja’. So we can use it in this css.

#sfm-sidebar .sfm-menu li a[href*='loja'] {
    font-size: 22px;
}

I think this is more user friendly than the previous css we gave.

Hope this helps.

[nualexan]

Hello Albrecht

It worked! Thank you.
What you tell me is that the problem about using a class in Superfly has nothing to do with my site configuration, but is a SFM plugin problem. Am i right in my interpretation?
But ok!
It’s working
Thank you again for your time,

Nuno

[albrecht]

Hi Nuno,

Yes, the problem is in the Superfly and has nothing to do with your configuration.

Glad we could help.