These days, the Online market is growing globally. It means you can view the websites, from any corner of the world with the help of the internet but it’s not necessary for everyone to understand the page language.

In this JSP tutorial, let’s overcome this problem and create a web page in JSP using JSTL that supports multiple languages. it means the user can change the text of pages as per their local languages. but before that, you have to understand the I18N.

What is I18N?

I18N is a term that defines the word Internalizations. There are total 20 char in internalization. so “I”  is a first char and “N” is the last char of the word and 18 is the total char that comes between I and N.

Create webpage in multiple language pages in JSP and JSTL

Let’s Create a JSP page, that contains multiple links with the text of language names and some dummy text. When the user will click on the links the dummy text will be changed into the respective language.

Steps to Create Multilingual web pages in JSP or HTML

• Change the default charset and pageEncoding to UTF-8 on the page.
• Configure the Eclipse/STS workspace or IDE to make use of I18N.
• Create links to change the languages and add some dummy text for testing on the web page.
• Add Properties file with labels in multiple languages, Where the key will be common for all properties and value will be converted into the respective language.
• Page integration with properties using JSTL.

Update charset and pageEncoding on JSP page.

Create a New JSP page(MultiLangPage.jsp). Bydefault, you will get the charset=ISO-8859-1 and pageEncoding=”ISO-8859-1″ on a JSP page. Just replace the values to UTF-8

Change charset=ISO-8859-1″ to charset=UTF-8″ and pageEncoding=”ISO-8859-1″ to pageEncoding=”UTF-8″.

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

Change file encoding in Eclipse or STS

Open your IDE and follow the path Windows==> Prefrences ==> General ==> Workspace ==> Text file encoding ==> Others(UTF-8)

Design the web page

Create a link to change the languages and add some dummy text for testing. with the attribute href that contains some query string as value “?locale=hi_IN”. where locale is the name of param.

Every language has a Locale, that is the sort name of the language of the country like hi_IN for Hindi, en_US for English. Scroll down at the end of this page you will get the locale according to the country.

<a href="?locale=hi_IN">Hindi</a>
<a href="?locale=en_US">English</a>
<a href="?locale=ja_JP">Japanese</a>

Add Properties file with labels in multiple languages

Create a java package with the name “I18N” and create .properties file. As we are using 3 languages in this example so we will create 3 properties files.

The name of the file can be anything but the extension must be .properties also the after name we have to add the _locale.

like page_hi_IN.proterties, here “page” is a name of the file, _hi_IN defines the type of file means it contains the text in the Hindi language. page.properties will be the default language of the application.

page.properties

Data for default message display, incase invalid locale, this text will display.

label.msg = Hi Welcome to codebun its. Mulitple language Testing application in JSP

page_ja_JP.properties

Text in the Japanese language

label.msg = \u3053\u3093\u306B\u3061\u306Fcodebun\u3078\u3088\u3046\u3053\u305D\u3002 JSP\u3067\u306E\u8907\u6570\u8A00\u8A9E\u30C6\u30B9\u30C8\u30A2\u30D7\u30EA\u30B1\u30FC\u30B7\u30E7\u30F3

page_hi_IN.properties

Test in the Hindi language

label.msg = \u0939\u093E\u092F \u0915\u094B\u0921\u092C\u0928 \u092E\u0947\u0902 \u0906\u092A\u0915\u093E \u0938\u094D\u0935\u093E\u0917\u0924 \u0939\u0948\u0964 \u091C\u0947\u090F\u0938\u092A\u0940 \u092E\u0947\u0902 \u090F\u0915\u093E\u0927\u093F\u0915 \u092D\u093E\u0937\u093E \u092A\u0930\u0940\u0915\u094D\u0937\u0923 \u0906\u0935\u0947\u0926\u0928

page_en_US.properties

Text in the English language

label.msg = Hi Welcome to codebun its. Mulitple language Testing application in JSP

JSP Page integration with the properties file

• Add JSTL lib or maven dependencies to enable the use of JSTL in the project. import the format taglib on the webpage <%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
• Set the Param value by the tag <fmt:setLocale value="${param.locale}"/>
• Add the base name of the properties file by using <fmt:bundle basename="I18N/page"> that is the path of all the properties files that have basename as “page” according to this example.
• Set the message key by using <fmt:message key = "label.msg"></fmt:message>

MultiLangPage.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ page isELIgnored="false" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>

<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>Multi Language Page Demo</title>
</head>
<body>

<a href="?locale=hi_IN">Hindi</a>
<a href="?locale=en_US">English</a>
<a href="?locale=ja_JP">Japanese</a>
<fmt:setLocale value="${param.locale}"/>
<fmt:bundle basename="I18N/page">
<h1><fmt:message key = "label.msg"></fmt:message></h1>
</fmt:bundle>

</body>
</html>

All done Run the application or the JSP page and enjoy the output.

Locale ID as per the Country and Langues in Java