Support » Plugin: Polylang » [Plugin: Polylang] How to insert flags into menu in custom positions

  • Resolved michalsrodek


    Hey there,

    great plugin! I’d like to ask if there is any way to insert flags into menu manually e.g.

    About us
    Languages –(dropdown)–> en_EN, es_ES
    Some other element
    Another one

    I think it could be done by using some kind of shortcode in menu element’s name attribute.

    Name: [polylang=”es_ES”]

    In that case you need to use wordpress filter ‘wp_nav_menu_items’ and replace those codes into proper links using preg_replace().

    I can try to prepare proper patch but firstly let me know what do you think about that :).

Viewing 11 replies - 1 through 11 (of 11 total)
  • Plugin Author Chouby


    In the current version, I made the choice to offer only one possibility (append the language switcher at the end of the menu). It was the easiest, fit my own need and moreover my philosophy for programs is : the less options, the easier…

    However, since you seem to have programming skills, it would not be difficult to obtain what you want.

    Technically, I already use the filter ‘wp_nav_menu_items’ and simply append the output of my function ‘pll_the_languages’ to the items already created by WordPress (see core.php at line 555 in 0.8).

    So you can simply remove my filter and create your own to position the output of ‘pll_the_language’ where you want. You can even choose to output a dropdown (currently not possible with options Polylang offers in the ui) by choosing the right option. In this case, you would have to write your own javascript (pll_the_languages does not create it), but you can look at what is done for the widget in widget.php.

    Then if you want to share your code, I am sure some users would be very happy !

    Chouby, say my menu starts on the left border and only goes half-way to the right but I want to have the language selector all the way on the right (float:right?) – I can’t seem to be able to select the particular >li< and float it that way with CSS …. the >li< also has no ID unlike my other menu items (but of course has a class)…

    Thanks 🙂

    Plugin Author Chouby


    That’s right. There are only classes. I thought it would be sufficient.
    For example in Twenty Ten, you can move the flags to the right using

    #access .menu-header li.lang-item {
    	float: right;

    You can probably do something similar with your own theme.

    that worked great, thanks a lot! 🙂
    FI – I have the Pagelines Theme – the code is the following

    #nav .main_nav li.lang-item {
           float: right;

    Thanks a lot for you plugin it is great.
    I want to know if is it possible to movelag in header of page.

    I’m using slinding-door thème

    Thanks a lot

    Plugin Author Chouby


    Yes it is possible using the template tag “pll_the_languages”. There are examples in the doc.

    I’m pretty thick, I’m afraid — I’ve tried adding pll_the_languages to a top bar I’ve created to give Contact and the language links in header.php, but there are a couple of things happening:

    1. If I use just “pll_the_languages” it generates a list, even if I don’t use the ul tags;

    2. If I use “dropdown =>1”, the dropdown appears, but nothing happens on click.

    I’m reading the documentation, but it’s about 25% too sophisticated for me to grasp.

    The site:

    I’d be happy with an inline display of “Français” and “English” on a single line, or with a working dropdown. Could I get a hint on how to do either? I’ve tried setting ul style in that div to “inline”, but no joy.

    Plugin Author Chouby


    Did you try this?
    In your theme:
    <ul><?php pll_the_languages() ?></ul>
    In your css file:

    .lang­item {
    display: inline;

    The function does not include the javascript code needed to switch the language when you use the dropdown. My intention was to provide the function for a public of developpers who would be happy to write their own javascript, but I was wrong.

    Thanks, Chouby!

    Still doesn’t seem to be doing it. I inspected the code and it looked like “lang-item” is the class, but neither works.

    It creates a 17px ul to the right of the word “Contact” (regardless of whether it’s set to align-right or not); I’m not sure if there’s some sort of auto-width thing pushing the

  • items down or what. Again, this is a bit out of my depth.
Plugin Author Chouby


Try this:

#topbar ul li {
display: inline;

That was the key — not quite there yet (I needed to inline the ul as well, to prevent a forced line break, and now I need separators between the languages) but I can take it from here. Thanks!

Viewing 11 replies - 1 through 11 (of 11 total)
  • The topic ‘[Plugin: Polylang] How to insert flags into menu in custom positions’ is closed to new replies.