language switcher UI in menu

  • rik1234

    (@rik1234)


    2 years, 9 months ago

    Dear Polylang,
    is it possible to change the look of the Language Switcher in the menu such that the main item in the menu is just a flag, but that when it drops down, you use the names + the flags of the languages?
    If not possible: hereby the feature suggestion!

    The page I need help with: [log in to see the link]

Viewing 4 replies - 1 through 4 (of 4 total)
  • mike8040

    (@mike8040)

    2 years, 9 months ago

    Just today I also was looking for exactly the same info about this. There is a bug with the lng switcher. I have it set to just show the flag. The drop box however is completely empty. It should show the flag and its there in the code but not showing up. This is not a caching issue. Do you got the same behavior?

    https://www.dropbox.com/s/s660uoh1qnhs27i/lng_switcher_bug.jpg?dl=0

    //EDIT: If “show lng names” is activated it shows at least the name but the flag is still missing.

    //EDIT-2: Ok it seems the size for the flag icons get defined through html inline code for whatever reason. If I disable the size properties in the dev tools the flag shows up.
    https://www.dropbox.com/s/t4s3kt81qkyn78m/lng_switcher_bug-2.jpg?dl=0
    After more digging is seems this css line is the culprit:
    .lang-item a img {padding: 0 10px;}
    Setting this to padding 0 resolves the invisible flag without disabling the inline CSS properties.

    @rik1234 For your issue. I think as a workaround you could have the “show lng names” active and set the active lng name to “display:none” with custom CSS. Just a workaround

    • This reply was modified 2 years, 9 months ago by mike8040.
    • This reply was modified 2 years, 9 months ago by mike8040.
    • This reply was modified 2 years, 9 months ago by mike8040.
    • This reply was modified 2 years, 9 months ago by mike8040.
    • This reply was modified 2 years, 9 months ago by mike8040.
    Plugin Author Chouby

    (@chouby)

    2 years, 9 months ago

    Hello,

    @rik1234 We wont implement such customization, but you can use style your language switcher with CSS as suggested by @mike8040.

    Another possibility would be to develop your own language switcher using the output of pll_the_languages( array( 'raw' => 1 ) ) to buil your own html markup.

    @mike8040 Polylang doesn’t add CSS on front. So maybe you can check if the CSS rule is not coming from your theme.

    Thread Starter rik1234

    (@rik1234)

    2 years, 9 months ago

    Dear @chouby and @mike8040 ,
    thanks for the replies. Could you help me (and others who would like the future of having just a flag in the menu, but a dropdown of flags+names) with the CSS code that we should use to accomplish that? I am just a general user of Polylang, my experience with web development is not adequate to do this myself!
    Rik

    mike8040

    (@mike8040)

    2 years, 9 months ago

    @rik1234
    Hi, sorry for the late reply. I managed to fix this by just adding in the custom CSS for the theme:

    .dropdown-menu .sub-menu
{min-width:50px;}

    For some reason either the theme or the plugin did set some ridiculous min-width value and the outcome was that the flag wasn’t shown.

    This are the menu settings itself
    https://ibb.co/Bw46B7Q

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘language switcher UI in menu’ is closed to new replies.