Supporting multiple languages in ASP.NET using resource files
In this article we will see how to make your website cater to different languages. Your website can be viewed by people from different locations and based on the user location we will display our web page. This article we will focus on user's browser Language settings.
Based on the language setting in the user's web browser we will display the webpage in that language using resource files. In our article we will support three languages. English will be the default language, based on user's browser section.
In this article we will see how to make your website cater to different languages. Your website can be viewed by people from different locations and based on the user location we will display our web page. In our article we will focus on user's browser Language settings.
Based on the language setting in the user's web browser we will display the webpage in that language using resource files. In our article we will support three languages:English will be the default language, Then based on user's browser setting we are supporting Spanish and French languages.
We are going to support multiple languages in ASP.NET using resource files.
What is a resource file
A resource file contains text in a specific language. It is an xml file which contains key value pairs for each resource string. The key is unique in each resource file.
By default, based on the language setting in the user's Browser or machine asp.net accesses a resource file. If the resource file exists for the requested language asp.net uses that resource file for generating output else default resource file(English in our example) is used.
There are 2 types of resources in ASP.NET:
Local resources:
Specific to a page.
Global resources:
Shared through out the site.
About Local Resource Files:
1.It is specific to a Web Page.
2.It Used to define a webpage in a specific language.
3.Must be present in the App_LocalResources folder.
4.It uses .resx extension. For Ex: if the Page is Default.aspx, Resource file name would be Default.aspx.resx which is the default resource file used for every request unless other resource file exists for the user requested language.
5.If the user requests the page in german language, ASP.NET looks for a resource file with name:Default.aspx.de.resx, If the resource file exists it uses the file otherwise the default resource file-Default.aspx.resx is used.
Culture = Regional Language + Formatting
If culture information is also present in the page request, .Net framework formats the data as required.
We have to add culture to the resource file if we want to format the data based on the culture setting.
To name a resource file along with language and culture follow the following format:
PageName.aspx.LanguageId-CultureId.resx
For Ex: An English resource file for US culture and English language would be Default.aspx.en-us.resx
Using Visual Studio we can automatically generate default version of a local resource file which extracts the Page control elements.
Open Default.aspx page(Design) ->Tools ->Click Generate Local Resource. This creates App_LocalResources folder if not present and then creates Default.aspx.resx resource file(xml).
This resource file contains control properties and its values as shown below.
As you can see it externally specifies the property along with the control id as the key. For Ex:"Button1Resource1.Text". Also notice that in the Default.aspx page it has added one more attribute to the Button1 control :
meta:resourcekey="Button1Resource1"
This specifies the resource key to be used from the resource file to generate the value of all the attributes defined in resource file for the "Button1" control.
Notice that resource file is generated for only web server controls but not for HTML controls or just text.
If we want to generate resource file for all the text in the page then we need to put that text in a control. One of the options of doing it is using Localize control as shown below. This generates only text on the browser with no additional properties. You can also use Label control but it also generates additional formatting properties and more text on browser.
Below I have localized the text in the header as shown:
Before localization:
<h3> We suggest the following:</h3>
After Localization using the asp:Localize control:
<h3><asp:Localize ID="lHeader" runat="server" Text="We suggest the following:" meta:resourcekey="lHeaderResource1"></asp:Localize></h3>
Now it will look into resource file with the matching key “lHeaderResource1" and replaces the value of the control properties with the value found in resource file. In the resource file it looks for key.property and gets the value.
The output for Default(English language) looks as follows:
To create a new resource file for a different language and culture just copy paste the base default resource file in the same folder and rename it as per the other language and culture. For Example to generate French version of the Default.aspx.resx file, copy paste this file and rename it to Default.aspx.fr.resx and then change the resource value in the file accordingly.
Similarly if you want to also add culture along with the language you can rename it to Default.aspx.es-mx.resx for Spanish language and Mexican culture resource file.
Modify the resource value as per the new language in the respective resource file.
For demonstration purpose I have changed the Text of the Button(Button1Resource1.Text) to
“¡Hola" in Default.aspx.es-mx.resx resource file and
Bonjour" in Default.aspx.fr.resx resource file
Now go to internet explorer -> tools -> Internet Options -> Languages -> Click on Add -> select the French[fr] and click on ok. -> Move French[fr] at the top of the Language list and click on ok twice. This sends the request for webpage in French language and if the resource file is found for the French language it uses that resource file and generates the output else the default language is used for the request.
Now refresh the page and you will see the text of the button in French.
Similarly you can set the language preference to Spanish(es-MX) and move it to the top in the list. Refresh the page and you will see the text of the button in Spanish.
When the ASP.NET receives the request, based on the browser language settings sent to asp.net, it sets the Page.UICulture property of the page and uses the respective resource file of that language and generates the output.