Shows flags of WPML translated content in selected menu's

ramon fincken

WPML flag in menu

Shows translated flags (for every language except current viewing lang) in the default or wp_nav_menu at last position

Ryan Hellyer

Menu  Cache

johanvandemerwe

<p>Shows translated flags (for every language except current viewing lang) in any selected menu in the plugin settings<br />
LTR support</p>
<p>In addition to the plugin from Ramon Fincken, this plugin let you select on which menu you want to add the language flags.<br />
You can even make an empty menu and make it dedicated for your language flags and put it as a custom menu in the sidebar.</p>
<p>To make the flags appear on a translated menu, you go in the settings of the plugin and add the translated menu to the selection<br />
you made. This has to be done with every translated menu where you want the flags to appear. So, if you just have translated a<br />
menu. Go back to the options of the widget and you will see that this translated menu is added to the list. Select this menu too and<br />
save the options.</p>
<p>See other notes tab for explanation</p>
<p>Visit: http://www.enovision.net/wpml_flag_in_menu_extended/ for more explanation.</p>
<h3>additional classes</h3>
<p>You can also add an additional class for the IMG and LI tag. On the LI tag is automatically added the class “not-last” for all<br />
flag items but the last one, and “last” for the last flag.</p>
<p>Now you can add some styling like:</p>
<pre><code>/* make a border around the flag icon */
img.wpml_flags {
    border : 1px solid #f1f1f1;
}

/* bring the icons a bit closer together */
li.wpml_flags.not-last {
    margin-right : -20px;
}

/* a little left padding after the flag, when name is used too */
.wpml_flags_name {
    padding-left : 10px;
}
</code></pre>
<p>You can find these styles in the style.css in the css directory of the plugin.<br />
Modify this to your own requirements.</p>
<h3>How to right justify the menu’s on a menu?</h3>
<p>You can add a wrapper class around the flags and put some CSS styles on it.</p>
<p>In the wrap element you put: div<br />
In the wrap extra classes you put: flag_wrapper.</p>
<pre><code> #main-nav ul div.flag_wrapper {
    float: right;
}
</code></pre>
<p>In the wrap element you put: span<br />
In the wrap extra classes you put: flag_wrapper.</p>
<pre><code> #main-nav ul span.flag_wrapper {
    float: right;
    line-height: 14px; /* this could be different */
}
</code></pre>
<h3>How to add a menu to a seperate widget area?</h3>
<ol>
<li>Create a new menu f.e.  “Language Selecter”</li>
<li>Add a custom link to this menu with in the label: [wpml_flag_menu]</li>
<li>Save the menu</li>
<li>Create/Translate the menu in all your languages (to make it exists in all languages)</li>
<li>Modify the wmpl_flag_menu settings and select the menus used created/translated</li>
<li>Save the settings</li>
<li>Add a custom menu widget to the sidebar or any other widget area and select the “Language Selecter” as selected menu</li>
<li>Save the settings and look for the result</li>
</ol>
<h3>Limitations</h3>
<p>This plugin will not create flags on the main navigation menu of SOME(!) Genesis Framework (child) Themes !!!</p>
<p>Coding by: Johan van de Merwe</p>


Alternatives to WPML flag in menu Extended

Top alternatives