Example 2: Mark contents as translateable with translation file

By useing the swac_lang HTML attribute you can define the content of tags and attributes as translatebale. This example shows on which tags and attributes translation is useable.


Translate in Textblock:

This is my original text. It should be replaced if i choose a translation. 


<p swac_lang="Example.myTextblock">
    This is my original text. It should be replaced if i choose a translation.
</p>

Translate in link description
Example.myLinkCaption 

<a href="#top">Example.myLinkCaption</a>

Translate in labels 

<label class="uk-form-label">Example.myLabel</label>

Translate in value attributes: 

<input type="submit" class="uk-button" value="Example.myButtonCaption">

Translate in title attributes: 

<input type="text" class="uk-input" placeholder="Example.myPlaceholder">

Translate in alt attributes:
Example.myAlt 

<img src="nonexisting.jpg" alt="Example.myAlt">

Translate in uk-tooltip attributes:
Hover over this link 

<a href="#top" uk-tooltip="Example.myTooltip">Hover over this link<a>

Translate placeholders: 

<input type="text" class="uk-input" placeholder="Example.myPlaceholder">

Translate in any attribute:
Look at the data-translated attribute 

<a href="#" swac_langattr="data-translated:Example.myDataTranslated"">Look at the data-translated attribute<a>
VIEW-Requestor 

<div id="translator_example2" swa="Translator FROM ../../../data/userinterface/translator/example1/translation_files.json"></div>
CONFIGURATION

There is no configuration needed.

DATASOURCE

The used translation_files.json defines the available translations. It contains one object for each translations. Each translation file is for one language and must contain the language code at the end of the file name.
The path is given as path from the app_root (this is configured in the configuration.js or automatically detected)

English translation file

German translation file