Translator Revolution jQuery Plugin
Settings
Reference
-
autoSelectAutomatically selects the page's language, just to provide visual aids.
- possible values:
true
|false
. - default value:
true
.
- possible values:
-
clearLocalStorageSets whether to force the visitor's browser to clear up the stored translations and retrieve them again from the server, or not. This setting is useful when writing custom translations.
- possible values:
true
|false
. - default value:
false
.
- possible values:
-
completeSets whether the completed class should be set or not. If it's set to
true
, a style class (defined in thecompletedClass
setting) will be added to the clicked link.- possible values:
true
|false
. - default value:
true
.
- possible values:
-
completedClassSets the style class to be added to the clicked language's link when the translation is completed.
- possible values: a style class string.
- default values:
"translator-completed-left"
.
-
containerClassSets the style class to be added to the translator's container.
- possible values: a style class string.
- default values:
"translator-container"
.
-
containerTemplateSets the container's template. New templates can be created if the provided one doesn't fit the web page requirements. Requires good HTML and CSS knowledge.
- possible values: any valid HTML code.
- default value:
'{{ sub_container }}'
.
-
cookieSets whether the selected language should be remembered (in a cookie) after a page refresh or not.
- possible values:
true
|false
. - default value:
true
.
- possible values:
-
cookiePersistencySets whether the
cookie
should be kept after the visitor's browser is closed or not.- possible values:
true
|false
. - default value:
true
.
- possible values:
-
customLanguagesSets custom languages. It provides a way to customize languages. After set, the new custom code should be added to the
languages
setting.
Every custom code must include two parts separated by an underscore:
1. Language code
2. An arbitrary custom code
Custom flags should be added to the flags folder. Flags can be downloaded here.- possible values: object of languages. For instance:
{ "ARGENTINIAN": "es_ar" }
. Then, include the new code in thelanguages
setting:["es_ar", "fr", "de"]
. - default value:
empty
.
- possible values: object of languages. For instance:
-
customLanguageSelectorClassSets the style class used to identify custom languages. This is for internal use and can be used to apply custom styles to the custom languages.
- possible values: a style class string.
- default values:
"translator-custom-language-"
.
-
excludeSelectorSelect those elements to NOT be translated. In jQuery format. For more info, check the jQuery selector guide.
- possible values: a valid jQuery selector string.
- default values:
".do-not-translate-me"
.
-
flagTemplateSets the language's flag template. New templates can be created if the provided one doesn't fit the web page requirements. Requires good HTML and CSS knowledge.
- possible values: any valid HTML code.
- default value:
'<img src="{{ src }}" alt="{{ name }}" />'
.
-
flagsSets whether the languages flags should be displayed or not.
- possible values:
true
|false
. - default value:
true
.
- possible values:
-
flagsAndNamesClassAdds a style class to the translator's main container when is showing languages flags and names.
- possible values: a style class string.
- default values:
"translator-flags-and-names"
.
-
flagsAndShortNamesClassAdds a style class to the translator's main container when is showing languages flags and short names.
- possible values: a style class string.
- default values:
"translator-flags-and-short-names"
.
-
flagsClassAdds a style class to the translator's main container when is showing only languages flags.
- possible values: a style class string.
- default values:
"translator-flags"
.
-
flagsFolderSets the flags folder.
- possible values: a front end folder path.
- default value:
images/
.
-
fromSets the source language. Check all the available languages in the languages guide.
- possible values: a language code name.
- default value:
en
.
-
hiddenClassSets the style class used to hide elements.
- possible values: a style class string.
- default values:
"translator-hidden"
.
-
idSets the internal
id
unique value. If two or more translators are being placed in the same web page, and all have the sameid
, then theirids
will be renamed toid-<translators count>
.
It's also could be used for custom styling purposes, since the translator id will be placed in the container's class attribute:
<div class="translator translator-container <id> translator-names">
- possible values: a string.
- default value:
"translator-jquery"
.
-
languageSelectorClassSets the style class used to identify the selected language. The language code will be concatenated:
<a class="translator-language-en" title="English" href="javascript:;"><img alt="English" src="../translator/images/English.gif"><span>English</span></a>
- possible values: a style class string.
- default value:
"translator-language-"
.
-
languagesSets the available languages. They will be rendered in the same order as they are written.
Check all the available languages in the languages guide.- possible values: array of languages code names. For instance:
["en", "es", "fr", "de"]
. - default values:
["en", "es", "fr", "de", "da", "ja", "hi", "it"]
.
- possible values: array of languages code names. For instance:
-
linkTemplateSets the language's link template. New templates can be created if the provided one doesn't fit the web page requirements. Requires good HTML and CSS knowledge.
- possible values: any valid HTML code.
- default value:
'<td><a href="javascript:;" title="{{ name }}" class="{{ language_selector_class }}">{{ content }}</a></td>'
.
-
linksContainerTemplateSets the languages links container template. New templates can be created if the provided one doesn't fit the web page requirements. Requires good HTML and CSS knowledge.
- possible values: any valid HTML code.
- default value:
'<div class="{{ sub_container_class }}"><table border="0" cellspacing="0" cellpadding="0"><tbody><tr>{{ content }}</tr></tbody></table></div>'
.
-
loadingSets whether the loading class should be set or not. If it's set to
true
, a style class (defined in theloadingClass
setting) will be added to the clicked language's link.- possible values:
true
|false
. - default value:
true
.
- possible values:
-
loadingClassSets the style class to be added to the clicked language's link while the translation takes place.
- possible values: a style class string.
- default values:
"translator-loading-left"
.
-
localStorageSets whether the translations should be stored in the visitor's browser to speed up the plugin, or not. This feature is available on modern browsers only, it won't cause any impact on old browsers. However, it forces the visitor's browser to use an extra amount of memory, therefore, it might slow it down depending on how many translations are being stored.
- possible values:
true
|false
. - default value:
false
.
- possible values:
-
localStorageExpiresSets an expiration period for the stored translations, in days.
- possible values: a positive integer number.
- default value:
30
.
-
nameTemplateSets the language's name template. New templates can be created if the provided one doesn't fit the web page requirements. Requires good HTML and CSS knowledge.
- possible values: any valid HTML code.
- default value:
'<span>{{ name }}</span>'
.
-
namesSets whether the languages names should be displayed or not.
- possible values:
true
|false
. - default value:
true
.
- possible values:
-
namesClassAdds a style class to the translator's main container when is showing only languages names.
- possible values: a style class string.
- default values:
"translator-names"
.
-
onCompleteSets a callback function that runs when the translation is completed. Receives seven arguments:
filtered_elements, translation, source, from, to, options, restore
.
The function must be defined before the initializating of the translator.- possible values: a JavaScript function.
- default value:
function(filtered_elements, translation, source, from, to, options, restore) {}
.
-
onInitializeSets a callback function that runs when the translator is being initialized.
The function must be defined before the initializating of the translator.- possible values: a JavaScript function.
- default value:
function() {}
.
-
onStartSets a callback function that runs when the translation starts. Receives five arguments:
filtered_elements, source, from, to, options
.
The function must be defined before the initializating of the translator.- possible values: a JavaScript function.
- default value:
function(filtered_elements, source, from, to, options) {}
.
-
requestsSets the maximum number of requests sent to the API at the same time. A high number of requests will translate the page faster, but might hang or even crash the internet browser.
- possible values: a positive integer number between 1 and 9.
- default value:
5
.
-
restoreSets whether the restore link should be displayed or not. By clicking the
restore
button, all the selected text will be restored to their original content, and will clear thecookie
too.
- possible values:
true
|false
. - default value:
true
.
- possible values:
-
restoreClassSets the style class to be added to the restore link.
- possible values: a style class string.
- default values:
"translator-restore"
.
-
restoreContainerClassSets the style class to be added to the restore link's container.
- possible values: a style class string.
- default values:
"translator-restore-container"
.
-
restoreTemplateSets the restore link's template. New templates can be created if the provided one doesn't fit the web page requirements. Requires good HTML and CSS knowledge.
- possible values: any valid HTML code.
- default value:
'<div class="{{ hidden_class }} {{ restore_container_class }}"><a href="javascript:;" title="Restore" class="{{ restore_class }}">Restore</a></div>'
.
-
separatorSets a separator between the languages options.
In order to optimize browser compatibility, the translator is built based on a table, so the separator will usually be a table cell unless the templates are changed.- possible values: any valid HTML code. For instance:
<td>|</td>
- default value:
empty
.
- possible values: any valid HTML code. For instance:
-
shortNamesSets whether the languages names should be in short mode or not.
- possible values:
true
|false
. - default value:
false
.
- possible values:
-
shortNamesClassAdds a style class to the translator's main container when is showing only languages short names.
- possible values: a style class string.
- default values:
"translator-short-names"
.
-
subContainerClassSets the style class to be added to the translator's sub container.
- possible values: a style class string.
- default values:
"translator-loading-left"
.
-
targetSelectorSelect those elements to be translated. In jQuery format. For more info, check the jQuery selector guide.
- possible values: a valid jQuery selector string.
- default values:
"body"
.
All these settings are defined in the
translator/javascript/jquery.translator.min.js
file. They can be modified during the initialization process, for instance:$(".translator").translator({
targetSelector: "body",
excludeSelector: ".dont-translate",
names: false,
cookie: false
});