Difference between revisions of "Forms Language Bar"

From All n One's bxp software Wixi

Jump to: navigation, search
(Initial form)
 
Line 73: Line 73:
  
  
[[File:languagebar_002.png|800xpx]]
+
[[File:Languagebar_002.png|800xpx]]
  
  
Line 94: Line 94:
  
  
[[File:languagebar_003.png|800xpx]]
+
[[File:Languagebar_003.png|800xpx]]
  
  
Line 164: Line 164:
 
Now if you click the different buttons you get the following type screen.
 
Now if you click the different buttons you get the following type screen.
  
[[File:languagebar_004.png|800xpx]]
+
[[File:Languagebar_004.png|800xpx]]
  
  
Line 368: Line 368:
  
  
[[File:languagebar_005.png|800xpx]]
+
[[File:Languagebar_005.png|800xpx]]
  
  
Line 539: Line 539:
  
  
[[File:languagebar_006.png|800xpx]]
+
[[File:Languagebar_006.png|800xpx]]
  
  

Latest revision as of 03:38, 2 January 2016

1 Overview

It is possible within a form to include language changing options. This article demonstrates how that can be built.


2 Initial form

Firstly build a form. This can be done numerous ways. For this example a simple one was built with the following questions in the following order.


Main Menu > Form Management > Form Primary Management > Form - Create


  • Name: Language Demonstration
  • Type: Blended


Then

  • Review the build
  • Edit the first section group and change the name to "Welcome to the Language Demonstration form"
  • Add a generic area
  • Add a Complex - Title and give it the name "Can I ask your name please?"
  • Add a Simple - Text Box and give it the name "Can I get a phone number please?"
  • Add a Simple - List Menu and give it the name "What is your favourite colour?"
  • Add three options to the drop down list "Red" "Green" and "Blue"
  • Edit the Vertical Delivery Options and after the default "How can I help?" add "
    "
  • Edit the title block and add to the notes "
    "
  • Edit the phone number question and add to the notes "
    "
  • Edit the list menu quetsion and add to the notes "
    "


This sets up all the elements which are going to be managed. The form should look like


Languagebar 001.png

3 Building a bar

Next bit is to build a bar which will represent the language changing buttons.


Each language has its own button. Each button has a unique name. We style it with bxp default styling. We set the width of the button so the total of all buttons is slightly less than 100% so that all the buttons fit in one row. We then add a JavaScript function which will change the language appropriately.


The below example puts each button on a separate line for clarity.


<div style="width:100%;text-align:center;">
<input type="button" name="btnEnglish" id="btnEnglish" value="English" class="cssMaster_Button" style="width:14%;" onclick="fn_LanguageChange('EN');" />
<input type="button" name="btnIrish" id="btnIrish" value="Gaelige" class="cssMaster_Button" style="width:14%;" onclick="fn_LanguageChange('IE');" />
<input type="button" name="btnFrench" id="btnFrench" value="Français" class="cssMaster_Button" style="width:14%;" onclick="fn_LanguageChange('FR');" />
<input type="button" name="btnSpanish" id="btnSpanish" value="Español" class="cssMaster_Button" style="width:14%;" onclick="fn_LanguageChange('ES');" />
<input type="button" name="btnGerman" id="btnGerman" value="Deutsche" class="cssMaster_Button" style="width:14%;" onclick="fn_LanguageChange('DE');" />
<input type="button" name="btnPortugese" id="btnPortugese" value="Portugueses" class="cssMaster_Button" style="width:14%;" onclick="fn_LanguageChange('PT');" />
<input type="button" name="btnPolish" id="btnPolish" value="Polskie" class="cssMaster_Button" style="width:14%;" onclick="fn_LanguageChange('PL');" />
</div>


In the system, this is just one long continuous string. Put it into the "notes" of the Language Bar generic area.

