Language Switcher on header

[Kevict]

Hi. I’d like to change the look of the language switcher to horizontal simple text (English | Chinese) rather than the drop down with flags. I have made the changes within the WPML plugin, but the theme CSS seems to override this option.

Our clients are both Chinese and Taiwanese-based and there is a sensitivity to which flag they choose for their respective countries. We’d rather just have text, no flags to make everyone happy!

Thanks,
Alyssa

Attachments:

You must be logged in to view attached files.

[David Martin – Support]

Hi,

To hide the submenu language flags, please add this:

nav.std-menu ul.sub-menu > li:first-child { display: none; }

Thanks,
David.

[Kevict]

Hi David. All that did was remove the first menu item on all my dropdowns throughout the site 🙂

Your help is appreciated!

[Mohammad – SUPPORT]

Hi,
Great thanks to David.
Mohammad

[leggero]

Hi there

Looking for the same solution.

“All that did was remove the first menu item on all my dropdowns throughout the site.”

Davids solution didn’t work, so any propositions?

Thanks and best regards

Caspar

[Mohammad – SUPPORT]

Hi,

@leggero – What is your issue exactly? Please provide me specific page url with issue.
Thanks
Mohammad

[leggero]

Hi Mohammed

no issue, just would like to have DE/EN on the site instead of the flags:

http://www.pepshot.ch

Thanks and best regards

Caspar

[David Martin – Support]

Hey,

To remove the flags within the dropdown, please use this:

ul.header-languages.sub-menu li img {
    display: none;
}

Thanks,
David.

[leggero]

Thanks David, works.

But the flags on the first level are still there. As we are a Swiss Company, the german flag doesn’t fit. Is there any chance to change it into DE / EN?

Thanks

Caspar

[David Martin – Support]

Yes, with a little CSS trick:

.aux-item.aux-language ul.menu>li.aux-languages>a>span {
    display: block!important;
    font-size: 0;
}

.aux-item.aux-language ul.menu>li.aux-languages>a>span:before {
    content: "DE/EN";
    font-size: 16px;
}

Thanks,
David.

[leggero]

Hi David

Sorry for the long waiting. It’s not working though (s. Screenshot). The flag is still there, and the DE/EN underneath:

http://www.apmphiro.com

I switch it off on the site.

Any thoughts?

Best regards

Caspar

Attachments:

You must be logged in to view attached files.

[Mohammad – SUPPORT]

Hi,
Please provide correct website url to check.
Thanks
Mohammad

[leggero]

Hi Mohammed

I added it at my testsite:

dev.appenzeller-gurt.com

Same here.

Thanks and best regards
CAspar

[Mohammad – SUPPORT]

Hi,
Please use this custom css code:-

#header .aux-languages img, #top-bar .aux-languages img {
    display: none !important;
}

Thanks
Mohammad

[leggero]

Works perfectly now!

Thanks