View source for Meta:Language select

{{languages|Meta:Language select}}
{{shortcut|[[WM:LS]]}}
[[File:Unlocalised stub template.gif|thumb|right|This is [[Template:Stub]] without language selection.]]
[[File:Localised stub template.gif|thumb|right|This is [[Template:Stub]] with language selection (English and French).]]
'''Language select''' allows users to hide foreign languages on '''multilingual pages'''. This, for example, allows French readers to see only French text on multilingual pages.

Notes : 
* The Language select functionality described in this page should be used only when there are very few translations, and for translating a few sentences. The Language select functionality is only intended for pages (like generated activity reports, or user pages) that will be rarely translated, or for documenting category pages (when the creation of separate subcategories, for storing collections of translated pages per language, or is not desirable, or not possible for describing images).
* Pages that are designed to be fully translated into multiple single-languages with subpages (See [[Meta:Translation]] for details) should preferably not use Language select, but a language bar to allow navigation between these pages.
* As well, generic message boxes informing about the status of a page should be transcluded from templates that avoid using Language Select, but use Language Switching (see [[Template:LangSwitch]]) or the newer [[Special:Translate|Translate]] extension, in order to display the user language directly.<br /> At right are two screenshots of [[Template:Stub]] (which earlier used the Language Select mechanism) without and with a language selection of English and French using the CSS method (see below) Now this template is autotranslated to the user language and will then no longer display all translations.

== Implementation ==

There are two working implementations of language select. The preparation of a page for language selection is the same for both methods. The older [[w:CSS|CSS]] method allows multiple languages to be selected, most useful for multilingual users. However, it cannot recognize when ''no'' selected language is present, which results in no content being displayed. The newer [[w:JavaScript|JavaScript]] method detects the language of your browser automatically (you can configure it to ignore the browser setting), and does nothing if no selected language is present. However, it can only display one language at a time.

=== Identifying multilingual pages ===

Pages that implement language selection include a notice linking back to this page using {{[[Template:multilingual|multilingual]]}}. There has been no discussion on the logo to use for this purpose; [[:File:Localisation2.svg|Localisation2.svg]] is currently used.

<gallery>
File:Wiki-trans-icon.svg|[[User:Zscout370|Zscout370]] proposal
File:Localisation2.svg|[[User:Pathoschild|Pathoschild]] proposal
File:Globe of letters.png|"Globe of letters" proposal
</gallery>

=== Delimiting languages ===

==== Technical details ====

A multilingual page is contained by the CSS class "multilingual", with text in every language contained within HTML elements tagged with the <code>class="lang-''xx''"</code> attribute, where ''xx'' is a lowercase [[w:BCP 47|BCP 47]] language code (generally two or three letters from [[w:ISO 639|ISO 639]], possibly followed by variant sufixes; if there is no two-letter code, the lowercase three-letter code is used.) and the HTML <code>lang</code> attribute. The <code>lang</code> attribute is contextually more correct than the class, but the CSS required to hook into it is not supported by all browsers. If you're translating existing messages and don't know what the language is, use the code "und".

An example page in Old English, English, French, Kiswahili, Latin, Occitan, Romanian, Pali, Arabic, Persian, and Uighur: (sorted per [[:commons:Module:Multilingual description/sort]])

<syntaxhighlight lang="html5">
<div class="multilingual">
<div class="lang-ang" lang="ang">Þis wordu is Englisc.</div>
<div class="lang-en" lang="en">This text is English.</div>
<div class="lang-fr" lang="fr">Ce texte est Français.</div>
<div class="lang-sw" lang="sw">Maelezo haya ni ya Kiswahili.</div>
<div class="lang-la" lang="la">Haec verba latina sunt.</div>
<div class="lang-oc" lang="oc">Aqueste tèxt es en Occitan.</div>
<div class="lang-ro" lang="ro">Acest text este în română.</div>
<div class="lang-pa" lang="pa">ਇਹ ਟੈਕਸਟ ਪੰਜਾਬੀ ਵਿੱਚ ਹੈ।</div>
<div class="lang-ar" lang="ar">هذا النّص عربي.</div>
<div class="lang-fa" lang="fa">اين نوشته فارسي است.</div>
<div class="lang-ug" lang="ug">بۇ ئۇيغۇرچە</div>
</div>
</syntaxhighlight>