<div style="text-align:center;"><input type="button" name="btnEnglish" id="btnEnglish" value="English" class="cssMaster_Button" style="width:14%;" onclick="fn_LanguageChange('EN');" /><input type="button" name="btnIrish" id="btnIrish" value="Gaelige" class="cssMaster_Button" style="width:14%;" onclick="fn_LanguageChange('IE');" /><input type="button" name="btnFrench" id="btnFrench" value="Français" class="cssMaster_Button" style="width:14%;" onclick="fn_LanguageChange('FR');" /><input type="button" name="btnSpanish" id="btnSpanish" value="Español" class="cssMaster_Button" style="width:14%;" onclick="fn_LanguageChange('ES');" /><input type="button" name="btnGerman" id="btnGerman" value="Deutsche" class="cssMaster_Button" style="width:14%;" onclick="fn_LanguageChange('DE');" /><input type="button" name="btnPortugese" id="btnPortugese" value="Portugueses" class="cssMaster_Button" style="width:14%;" onclick="fn_LanguageChange('PT');" /><input type="button" name="btnPolish" id="btnPolish" value="Polskie" class="cssMaster_Button" style="width:14%;" onclick="fn_LanguageChange('PL');" /></div>


With the buttons in place the form should look like.


Languagebar 002.png


If you want to make it prettier, you can use flag buttons instead. These images came from the team at http://www.icons-land.com. The images also get a border = 0 so that the link doesn't put an extra border around the image.


<div style="width:100%;text-align:center;">
<a href="#" onclick="fn_LanguageChange('US');" title="English" ><img src="https://ww3.allnone.ie/images/flags/US.png" height="64" width="64" border="0" alt="English" /></a>
<a href="#" onclick="fn_LanguageChange('IE');" title="Gaelige" ><img src="https://ww3.allnone.ie/images/flags/IE.png" height="64" width="64" border="0" alt="Gaelige" /></a>
<a href="#" onclick="fn_LanguageChange('FR');" title="Français" ><img src="https://ww3.allnone.ie/images/flags/FR.png" height="64" width="64" border="0" alt="Français" /></a>
<a href="#" onclick="fn_LanguageChange('ES');" title="Español" ><img src="https://ww3.allnone.ie/images/flags/ES.png" height="64" width="64" border="0" alt="Español" /></a>
<a href="#" onclick="fn_LanguageChange('DE');" title="Deutsche" ><img src="https://ww3.allnone.ie/images/flags/DE.png" height="64" width="64" border="0" alt="Deutsche" /></a>
<a href="#" onclick="fn_LanguageChange('PT');" title="Portugueses" ><img src="https://ww3.allnone.ie/images/flags/PT.png" height="64" width="64" border="0" alt="Portugueses" /></a>
<a href="#" onclick="fn_LanguageChange('PL');" title="Polskie" ><img src="https://ww3.allnone.ie/images/flags/PL.png" height="64" width="64" border="0" alt="Polskie" /></a>
</div>

It should end up looking like


Languagebar 003.png


4 The language function

The next part is to put in place the JavaScript function to do the languages. This goes into the Vertical Delivery Options, in the Opening Script, just under the div you added earlier.


<script type="text/javascript" language="javascript">
function fn_LanguageChange(strLanguage){
	
	//List out all the items to be changed
	var strOpening = document.getElementById('strOpening');
	var strName = document.getElementById('strName');
	var strNumber = document.getElementById('strNumber');
	var strColour = document.getElementById('strColour');

	//Now we adapt the strings for each language
	if (strLanguage == 'US'){
		strOpening.innerHTML 	= 'a';
		strName.innerHTML 	= 'a';
		strNumber.innerHTML 	= 'a';
		strColour.innerHTML 	= 'a';
	}
	else if (strLanguage == 'IE'){
		strOpening.innerHTML 	= 'b';
		strName.innerHTML 	= 'b';
		strNumber.innerHTML 	= 'b';
		strColour.innerHTML 	= 'b';
	}
	else if (strLanguage == 'FR'){
		strOpening.innerHTML 	= 'c';
		strName.innerHTML 	= 'c';
		strNumber.innerHTML 	= 'c';
		strColour.innerHTML 	= 'c';
	}
	else if (strLanguage == 'ES'){
		strOpening.innerHTML 	= 'd';
		strName.innerHTML 	= 'd';
		strNumber.innerHTML 	= 'd';
		strColour.innerHTML 	= 'd';
	}
	else if (strLanguage == 'DE'){
		strOpening.innerHTML 	= 'e';
		strName.innerHTML 	= 'e';
		strNumber.innerHTML 	= 'e';
		strColour.innerHTML 	= 'e';
	}
	else if (strLanguage == 'PT'){
		strOpening.innerHTML 	= 'f';
		strName.innerHTML 	= 'f';
		strNumber.innerHTML 	= 'f';
		strColour.innerHTML 	= 'f';
	}
	else if (strLanguage == 'PL'){
		strOpening.innerHTML 	= 'g';
		strName.innerHTML 	= 'g';
		strNumber.innerHTML 	= 'g';
		strColour.innerHTML 	= 'g';
	}
}
</script>


