Archived topic
Replace Wordpress menu labels
7 replies · Started by Rafał on August 11, 2017
Hello Tom and team.
I'm not sure if this is completely GP related but I would love your help with this topic.
I have a translated site that requires translated menu. There's a lot of work using plugins to get it changed etc. so I thought I would simply create some CSS code replacing menu labels on this particular site. Now I cannot figure out how to remove label and put a diffrent one insted.
Say I have a "Misja" menu button (css menu-item-699) that needs to be replaced with "Mission" word, I've tried using
.menu-item-699 :before{
content: "Mission";
}
but this results in: "MissionMisja"
How to replace the label completely?
Thank you for your help!
best.
Rafał
Hmm, I'm not sure if it's possible to remove the actual content of the menu item.
Instead, maybe add two menu items, and hide/show each one under specific conditions?
Thank you Tom for assistance with this issue.
I have chosen to follow your suggestion and created translated menu items adding classes onto them and simply hiding them according to the language of the site
'.polish{
display:none !important;
visibility: hidden !important;
}
'
and opposite for polish site (by hiding english menu items). Works as expected.
Once again thank you!
No problem! :)
Hi Tom again, sorry for reopening the thread but it seems there's a problem with the mobile menu.
When in mobile view (on actual mobile device) menu items that suppose to be hidden/not-displayed are only invisible but white space is still shown. Could you please have a look.
There's also a weird margin on the right as you scroll down, and it seems that is because of the menu bar which btw does not hide completely as you scroll.
Thank you in advance for any help.
Try making your selector more specific:
.main-navigation .main-nav li.polish

Glad I could help :)