Note that for correct visual vsual ordering of the rendered native language names, the list has to be sorted manually on the page itself (and not sorted by language code), otherwise the relative order is kept and may finally be arbitrary and difficult to scan for readers to find their desired language.

==== Templates ====

The {{tlx|Ls}} template simplifies the implementation of language select. For example, the following two lines are equivalent (however the template also provides some other useful formatting options such as displaying a tooltip showing the language name in the current user language, and the associated language code, or coloring fuzzy translations needing updates):

<syntaxhighlight lang="html5">
{{Ls|en|This text is English.}}
<div class="lang-en" lang="en" dir="ltr">'''English:''' This text is English.</div>
</syntaxhighlight>

This {{tlx|Ls}} template may be used multiple times within the multilingual section, including for the same language. The relative order of inclusion of Ls templates in the section is also kept, but in many cases you'll want to order languages in a consistent order. The {{tlx|LangSelect}} will simplify this (but will accept only one occurrence of each language).

Note that, currently, the language selection form with buttons is generated by Javascript below multilingual sections below '''each''' multilingual section in the current page, and an additional language selection box is also displayed at top of page (it displays a list of all language codes used in multilingual sections any where on the page, still without sorting them for easier selection). This can be customized with [[#Cascading StyleSheets|CSS]] (see below).

Compare how translations are mixed and difficult to find (notably when script directions are alternating) when they are initially sorted by language code (for easier editing and maintenance) when using multiple inclusions of {{tlx|Ls}}, and how {{tlx|LangSelect}} orders them visually by script (scripts being ordered by direction and type) and then alphabetically by language name, grouping all right-to-left languages separately from left-ro-right languages:

{|class="wikitable" width="100%"
|-
!scope="col"|Wiki code
!scope="col"|Rendering
|-valign="top"
|<syntaxhighlight lang="html5">
<div class="multilingual">
{{Ls|ar|هذا النص باللغة العربية.}}
{{Ls|da|Denne tekst er på dansk.}}
{{Ls|en|This text is English.}}
{{Ls|fa|این متن به زبان فارسی است.}}
{{Ls|fi|Tämä teksti on suomeksi.}}
{{Ls|fr|Ce texte est en français.}}
{{Ls|frc|update=en|Ce texte devrait être en français cajun.}}
{{Ls|he|טקסט כתוב בעברית.}}
{{Ls|hi|यह पाठ हिन्दी में है।}}
{{Ls|pa|ਇਹ ਟੈਕਸਟ ਪੰਜਾਬੀ ਵਿੱਚ ਹੈ।}}
{{Ls|ru|Этот текст на русском языке.}}
{{Ls|sv|Denna text är på svenska.}}
{{Ls|th|ข้อความนี้อยู่ในไทย.}}
{{Ls|ur|یہ متن اردو ہے.}}
{{Ls|zh|这是中文。}}
{{Ls|zu|Lo mbhalo Zulu.}}
</div></syntaxhighlight>
|style="background:white;color:black;"|<div class="multilingual">
{{Ls|ar|هذا النص باللغة العربية.}}
{{Ls|da|Denne tekst er på dansk.}}
{{Ls|en|This text is English.}}
{{Ls|fa|این متن به زبان فارسی است.}}
{{Ls|fi|Tämä teksti on suomeksi.}}
{{Ls|fr|Ce texte est en français.}}
{{Ls|frc|update=en|Ce texte devrait être en français cajun.}}
{{Ls|he|טקסט כתוב בעברית.}}
{{Ls|hi|यह पाठ हिन्दी में है।}}
{{Ls|mr|हा मजकूर मराठीत आहे.}}
{{Ls|pa|ਇਹ ਟੈਕਸਟ ਪੰਜਾਬੀ ਵਿੱਚ ਹੈ।}}
{{Ls|ru|Этот текст на русском языке.}}
{{Ls|sv|Denna text är på svenska.}}
{{Ls|th|ข้อความนี้อยู่ในไทย.}}
{{Ls|ur|یہ متن اردو ہے.}}
{{Ls|zh|这是中文。}}
{{Ls|zu|Lo mbhalo Zulu.}}
</div>
|-valign="top"
|<syntaxhighlight lang="html5">
{{LangSelect | update = en
 | ar = هذا النص باللغة العربية.
 | da = Denne tekst er på dansk.
 | en = This text is English.
 | fa = این متن به زبان فارسی است.
 | fi = Tämä teksti on suomeksi.
 | fr = Ce texte est en français.
 | frc:FUZZY = Ce texte devrait être en français cajun.
 | he = טקסט כתוב בעברית.
 | hi = यह पाठ हिन्दी में है।
 | mr = हा मजकूर मराठीत आहे.
 | pa = ਇਹ ਟੈਕਸਟ ਪੰਜਾਬੀ ਵਿੱਚ ਹੈ।
 | ru = Этот текст на русском языке.
 | sv = Denna text är på svenska.
 | th = ข้อความนี้อยู่ในไทย.
 | ur = یہ متن اردو ہے.
 | zh = 这是中文。
 | zu = Lo mbhalo Zulu.
}}</syntaxhighlight>
|style="background:white;color:black;"|{{LangSelect | update = en
 | ar = هذا النص باللغة العربية.
 | da = Denne tekst er på dansk.
 | en = This text is English.
 | fa = این متن به زبان فارسی است.
 | fi = Tämä teksti on suomeksi.
 | fr = Ce texte est en français.
 | frc:FUZZY = Ce texte devrait être en français cajun.
 | he = טקסט כתוב בעברית.
 | hi = यह पाठ हिन्दी में है।
 | pa = ਇਹ ਟੈਕਸਟ ਪੰਜਾਬੀ ਵਿੱਚ ਹੈ।
 | ru = Этот текст на русском языке.
 | sv = Denna text är på svenska.
 | th = ข้อความนี้อยู่ในไทย.
 | ur = یہ متن اردو ہے.
 | zh = 这是中文。
 | zu = Lo mbhalo Zulu.
}}
|}

The template {{Tlx|LangSwitch}} is similar to {{Tlx|LangSelect}}, except that it will display only one language (a specified language, or the language of the content of the current page).

== Usage ==

Note that the two implementations conflict with each other, so only one should be used at a time. 

The description below assumes you use the Monobook skin.

=== Cascading StyleSheets ===

Add the following lines to [[Special:Mypage/monobook.css|your stylesheet]], editing as appropriate for the languages you wish to view:

<syntaxhighlight lang="css">
/* hide all translations (avoid this, it may hide as well the original source language) */
.multilingual { display:none; }
/* unhide only the selected languages */
.multilingual>.lang-en,
.multilingual>.lang-fr { display:block; }
</syntaxhighlight>

If you are using a browser with good support for CSS (such as [[w:Mozilla Firefox|Mozilla Firefox]] or [[w:Opera (browser)|Opera]]), you should use this more contextually correct CSS:

<syntaxhighlight lang="css">
.multilingual>*[lang] { display:none; }
.multilingual>*[lang|=en],
.multilingual>*[lang|=fr] { display:block; }
</syntaxhighlight>

If you want to hide only the language selection forms below multilingual sections (and use only the selector box added at top of pages), you may also use this CSS code:

<syntaxhighlight lang="css">
/* hide the language selection form below multilingual sections */
.multilingual>form.lang_info { display:none; }
</syntaxhighlight>

If instead you want to hide only the language selector box at top of pages (and keep the language selection forms below multilingual sections), you may also use this CSS code:

<syntaxhighlight lang="css">
/* hide the language selector box at top of multilingual pages */
.langselectorcontainer { display:none; }
</syntaxhighlight>

=== JavaScript ===

The JavaScript method is activated by default on the Wikimedia MetaWiki. You can disable it by adding the following line to [[Special:Mypage/common.js|your script file]]:

<syntaxhighlight lang="javascript">
ls_enable = false;
</syntaxhighlight>

You can see an example of the JavaScript in action below. If language selection is disabled, all of the text will be displayed.

<div style="margin:1ex 0;border:1px solid #AAA;background:#FFF;color:#000;padding:1ex;">{{LangSelect
| af = Hierdie teks is in Afrikaans.
| ar = هذا النّص عربي.
| azb = بو یازی تورکجه‌دیر.
| bar = Des is a boarischa Text.
| be = Гэты тэкст — на беларускай мове.
| be-tarask = Гэты тэкст — на беларускай мове.
| bg = Този текст е на български език.
| bn = এই বার্তাটি বাংলায়।
| br = Brezhoneg eo an destenn-mañ.
| ca = Aquest text és en català.
| da = Denne tekst er på dansk.
| de = Dieser Text ist Deutsch.
| el = Αυτό το κείμενο είναι στα Ελληνικά
| en = This text is English.
| eo = Ĉi tiu teksto estas en Esperanto.
| es = Ese texto está en español.
| et = See tekst on eesti keeles.
| fa = این متن فارسی است.
| fi = Tämä teksti on suomeksi.
| fr = Ce texte est en français.
| fy = Dizze tekst is yn it Frysk.
| gl = Este texto está en galego.
| he = הטקסט הזה בעברית.
| hi = यह पाठ हिन्दी में है।
| hr = Ovaj tekst je na hrvatskom jeziku.
| hu = Ez a szöveg magyarul van
| ia = Iste texto es in interlingua.
| id = Ini adalah teks dalam bahasa Indonesia.
| it = Questo testo è in Italiano.
| ja = この文章は日本語です。
| ka = ეს ტექსტი ქართულ ენაზეა.
| km = ឃ្លានេះជាភាសាខ្មែរ។
| ko = 이 글은 한국어입니다.
| ku = Ev nivîs bi kurdî ye.
| la = Haec nota latine scriptus est.
| lb = Dësen Text ass op lëtzebuergesch
| lt = Šis tekstas yra lietuviškas
| mk = Ова е текст на македонски јазик.
| ms = Teks ini ditulis dalam Bahasa Melayu.
| nl = Deze tekst is in het Nederlands.
| no = Denne teksten er på norsk.
| oc = Aqueste tèxt es en occitan.
| or = ଏହି ଲେଖାଟି ଓଡ଼ିଆ ଭାଷାରେ ଲେଖାଯାଇଛି ।
| pa = ਇਹ ਟੈਕਸਟ ਪੰਜਾਬੀ ਵਿੱਚ ਹੈ।
| pl = Ten tekst jest po polsku.
| pt = Este texto está em português.
| ru = Этот текст — на русском языке.
| sc = Custu testu est in sardu.
| sv = Denna text är på svenska.
| sw = Haya ni maelezo ya Kiswahili.
| ta = இது தமிழ் மொழி
| tr = Bu tekst Türkçe'dir.
| ug = بۇلار ئۇيغۇرچە
| uk = Цей текст написано українською мовою.
| zh = 这些文字是中文。 / 這些文字是中文。
}}</div>

When specifying a language, use the code, not the full name.

You can view the JavaScript code at [[Commons:MediaWiki:Multilingual description.js]].

== Changelog ==

The code is maintained in a private Subversion repository. I still have been unable to contact an MediaWiki developers on getting this code into Wikimedia's Subversion repository.

* Revision 1999 &mdash; --[[User:DieBuche|DieBuche]] 10:34, 7 November 2010 (UTC)
** Completely rewrite, to make RL compatible
** Only use dropdown
** Also work on {{tl|de}}, {{tl|en}} etc.
* Revision 1358 &mdash; <span style="font-variant:small-caps;font-family:sans-serif;">[[User:Edward Z. Yang|Edward Z. Yang]]</span><sup style="font-family:serif;">([[User talk:Edward Z. Yang|Talk]])</sup> 15:36, 19 February 2007 (UTC)
** If no cookie is present, code will sniff <code>wgUserLanguage</code> global variable
** If language is set to blank, delete the cookie and switch to auto-detection.
* Revision 1133 &mdash; <span style="font-variant:small-caps;font-family:sans-serif;">[[User:Edward Z. Yang|Edward Z. Yang]]</span><sup style="font-family:serif;">([[User talk:Edward Z. Yang|Talk]])</sup> 22:33, 2 September 2006 (UTC)
** Tweaked '''Show all''' behavior to be more user-friendly: instead of overwriting your cookie, it only temporarily shows all the language strings. You can switch back by pressing '''Select'''
** Renamed '''Save''' to '''Select'''
** Styled the '''Select''' button to be bold.
** Factored out language strings

== See also ==

* [[w:List of ISO 639 codes|List of ISO 639 codes]]
* [[Special:Whatlinkshere/Template:multilingual|List of pages with the language select feature]]
* [[commons:MediaWiki talk:Multilingual description.js]]
* [[Meta:Translate extension|Translate extension]]
** [[commons:Commons:Preparing a page for translation|Preparing a page for translation]]

== External links ==

* [http://beta.wikiversity.org/wiki/Wikiversity:Language_select Language select over at Beta Wikiversity]

[[Category:Multilingualism{{#translation:}}|Language select]]