Localization and internationalization

Although all themes coming with CalendarXP are in English, it's very easy to localize them into your own language. Moreover it's quite simple to setup an i18n framework with your cgi server to provide multi-language support of your website. This tutorial will help you deal with them fast.

How to localize a theme?

Pick up any theme at hand and take a look at the source, you'll find all text strings in the calendar are externalized here. So what's next? Just translate the English strings to your own language strings and modify the theme css to use corresponding font family. Nothing more to bother.

How to get i18n work on the page?

I18n, a.k.a internationalization, is to make your page available in different languages at the same time. You'll be preparing resources in different language and feeding the browser with the one chosen by the end user.

First, you need to localize the theme you choose into different languages and name them with specific suffixes. e.g. For mini theme localized in French, we can have mini_fr.css and mini_fr.js. If you were to use any strings in plugins or agendas, you may either create plugins_fr.js and agenda_fr.js accordingly, or externalize the text strings into an array and append it to mini_fr.js.

Next, you need to create server-side wrappers for the engine files so that a correct charset encoding header will be sent to the browser. The wrapper is nothing but a file with a http charset setting and an "include" tag in the syntax of the cgi tech your server employed. Taking ASP as example, we need to create the following 2 files.

ipopeng.asp

<%
Response.Charset=Request.QueryString("sel_charset")
%>
<!-- #include file="ipopeng.htm" -->

npopeng.asp

<%
Response.Charset=Request.QueryString("sel_charset")
%>

<!-- #include file="npopeng.htm" -->

Copy these 2 files into the same directory with the ipopeng.htm and npopeng.htm engine files. Then modify the calendar tag to use the wrapper file as the code source accordingly. e.g.

<iframe name="gToday:mini:agenda.js" id="gToday:mini:agenda.js"
src="ipopeng.asp" ...>
<layer name="gToday:mini:agenda.js"
src="npopeng.asp" ...></layer>
</iframe>

Finally, dynamically generate the theme name and sel_charset according to the language/charset used in your page.

<iframe name="gToday:mini_<%=selected_language%>:agenda.js" id="gToday:mini_<%=selected_language%>:agenda.js"
src="ipopeng.asp?sel_charset=<%=Server.URLEncode(selected_charset)%>" ...>
<layer name="gToday:mini_<%=selected_language%>:agenda.js"
src="npopeng.asp?sel_charset=<%=Server.URLEncode(selected_charset)%>" ...></layer>
</iframe>

The selected_language can be "fr", "cn" or any language code used by your localized theme. The selected_charset can be "iso-8859-1", "gb2312" or any charset employed by your theme correspondingly.

 


Copyright© 2003-2004 Idemfactor Solutions, Inc. All rights reserved.