Front language switching

If you wish to customize language switching on the admin side, see Integration Guide and the JSON configuration.

Methods

These language switching methods are available for the front-end side (main content):

• Add menu item “Language Switcher” to an appropriate menu on your site. It has a few customizable options.

• Add widget “qTranslate Language Chooser” to an appropriate widget area on your site. It has a few customizable options as described in other FAQ topics or embedded help text.

• Use direct call to qtranxf_generateLanguageSelectCode($type,$id) in your templates (pay attention to prefix ‘qtranxf_‘  instead of  ‘qtrans_’). Argument $type currently accepts ‘image’, ‘text’, ‘both’, and ‘dropdown’ choices, which match the choices available in “qTranslate Language Chooser” widget. Example: . You can change the look of language select list via CSS entries.

  Starting from the version 3.4.6, the arguments of the function are changed (compatibility with old way is preserved): qtranxf_generateLanguageSelectCode($args). A single argument $args is a hash array of options, which accepts the following keys:

  • ‘type’ – one of the values: ‘text’, ‘image’, ‘both’, ‘dropdown’ and ‘custom’, which match the choices on widget admin page.
  • ‘format’ – needs to be provided if ‘type’ is ‘custom’. Read help text to this option on widget admin page.
  • ‘id’ – id of widget, which is used as a distinctive string to create CSS entities.

• Use a call to WordPress method “the_widget('qTranslateXWidget', $instance, $args)“. Argument #instance takes the following keys:

  • ‘widget-css-off’ – boolean value, default is ‘false’.
  • ‘hide-title’ – boolean value, default is ‘false’.
  • ‘hide-title-colon’ – boolean value, default is ‘false’.
  • ‘title’ – string value of widget title.
  • ‘type’ – string value with possible values ‘text’, ‘image’, ‘both’, ‘dropdown’ and ‘custom’. Type ‘custom’ is only available in version 3.4.6 or later.
  • ‘format’ – string value of custom format, in case ‘type’ is ‘custom’. Read help text to this option on widget admin page.

  For example, the_widget('qTranslateXWidget', array('type' => 'both', 'hide-title' => true) );. Refer to the documentation of function the_widget for more information.

• Build a few custom menu items, each of which switches the current page to a specific language. The visual appearance of such menu items can be designed any way as desired, like any other normal menu item.

Language switcher menu

Customization of the Language Switcher Menu

The following query options can be typed in the field “URL” of “Language Menu” custom menu item, after “#qtransLangSw?”, separated by “&”, same way as options are provided on a query string:

• type=[LM|AL] – type of menu:

  • “LM” – Language Menu (default).
  • “AL” – Alternative Language: the top menu entry displays the first available language other than the current.

• title=[none|Language|Current] – title text of the top item (not sub-items):

  • “Language” – word “Language” translated to current language (default).
  • “none” – no title in the top of menu, flag only.
  • “Current” – displays current language name.
  • One may also put arbitrary multilingual title in the field “Navigation Label” in the menu item editor.

• colon=[shown|hidden] – whether to display colon after title.

• flags=[none|all|items] – the way to display language flags:

  • “none” – no flag is shown in any item, including the top item.
  • “all” – all items show flag, including the top item.
  • “items” – only sub-items show corresponding flag, top item does not.

• names=[shown|hidden] – whether to display language names in sub-items.

• current=[shown|hidden] – whether to display the current language in the menu.

For example, to show flag only in the top language menu item, enter #qtransLangSw?title=none, if in addition to this current language is not needed to be shown, enter #qtransLangSw?title=none&current=hidden, and so on.

We understand that this is not a very user-friendly way to adjust the options, but it works, and we will provide a better in-editor interface to specify them in the future.

FAQ

Flags and text are misaligned on language menu or widget.

Theme or other plugins CSS entries interfere. Adjust applicable CSS entries through a custom stylesheet.

How can I prevent lazy loading of the flags?

The flags have a qtranxs-flag class. For example you can add this class to the exclusion filter in W3TC.

How can I prevent URL of a custom menu item from being converted?

URL of a custom menu item gets converted to a URL for active language according to option “URL Modification Mode”, unless query argument 'setlang=no' is added to the URL typed in. For example, if URL of a menu item is http://example.com change it to http://example.com?setlang=no, or if it already has some query like this http://example.com?arg=value, then change it to http://example.com?arg=value&setlang=no. The additional query 'setlang=no' is always removed when the item gets rendered on a web page, for example:

• http://example.com is rendered language-encoded, like http://example.com/en.
• http://example.com?setlang=no is rendered as http://example.com without language encoding and argument 'setlang=no' is removed.
• http://example.com?arg=value&setlang=no is rendered as http://example.com?arg=value without language encoding and argument 'setlang=no' is removed.

How can I make URL of a custom menu item to be always converted to a specific language?

Put into field “URL” of a custom menu item entry like “#?lang=xx“, where “xx” is a two-letter language code desired. On front end, this menu item will point to its own page and will always stay converted to the language specified regardless the active language.

Using a few menu items like this with different languages provides an alternative way to build a horizontal language menu, or any kind of custom language menu, instead of pre-configured language menu item.

The menu item’s “Navigation Label” may still be customized depending on active language in a normal way like in any multilingual field. You may also put a picture in the menu (probably flag, if used for language menu) by putting code like this

English <img alt="English" src="http://localhost/wordpress/wp-content/plugins/qtranslate-xt/flags/gb.png">

into field “Navigation Label”.

Can I make horizontal language menu instead of a drop-down one?

Use a widget with CSS tuned for horizontal list, or, if in menu, use a set of custom menu items instead of pre-configured drop-down Language Menu. Configure each item to always switch current page to a specific language as described in the topic above.

Why does a menu item not follow the translation of the title on the original underlying page or post?

WordPress fetches the menu label from an underlying object attached to menu item, if menu item’s own value for “Label” is empty in database. It becomes empty, if the label entered is exactly the same as title on underlying object, like page or post. Once the value of label and title of underlying object are different, menu will show its own version. That is why, if you wish menu item to follow the title of underlying page, enter exactly the same translations for all languages. Note that even extra space will make the values to be different. Sometimes it is easier to remove menu item, save menu, then add item back. It maybe easier to match all the translations exactly using Raw Editor Mode. The option “Editor Mode” defines the way how multilingual fields are edited. It can be adjusted on tab “Advanced” of Settings/Languages page: /wp-admin/options-general.php?page=qtranslate-xt#advanced. The help text is provided under available choices on that configuration page.

How can I customize menu depending on the language?

If you wish a menu item not to show up for a specific language, remove its translation for that language from “Navigation Label” field in menu editor.

Why does my menu show different subsets of items for different languages?

A menu does not show items that do not have translation to the currently active language. Do your missing items have translations in the current language? Try to re-save them to ensure that all translations are entered for all menu items.

Earlier versions of qTranslate-XT have shown the default language in some cases, when translation was not available. The latest version is now more consistent with this regard and never shows an empty item. Item appears to be empty if there is no translation. This was requested by users, since people wanted to hide menu items which would point to an untranslated page, for example. This behaviour provides such opportunity. Translation may coincide with another language, but must not be empty.