Show opposite flag in menu

Sometimes you want to show just the opposite flag(s) in your menu.

This comes in really handy on bilingual wesbites, where you want to see the other language name or flag in the menu, not the current language.

This is possible with a bit of css.

  • go to Appearance -> Menus -> Screen Options (top right corner) and make sure “CSS Classes is checked”
  • next, edit your language menu items, and add for each language a custom class: tp_en for English, tp_fr for French, etc. You won’t be needing the “Current Language” item.
  • now, you can go to WordPress -> Appearence -> Customize -> Additional CSS and add some custom css like:
  • .translatepress-en_US .tp_en, 
    .translatepress-fr_FR .tp_fr, 
    { display: none; }
  • the “translatepress-en_US” css class is added automatically for each language to the body of your html page. It contains the locale, not the language slug (from the TranslatePress settings), that’s why it’s en_US and not just en.

Note: You’ll have to replace the language locales with your languages.