Now if you click the different buttons you get the following type screen.

Languagebar 004.png


5 Tweaking the script

Now that you can see how your language bar is going to work, we tweak each of the areas.


5.1 Opening script

Move the div around the opening script instead of being after it.

<div id='strOpening'>Good --period--.  My name is --firstname--.  How can I help?</div><br />


On the page is a hidden variable called strBEDisplayed_Username.


There is also another one called dteCCL_782_StartDateTime. From the StartDateTime, we can work out the period.


5.2 Questions

5.2.1 Can I ask your name please

Move the div around the Question, instead of in the Notes.

You'll notice the field headings are in English. Right click on one of them and choose "Inspect Element". This will give you an Id for the td.

E.g. our form is 782, so we get.

<tr>
	<td width="13%" id="objHeading_strCDA_782_field_0_2">Title</td>
	<td width="28%" id="objHeading_strCDA_782_field_1_2">Firstname</td>
	<td width="13%" id="objHeading_strCDA_782_field_2_2">Initial</td>
	<td width="28%" id="objHeading_strCDA_782_field_3_2">Surname</td>
</tr>

In our JavaScript we add language translation for each of these items as well.

Do exactly the same thing with the "Find Similar" button, which turns out to be btnFind_SimilarstrCDA_782_field_1_2


5.2.2 Can I get a phone number please?

Simply move the div into the Question


5.2.3 What is your favourite colour?

Again move the div into the Question. However as this is a drop down list we want the values to appear to the user in their native language, but the data in the background to be stored in English for consistency.


Find the ID of the question, which in this case is strCDA_782_field_0_7. You do this by editing the question and at the top of the screen it will let you know what the element Id is.


For each item, we wipe the drop down list and put back in the options in the appropriate language. You can see below how this is done.


5.3 Putting it together

Now we can put all the elements in place and test that they change.

