All Collections
Language and Internationalization
Integrating a user language preference with MetaLocator
Integrating a user language preference with MetaLocator

This article discusses using JavaScript to connect a language selector on your Website with MetaLocator

Michael Fatica avatar
Written by Michael Fatica
Updated over a week ago

If your website offers content in multiple languages, it is common practice to allow the user to choose their preferred language.  Similarly, MetaLocator offers the ability to change language dynamically.  This article discusses passing the user's choice of language on your Website to the MetaLocator application embedded within your Website.

This article discusses javascript and technical topics and should be implemented with the help of your Webmaster.

MetaLocator manages translations in language files.  These files are created under the Languages page of the Dashboard.  Be sure you understand how to create and edit language files before proceeding.  

In this example, we will start with a basic setup where a MetaLocator interface is installed alongside a user language dropdown list.  This dropdown list resides on the host Website in this example, not within the MetaLocator IFRAME.

Passing JavaScript Variables

If the page on which MetaLocator is hosted knows the user's language selection at run-time, the user's selection can be simply included in the ml___params object.  For example, a common installation code set is as follows:

<!-- MetaLocator.com Code START -->
<script language="javascript" src="//code.metalocator.locator/index.php?option=com_locator&view=directory&layout=_javascript&framed=1&format=raw&tmpl=component&no_html=1&Itemid=XXXXXXXXXX"></script>
<!-- MetaLocator.com Code END: Do not modify this code block. See TOS for details. -->


To dynamically set the language to "fr-FR (1)" initialize the ml___params object as follows:

ml___params['lang'] = 'fr-FR (1)';


The resulting complete integration is as follows:

<script> var ml___params = {"lang":"fr-FR (1)"}; </script>

<!-- MetaLocator.com Code START -->
<script language="javascript" src="//code.metalocator.locator/index.php?option=com_locator&view=directory&layout=_javascript&framed=1&format=raw&tmpl=component&no_html=1&Itemid=XXXXXXXXXX"></script>
<!-- MetaLocator.com Code END: Do not modify this code block. See TOS for details. -->


This configures MetaLocator to load the first fr-FR language file.  MetaLocator allows you to manage multiple language sets for the same language, hence the "(1)".  In IFRAME installations, you may notice that the IFRAME src URL is automatically updated to include the 'lang' URL parameter with the value provided.

This method is discussed in depth in this article.

Triggering via URL Parameters

The language preference may also be set with a special URL parameter: ml___lang.  This URL parameter is added to the URL for the page on your website which hosts the MetaLocator Interface.

For example, the URL shown below will trigger the MetaLocator installation code to use the fr-FR (1) language file on initialization.

This method is discussed in depth in this article.

The values provided to the lang variable should exactly match one of the language files configured in the dashboard under Languages, as shown below:

Did this answer your question?