為 ASP.NET 網站加入多國語系的功能

為 ASP.NET 網站加入多國語系的功能

1. 目的

本文將介紹在ASP.NET中,如何替網站加入多國語系的功能。

2. 背景

我們所開發的網站如果要讓各個國家、語言的人都能夠看得懂的話,就必須提供多國語系的功能。而多語系的作法大致上有兩種:一種是把一個網頁拆成多個不同語系的網頁(參考圖 2‑1),當要看某個語系時就導向那個語系的網頁;另一種方式是單純用一個網頁,只是將上面顯示的內容換成不同的語系。使用第一種方法有個缺點,當要新增或刪除內容時,必須把多個語系的網頁都打開來一一修改。而第二種方法就只需要改一份網頁即可。

clip_image002

2‑1,多國語系

3. 實作說明

以下說明第二種方法的實作,當網頁內容需要變動時,就只需要改同一份網頁即可。我們將網頁上的內容大致分成三類去做多語系。第一種是針對ASP.NET控制項,第二種針對一般的網頁文字,第三種則是針對網站導覽檔(.sitemap)作多語系。

3.1. ASP.NET控制項多語系

參考下圖,左邊是我們網頁顯示的內容,右邊是對應的.aspx檔內容,我們使用ASP.NET的BulletedList控制項,並在其中加入football、basketball與baseball清單項目。

clip_image004

圖 3‑1

以下為實現多語系功能的四個步驟:

步驟1. 切換到要支援多語系的網頁原始檔畫面(.aspx)

步驟2. 按一下選單[工具]→[產生本機資源]

clip_image006

此時在方案總管中可以看到App_LocalResources系統資料夾中多了一個該網頁的資源檔(.resx)。

clip_image008

此外原本的網頁原始檔也被修改成下方樣子。(見綠色方框部份)

clip_image010

步驟3. 針對該網頁新增其他語系的資源檔

您可以開啟原本的資源檔後再使用[檔案]→[另存App_LocalResources/xxx.aspx.resx為…]的方式另存一份新的(其他語系)資源檔。或者直接用滑鼠點選原本的資源檔,按右鍵利用複製、貼上的方式來產生一份新的資源檔。之後將新的資源檔命名為xxx.aspx.文化特性名稱.resx。

例:sport.aspx.zh-CHT.resx (繁體中文)

clip_image012

步驟4. 在語系資源檔中輸入要顯示的文字

如圖在.zh-CHT.resx(繁體中文)的資源檔中,將清單項目改成中文字。

clip_image014

 

3.2. 一般網頁文字多語系

下圖綠色方框中的文字(Related Search: )為一般的網頁文字,要為它加上多國語系主要有兩個步驟:

clip_image016

圖 3‑2

步驟1. 使用ASP.NET的Localize控制項或手動更改網頁原始碼

方法一. 到工具箱選擇Localize控制項加到網頁,再將文字搬到<asp:Localize></asp:Localize> 標籤之間:

clip_image018

clip_image020

方法二. 直接手動修改原始碼:加入<asp:Localize runat=”server”></asp:Localize>標籤

clip_image022

步驟2. 按一下選單[工具]→[產生本機資源]

網頁原始碼會被改成下方樣子:

方法一

clip_image024

方法二

clip_image026

之後的方式就如同前一節所述的,到語系資源檔中找到對應的資源名稱,將值改成中文即可。

clip_image028

3.3. 網頁導覽檔(.sitemap)多語系

參考下圖,要為網站導覽檔加入多語系的功能主要有5個步驟。

clip_image030

圖 3‑3,Web.sitemap檔

步驟1. 修改Web.sitemap

Ø <sitemap>節點加上enableLocalization屬性並設定值為true,以便啟用多語系功能。

Ø 拿掉各<siteMapNode>節點的title屬性僅保留url屬性,接著手動替每個<siteMapNode>節點加上resourceKey屬性,屬性的值(對應到資源檔名稱)可自行輸入。

clip_image032

步驟2. 加入ASP.NET系統資料夾App_GlobalResources

在方案總管上按滑鼠右鍵,選擇“加入ASP.NET資料夾”→“App_GlobalResources”。

clip_image034

步驟3. 為網站導覽檔加入資源檔

在方案總管上按滑鼠右鍵,選擇“加入新項目…”,然後選擇“資源檔”並將名稱設定成跟網站導覽檔一樣的檔名。例:Web.sitemap.resx

clip_image036

步驟4. 為網站導覽資源檔新增其他的語系

如同3.1節步驟3的方式,加入其他語系的資源檔。

clip_image038

步驟5. 到對應的語系資源檔中修改顯示文字

clip_image040

3.4. 多語系的自動切換

參考下圖,預設在.aspx中會有綠色方框部份的設定,其讓網頁能根據瀏覽器的設定來自動切換不同語系。

clip_image042

接著我們就來設定瀏覽器,以檢視網頁的內容。到IE的[工具]→[網際網路選項]中設定語言選項,新增中文與英文語言,網頁便會依照這個順序自動載入對應的語系資源。

clip_image044

clip_image046

4. 結論

利用上述的幾個方式即可以輕鬆地實作出網站的多國語系功能。

5. 參考文件

新一代ASP.NET 2.0網站開發實戰—使用C#以及VB2005

ASP.NET 2.0 當地語系化功能:一種當地語系化 Web 應用程式的新方法

[習題]TreeView、Menu、SiteMapPath #2 --多國語系 /當地語系 / Localization