<script type="text/javascript" language="javascript">
function fn_LanguageChange(strLanguage){
	
	//Page variables.
	var strUsername = document.getElementById('strBEDisplayed_Username').value;
	
	//Other page elements
	var strName_Title = document.getElementById('objHeading_strCDA_782_field_0_2');
	var strName_Firstname = document.getElementById('objHeading_strCDA_782_field_1_2');
	var strName_Initial = document.getElementById('objHeading_strCDA_782_field_2_2');
	var strName_Surname = document.getElementById('objHeading_strCDA_782_field_3_2');
	var strButton_Similar = document.getElementById('btnFind_SimilarstrCDA_782_field_1_2');
		var objColourList = document.getElementById('strCDA_782_field_0_7');
	
	//List out all the items to be changed
	var strOpening = document.getElementById('strOpening');
	var strName = document.getElementById('strName');
	var strNumber = document.getElementById('strNumber');
	var strColour = document.getElementById('strColour');

	//Now we adapt the strings for each language
	if (strLanguage == 'US'){
		strButton_Similar.value 			= 'a';
		strName_Title.innerHTML 			= 'a';
		strName_Firstname.innerHTML 			= 'a';
		strName_Initial.innerHTML 			= 'a';
		strName_Surname.innerHTML 			= 'a';
		strOpening.innerHTML 				= 'a';
		strName.innerHTML 				= 'a';
		strNumber.innerHTML 				= 'a';
		strColour.innerHTML 				= 'a';
		objColourList.options.length 			= 0;
		objColourList.options[objColourList.length] 	= new Option('''', '''');
		objColourList.options[objColourList.length] 	= new Option('a text', 'a value');
	}
	else if (strLanguage == 'IE'){
		strButton_Similar.value 			= 'b';
		strName_Title.innerHTML 			= 'b';
		strName_Firstname.innerHTML 			= 'b';
		strName_Initial.innerHTML 			= 'b';
		strName_Surname.innerHTML 			= 'b';
		strOpening.innerHTML 				= 'b';
		strName.innerHTML 				= 'b';
		strNumber.innerHTML 				= 'b';
		strColour.innerHTML 				= 'b';
		objColourList.options.length 			= 0;
		objColourList.options[objColourList.length] 	= new Option('''', '''');
		objColourList.options[objColourList.length] 	= new Option('b text', 'b value');
	}
	else if (strLanguage == 'FR'){
		strButton_Similar.value 			= 'c';
		strName_Title.innerHTML 			= 'c';
		strName_Firstname.innerHTML 			= 'c';
		strName_Initial.innerHTML 			= 'c';
		strName_Surname.innerHTML 			= 'c';
		strOpening.innerHTML 				= 'c';
		strName.innerHTML 				= 'c';
		strNumber.innerHTML 				= 'c';
		strColour.innerHTML 				= 'c';
		objColourList.options.length 			= 0;
		objColourList.options[objColourList.length] 	= new Option('''', '''');
		objColourList.options[objColourList.length] 	= new Option('c text', 'c value');
	}
	else if (strLanguage == 'ES'){
		strButton_Similar.value 			= 'd';
		strName_Title.innerHTML 			= 'd';
		strName_Firstname.innerHTML 			= 'd';
		strName_Initial.innerHTML 			= 'd';
		strName_Surname.innerHTML 			= 'd';
		strOpening.innerHTML 				= 'd';
		strName.innerHTML 				= 'd';
		strNumber.innerHTML 				= 'd';
		strColour.innerHTML 				= 'd';
		objColourList.options.length 			= 0;
		objColourList.options[objColourList.length] 	= new Option('''', '''');
		objColourList.options[objColourList.length] 	= new Option('d text', 'd value');
	}
	else if (strLanguage == 'DE'){
		strButton_Similar.value 			= 'e';
		strName_Title.innerHTML 			= 'e';
		strName_Firstname.innerHTML 			= 'e';
		strName_Initial.innerHTML 			= 'e';
		strName_Surname.innerHTML 			= 'e';
		strOpening.innerHTML 				= 'e';
		strName.innerHTML 				= 'e';
		strNumber.innerHTML 				= 'e';
		strColour.innerHTML 				= 'e';
		objColourList.options.length 			= 0;
		objColourList.options[objColourList.length] 	= new Option('''', '''');
		objColourList.options[objColourList.length] 	= new Option('e text', 'e value');
	}
	else if (strLanguage == 'PT'){
		strButton_Similar.value 			= 'f';
		strName_Title.innerHTML 			= 'f';
		strName_Firstname.innerHTML 			= 'f';
		strName_Initial.innerHTML 			= 'f';
		strName_Surname.innerHTML 			= 'f';
		strOpening.innerHTML 				= 'f';
		strName.innerHTML 				= 'f';
		strNumber.innerHTML 				= 'f';
		strColour.innerHTML 				= 'f';
		objColourList.options.length 			= 0;
		objColourList.options[objColourList.length] 	= new Option('''', '''');
		objColourList.options[objColourList.length] 	= new Option('f text', 'f value');
	}
	else if (strLanguage == 'PL'){
		strButton_Similar.value 			= 'g';
		strName_Title.innerHTML 			= 'g';
		strName_Firstname.innerHTML 			= 'g';
		strName_Initial.innerHTML 			= 'g';
		strName_Surname.innerHTML 			= 'g';
		strOpening.innerHTML 				= 'g';
		strName.innerHTML 				= 'g';
		strNumber.innerHTML 				= 'g';
		strColour.innerHTML 				= 'g';
		objColourList.options.length 			= 0;
		objColourList.options[objColourList.length] 	= new Option('''', '''');
		objColourList.options[objColourList.length] 	= new Option('g text', 'g value');
	}
}
</script>

When you test you should be able to confirm the following happens.


Languagebar 005.png


5.4 Other parts

There are other functional elements on the page but all of them have Ids which can be manipulated, or else can have a div put around them to allow them to be changed.


If you have further questions please email support@bxpsoftware.com for further details.


6 Translations

Once you are absolutely positive that you have all the functional elements you want to control changing (as demonstrated above), then and only then should you send out to get your strings translated.


It is important that your functional review confirm all the elements that need to change before you get your strings.


To translate the items, you can use cool tools like Google Translate, or you can send the file out to a professional company to do the translations for you.


So the final Opening Instructions will look like

<div id='strOpening'>Good --period--.  My name is --firstname--.  How can I help?</div><br /> 

<script type="text/javascript" language="javascript">
function fn_LanguageChange(strLanguage){
	
	//Page variables.
	var strUsername = document.getElementById('strBEDisplayed_Username').value;
	
	//Other page elements
	var strName_Title = document.getElementById('objHeading_strCDA_782_field_0_2');
	var strName_Firstname = document.getElementById('objHeading_strCDA_782_field_1_2');
	var strName_Initial = document.getElementById('objHeading_strCDA_782_field_2_2');
	var strName_Surname = document.getElementById('objHeading_strCDA_782_field_3_2');
	var strButton_Similar = document.getElementById('btnFind_SimilarstrCDA_782_field_1_2');
	var objColourList = document.getElementById('strCDA_782_field_0_7');
	
	//List out all the items to be changed
	var strOpening = document.getElementById('strOpening');
	var strName = document.getElementById('strName');
	var strNumber = document.getElementById('strNumber');
	var strColour = document.getElementById('strColour');

	//Now we adapt the strings for each language
	if (strLanguage == 'US'){
		strButton_Similar.value 			= 'Find Similar';
		strName_Title.innerHTML 			= 'Title';
		strName_Firstname.innerHTML 			= 'Firstname';
		strName_Initial.innerHTML 			= 'Initial';
		strName_Surname.innerHTML 			= 'Surname';
		strOpening.innerHTML 				= 'Good morning. My name is Admin. How can I help?';
		strName.innerHTML 				= 'Can I ask your name please?';
		strNumber.innerHTML 				= 'Can I get a phone number please?';
		strColour.innerHTML 				= 'What is your favourite colour?';
		objColourList.options.length 			= 0;
		objColourList.options[objColourList.length] 	= new Option('''', '''');
		objColourList.options[objColourList.length] 	= new Option('Red', 'Red');
		objColourList.options[objColourList.length] 	= new Option('Green', 'Green');
		objColourList.options[objColourList.length] 	= new Option('Blue', 'Blue');
	}
	else if (strLanguage == 'IE'){
		strButton_Similar.value 			= 'Comhchosúla';
		strName_Title.innerHTML 			= 'Teideal';
		strName_Firstname.innerHTML 			= 'Céadainm';
		strName_Initial.innerHTML 			= 'Ainm lár';
		strName_Surname.innerHTML 			= 'Sloinne';
		strOpening.innerHTML 				= 'Dea-maidin. Is é mo ainm Riarachán. Conas is féidir liom cabhrú?';
		strName.innerHTML 				= 'An féidir liom a iarraidh ar do ainm le do thoil?';
		strNumber.innerHTML 				= 'An féidir liom a uimhir theileafóin a fháil le do thoil?';
		strColour.innerHTML 				= 'Cad é do dath is fearr leat?';
		objColourList.options.length 			= 0;
		objColourList.options[objColourList.length] 	= new Option('''', '''');
		objColourList.options[objColourList.length] 	= new Option('Dearg', 'Red');
		objColourList.options[objColourList.length] 	= new Option('Glas', 'Green');
		objColourList.options[objColourList.length] 	= new Option('Gorm', 'Blue');
	}
	else if (strLanguage == 'FR'){
		strButton_Similar.value 			= 'Similaire';
		strName_Title.innerHTML 			= 'Titre';
		strName_Firstname.innerHTML 			= 'Prénom';
		strName_Initial.innerHTML 			= 'Initiale';
		strName_Surname.innerHTML 			= 'Nom de famille';
		strOpening.innerHTML 				= 'Bonjour. Mon nom est Admin. Comment puis-je aider?';
		strName.innerHTML 				= 'Puis-je vous demander votre nom s\'il vous plaît?';
		strNumber.innerHTML 				= 'Puis-je obtenir un numéro de téléphone s\'il vous plaît?';
		strColour.innerHTML 				= 'Quelle est ta couleur préférée?';
		objColourList.options.length 			= 0;
		objColourList.options[objColourList.length] 	= new Option('''', '''');
		objColourList.options[objColourList.length] 	= new Option('Rouge', 'Red');
		objColourList.options[objColourList.length] 	= new Option('Vert', 'Green');
		objColourList.options[objColourList.length] 	= new Option('Bleu', 'Blue');
	}
	else if (strLanguage == 'ES'){
		strButton_Similar.value 			= 'Similares';
		strName_Title.innerHTML 			= 'Título';
		strName_Firstname.innerHTML 			= 'Nombre de pila';
		strName_Initial.innerHTML 			= 'Inicial';
		strName_Surname.innerHTML 			= 'Apellido';
		strOpening.innerHTML 				= 'Buenos días. Mi nombre es admin. ¿Cómo puedo ayudar?';
		strName.innerHTML 				= '¿Puedo preguntarle su nombre, por favor?';
		strNumber.innerHTML 				= '¿Puedo obtener un número de teléfono por favor?';
		strColour.innerHTML 				= '¿Cuál es tu color favorito?';
		objColourList.options.length 			= 0;
		objColourList.options[objColourList.length] 	= new Option('''', '''');
		objColourList.options[objColourList.length] 	= new Option('Rojo', 'Red');
		objColourList.options[objColourList.length] 	= new Option('Verde', 'Green');
		objColourList.options[objColourList.length] 	= new Option('Azul', 'Blue');
	}
	else if (strLanguage == 'DE'){
		strButton_Similar.value 			= 'ähnliche';
		strName_Title.innerHTML 			= 'Titel';
		strName_Firstname.innerHTML 			= 'Vorname';
		strName_Initial.innerHTML 			= 'Initiale';
		strName_Surname.innerHTML 			= 'Nachname';
		strOpening.innerHTML 				= 'Guten Morgen. Mein Name ist Admin. Wie kann ich helfen?';
		strName.innerHTML 				= 'Kann ich Ihren Namen bitte?';
		strNumber.innerHTML 				= 'Kann ich eine Telefonnummer bitte?';
		strColour.innerHTML 				= 'Was ist Ihre Lieblingsfarbe?';
		objColourList.options.length 			= 0;
		objColourList.options[objColourList.length] 	= new Option('''', '''');
		objColourList.options[objColourList.length] 	= new Option('Rote', 'Red');
		objColourList.options[objColourList.length] 	= new Option('Grün', 'Green');
		objColourList.options[objColourList.length] 	= new Option('Blau', 'Blue');
	}
	else if (strLanguage == 'PT'){
		strButton_Similar.value 			= 'Similar';
		strName_Title.innerHTML 			= 'Título';
		strName_Firstname.innerHTML 			= 'Primeiro';
		strName_Initial.innerHTML 			= 'Inicial';
		strName_Surname.innerHTML 			= 'Sobrenome';
		strOpening.innerHTML 				= 'Bom Dia. Meu nome é administrador. Como posso ajudar?';
		strName.innerHTML 				= 'Posso perguntar seu nome, por favor?';
		strNumber.innerHTML 				= 'Posso obter um número de telefone, por favor?';
		strColour.innerHTML 				= 'Qual é a sua cor favorita?';
		objColourList.options.length 			= 0;
		objColourList.options[objColourList.length] 	= new Option('''', '''');
		objColourList.options[objColourList.length] 	= new Option('Vermelho', 'Red');
		objColourList.options[objColourList.length] 	= new Option('Verde', 'Green');
		objColourList.options[objColourList.length] 	= new Option('Azul', 'Blue');
	}
	else if (strLanguage == 'PL'){
		strButton_Similar.value 			= 'Podobne';
		strName_Title.innerHTML 			= 'Tytuł';
		strName_Firstname.innerHTML 			= 'Imię';
		strName_Initial.innerHTML 			= 'Początkowy';
		strName_Surname.innerHTML 			= 'Nazwisko';
		strOpening.innerHTML 				= 'Dzień dobry. Nazywam się Admin. Jak mogę pomóc?';
		strName.innerHTML 				= 'Mogę zadać swoje nazwisko proszę?';
		strNumber.innerHTML 				= 'Czy mogę otrzymać numer telefonu należy?';
		strColour.innerHTML 				= 'Jaki jest Twój ulubiony kolor?';
		objColourList.options.length 			= 0;
		objColourList.options[objColourList.length] 	= new Option('''', '''');
		objColourList.options[objColourList.length] 	= new Option('Czerwony', 'Red');
		objColourList.options[objColourList.length] 	= new Option('Zielony', 'Green');
		objColourList.options[objColourList.length] 	= new Option('Niebieski', 'Blue');
	}
}
</script>


Which should give you a final output of


Languagebar 006.png


7 Next Steps

So if you'd like to know more about how to make multilingual scripts and manage systems in numerous languages please get in touch by email at support@bxpsoftware.com