---
title: "Localization of HTML5/Flash Uploader"
canonical: https://www.aurigma.com/docs/us8/localization-iuf.htm
product: "Upload Suite 8"
---

# Localization of HTML5/Flash Uploader

Supported technologies: ![Adobe Flash](https://www.aurigma.com/docs/us8/icons/flash.png)![HTML 5](https://www.aurigma.com/docs/us8/icons/html5.png)
 
To make HTML5/Flash Uploader usage easier for non-English users, we provide a possibility to change all text that can ever be displayed by the control. Each text label, button caption, or error message can be changed using the appropriate class property.

Let us examine this possibility by the example of solving the following tasks:

- Simple translation of the interface into a single language.
- Implementing multilingual interface.

## Translating Interface into Single Language
 
This task implies that HTML5/Flash Uploader user interface is translated into a single language. Here you can use the following ways:
 
1. Simply specify each property when initializing an **ImageUploaderFlash** object.
2. Use predefined localizations shipped with Upload Suite SDK.
3. Use your own localization scripts.

### Translating Interface Manually
 
In the first case, necessary text properties with translation are added just like any other HTML5/Flash Uploader property. This way is the most suitable if you use default localization and want to modify some captions and messages.
 ```aspx-cs
<aur:ImageUploaderFlash ID="Uploader1" runat="server"
    CancelUploadButtonText="Stop"
    UploadButtonText="Send">
    <Messages PreviewNotAvailable="Preview is not available" />
</aur:ImageUploaderFlash>
``` ```
$uploader = new ImageUploaderFlash("Uploader1");
$uploader->setCancelUploadButtonText("Stop");
$uploader->setUploadButtonText("Send");
$uploader->getMessages()->setPreviewNotAvailable("Preview is not available");
``` ```
var fu = $au.imageUploaderFlash({
    cancelUploadButtonText: 'Stop',
    uploadButtonText: 'Send',
    messages:{
        previewNotAvailable: 'Preview is not available'
    }
});
``` 
### Using Predefined Localizations
 
The second way allows you to translate HTML5/Flash Uploader interface using just one line of code. All you need is to specify one of the available localizations via the ImageUploaderFlash.Language[Language (ASP.NET)](https://www.aurigma.com/docs/us8/FH_P_Aurigma_ImageUploaderFlash_ImageUploaderFlash_Language.htm.md)[Language (PHP)](https://www.aurigma.com/docs/us8/FH_P_P_ImageUploaderFlash_Language.htm.md) property. However, this property is supported only in HTML5/Flash Uploader ASP.NET and HTML5/Flash Uploader PHP.
 ```aspx-cs
<aur:ImageUploaderFlash ID="Uploader1" runat="server" 
    Language="English" />
``` ```
$uploader = new ImageUploaderFlash("Uploader1");
$uploader->setLanguage("en");
``` 
In HTML5/Flash Uploader JavaScript you should use `aurigma.imageuploaderflash.X_localization.js` (where *X* is a language code) files which come with HTML5/Flash Uploader. These files are located in the `/Scripts` folder and contain all the text properties translated to the corresponding language. Thus, to translate HTML5/Flash Uploader interface do the following:
 
1. Link the `aurigma.imageuploaderflash.en_localization.js` file with the page where you configure an [imageUploaderFlash](https://www.aurigma.com/docs/us8/FH_T_J_$au_imageUploaderFlash.htm.md) object.
2. Pass the **$au.language.en** object defined in this file to the [imageUploaderFlash.set(Object)](https://www.aurigma.com/docs/us8/FH_M_J_$au_imageUploaderFlash_set_1_8419e710.htm.md) method.

 ```
<script type="text/javascript" src="Scripts/aurigma.imageuploaderflash.js">  </script>
<script type="text/javascript" src="Scripts/aurigma.imageuploaderflash.en_localization.js">  </script>
<script type="text/javascript">
var fu = $au.imageUploaderFlash({
    // HTML5/Flash Uploader configuration
});
fu.set($au.language.en);
fu.writeHtml();
</script>
``` 
You can use the `aurigma.imageuploaderflash.en_localization.js` file as template to create your own localization script.
 
### Using Custom Localization Scripts
 
As it was mentioned above, HTML5/Flash Uploader JavaScript comes with predefined localization scripts. Each script defines a JavaScript object containing all the HTML5/Flash Uploader text properties translated to a particular language. The same approach can be easily used to create your custom localization scripts.
 
Suppose, you want to translate HTML5/Flash Uploader user interface into German. Then you need to do the following:
 
1. Create the `aurigma.imageuploaderflash.de_localization.js` file in the `/Scripts` folder of your application (where the `aurigma.imageuploaderflash.js` file resides).
 
**Note** 
Localization file should be saved in UTF-8.
2. Declare the **$au.language.de** object and add all the HTML5/Flash Uploader text properties.
 
    Here is a simplified example of this file:
 ```
    (function(window, undefined) {
    
    // Define global Aurigma.ImageUploaderFlash namespace
    var AU = (window.Aurigma || (window.Aurigma = { __namespace: true })) &&
        (window.Aurigma.ImageUploaderFlash || (window.Aurigma.ImageUploaderFlash = { __namespace: true }));
    
    AU.language || (AU.language = { __namespace: true });
    
    // German
    window.de_localization = AU.language.de = {
        cancelUploadButtonText: 'Anhalten',
        uploadButtonText: 'Speichern',
        messages:{
            previewNotAvailable: 'Vorschau ist nicht verfugbar'
        }};
    })(window);
    ```
3. Link this file with the page where you configure an **imageUploaderFlash** object.
4. Pass the **$au.language.de** object to the **imageUploaderFlash.set(Object)** method.
 
    Here is a simplified example of this file:
 ```
    <script type="text/javascript" src="Scripts/aurigma.imageuploaderflash.js">  </script>
    <script type="text/javascript" src="Scripts/aurigma.imageuploaderflash.de_localization.js">  </script>
    <script type="text/javascript">
    var fu = $au.imageUploaderFlash({
        // HTML5/Flash Uploader configuration
    });
    fu.set($au.language.de);
    fu.writeHtml();
    </script>
    ```

The main advantage of this approach is that it allows you to keep HTML5/Flash Uploader text parameters separately from its configuration.

## Implementing Multilingual Interface
 
The idea is the following: add a list of links containing available languages and translate HTML5/Flash Uploader GUI to the currently selected language. To implement this, insert links for languages you need. Each link should refer to the same page and add the `lang` parameter containing the selected language code. Then when the page is loading, just parse the `lang` parameter and configure HTML5/Flash Uploader to use the corresponding localization.
 ```aspx-cs
<form id="form1" runat="server">
    <ul>
        <li>
            <asp:LinkButton ID="enLangLinkButton" runat="server" OnClick="langLinkButton_Click">
                English
            </asp:LinkButton>
        </li>
        <li>
            <asp:LinkButton ID="ruLangLinkButton" runat="server" OnClick="langLinkButton_Click">
                Russian
            </asp:LinkButton>
        </li>
    </ul>
    <aur:ImageUploaderFlash ID="Uploader1" runat="server" />
</form>
``` ```csharp
protected void langLinkButton_Click(object sender, EventArgs e)
{
    if (sender == enLangLinkButton)
    {
        Uploader1.Language = Aurigma.ImageUploaderFlash.Language.English;
    }
    else if (sender == ruLangLinkButton)
    {
        Uploader1.Language = Aurigma.ImageUploaderFlash.Language.Russian;
    }
}
``` ```
<ul>
    <li><a href="?lang=en" id="lang_en">English</a></li>
    <li><a href="?lang=ru" id="lang_ru">Russian</a></li>
</ul>
<?php
require_once "ImageUploaderFlashPHP/Uploader.class.php";
$uploader = new ImageUploaderFlash('Uploader1');

// Set language
if (isset($_GET['lang'])) {
    switch ($_GET['lang']) {
        case 'en':
            $uploader->setLanguage('en');
            break;
        case 'ru':
            $uploader->setLanguage('ru');
            break;
    }
}

$uploader->render();
?>
``` ```
<script type="text/javascript" src="Scripts/aurigma.imageuploaderflash.js">  </script>
<script type="text/javascript" src="Scripts/aurigma.imageuploaderflash.en_localization.js">  </script>
<script type="text/javascript" src="Scripts/aurigma.imageuploaderflash.ru_localization.js">  </script>
<ul>
    <li><a href="?lang=en" id="lang_en">English</a></li>
    <li><a href="?lang=ru" id="lang_ru">Russian</a></li>
</ul>
<script type="text/javascript">
var fu = $au.imageUploaderFlash({
    id: 'Uploader1',
    // HTML5/Flash Uploader configuration
});

// Apply localization
var lang = /[?&]lang=(\w{2})/.exec(location.search || location.href);
if (lang) {
    lang = lang[1];
}
      
var langObject = window['$au.language.' + lang];
if (langObject) {
    fu.set(langObject);
}

fu.writeHtml();
</script>
```

## See Also
 
### Reference
 
- ImageUploaderFlash Class[ImageUploaderFlash (ASP.NET)](https://www.aurigma.com/docs/us8/FH_T_Aurigma_ImageUploaderFlash_ImageUploaderFlash.htm.md)[ImageUploaderFlash (PHP)](https://www.aurigma.com/docs/us8/FH_T_P_ImageUploaderFlash.htm.md)[imageUploaderFlash (JavaScript)](https://www.aurigma.com/docs/us8/FH_T_J_$au_imageUploaderFlash.htm.md)

### Manual
 
- [Customizing Appearance in HTML5/Flash Uploader](https://www.aurigma.com/docs/us8/customizing-appearance-iuf.htm.md)