IBM WebSphere Portal で IBM Workplace Web Content Management を使用して複数言語サイトを実装する

IBM Workplace Web Content Management を使用し、複数の言語でコンテンツを表示するサイトを構築。また、IBM WebSphere Portal のパーソナライゼーション・エンジンの機能と組み合わせることで、ユーザー設定に基づきパーソナライズされたコンテンツを配信することが可能になります。

Ahmed Abbass (aabbass@eg.ibm.com), IT Architect, IBM

Ahmed Abbas is an IT Architect at Cairo Technology Development Center. Through his involvement in lab services, Ahmed has been interested in bridging the gap between the theories behind technology and the practicality of implementations to serve customer business needs. You can reach him at aabbass@eg.ibm.com.



Hebba Soliman (hsoliman@eg.ibm.com), Senior Software Engineer, IBM

Hebba Soliman is a senior software engineer at IBM Cairo Global Delivery Center (C-GDC). She has extensive experience in developing and designing Web applications using IBM Workplace Web Content Management and personalization.



2008年 1月 29日

IBM Workplace Web Content Management を使用して、複数の言語でコンテンツを表示するサイトを構築することができます。Workplace Web Content Management を、基盤となる IBM WebSphere Portal のパーソナライゼーション・エンジンの機能と組み合わせることで、ユーザー設定に基づいてパーソナライズされたコンテンツを配信することが可能になります。

普段はコンテンツを自身の言語で閲覧している Web ユーザーにとって、複数言語サイトを閲覧することは興味深いことかもしれません。ポータルの提供側からすると、コンテンツを複数言語で提供するにあたっては、ユーザー選択言語に応じてコンテンツを配信する必要があります。さらに、カテゴリー化された多様なコンテンツを提供しているポータルでは、ユーザー設定に対応したコンテンツの配信が必要となる場合があります。ユーザーの選択言語と関心領域はいずれも、登録時に取り込むことができます。「リソース」セクションのリンクから、IBM WebSphere Portal のログイン動作をカスタマイズするための有益な情報源にアクセスすることができます。

この記事では、読者が IBM WebSphere Portal V6.0 の管理機能とそのコンポーネントである IBM Workplace Web Content Management、およびパーソナライゼーション・エンジンについて十分に理解していることを前提としています。

このようにコンテンツをパーソナライズするという考えをわかりやすく示すために、この記事では、コンテンツを英語とアラビア語で提供するポータルのサンプルを使用します。言語が 3 つ以上の場合や、サンプルで使用されているものとは別の言語の場合でも、同じ考え方を適用できます。使用するサンプルは、News Details ポートレットをポイントする見出しをリスト表示する、ニュース・ポートレットです。2 つのポートレットを図 1 に示します。

図 1. 英語でレンダリングされたニュース・ポートレット
英語でレンダリングされたニュース・ポートレット

同じポートレットをアラビア語でレンダリングすると、図 2 のように見えます。文字を右から左に配置する設定は、ユーザー言語に基づき WebSphere Portal によって自動的に処理されます。

図 2. アラビア語でレンダリングされたニュース・ポートレット
アラビア語でレンダリングされたニュース・ポートレット

ここで、詳細な手順の説明に進む前に、実装の背後にある基本的な考え方について説明しておきます。

複数言語サイトのしくみ

複数言語サイトを設計する上で重要な点は、オーサリングと、レンダリング中の取得の両方を簡素化するような方法でコンテンツを編成することです。ここでいう設計とは、各言語に対して、別個のサイト領域とオーサリング・テンプレートを割り当てることです。このサンプルでは、アラビア語と英語という 2 つの言語を使用するため、2 つのサイト領域と 2 つのオーサリング・テンプレートを用意します。

各コンテンツ項目の言語は、その項目が属するサイト領域によって決まります。もう 1 つの次元では、同じコンテンツ項目を、分類法で表される 1 つ以上の関心領域と、その下のカテゴリーに関連付けることができます。

ページの言語は、エントリー時点でのユーザーのロケール、またはユーザー・プロファイルに格納されているユーザー選択言語に応じて指定されます。コンテンツをこのような方法で編成することにより、図 3 のように、実行時に提供されるユーザーの言語と関心領域に基づいてコンテンツ項目をフィルタリングすることができます。

図 3. ユーザーの言語と関心領域に基づくコンテンツ・フィルタリング
ユーザーの言語と関心領域に基づくコンテンツ・フィルタリング

登録済みユーザーについては、ユーザーの言語と関心領域は通常ユーザー・プロファイルから取得されます。ログインされたユーザー・プロファイルからのユーザー選択言語の取得の詳細については、「リソース」セクションを参照してください。この場合でも、ユーザーの言語と関心領域が別の形でプログラマチックに提供されれば、同じ設計が機能します。

実際にフィルタリング操作を行うレンダリング部分を実装する方法は、そのほかにも 2 つあります。レンダリング部分は、以下のいずれかのコンポーネントとして実装することができます。

  • 各言語のメニュー・コンポーネント: JSP コンポーネントを使用して、コンテンツ・リストを表示するためのメニュー・コンポーネントをユーザーのロケールに応じて選択できます。
  • 各言語のパーソナライゼーション・コンポーネント: パーソナライゼーション規則によって、ユーザー言語と、コンテンツ項目に関連付けられたオーサリング・テンプレートのマッチングに基づき、使用するパーソナライゼーション・コンポーネントが決定されます。この規則で、ユーザーの関心領域 (ユーザー・プロファイルに格納されたもの) に基づくフィルタリングも実行できます。この手法では、WebSphere Portal のパーソナライゼーション機能と、Workplace Web Content Management の機能を使用します。

実装

このセクションでは、ユーザー選択言語に基づき言語を切り替えるためのソリューションを実装する手順を説明します。第 1 部では、Workplace Web Content Management の成果物の作成について説明します。この成果物は、実装手順の第 2 部で説明する 2 つのレンダリング・オプションに共通するものです。

Workplace Web Content Management の成果物

WebSphere Portal の管理画面から、以下の手順で示すような成果物を作成することができます。あるいは、以下の各成果物に相当する既存の成果物がある場合には、それらを使用することもできます。その場合にはこのセクションはスキップしてください。この記事で言及する成果物の名前は、相互参照の目的のためのみのものです。

コンテンツ・ライブラリー、サイト、サイト領域、およびワークフロー

Workplace Web Content Management のコンテンツ・ライブラリーを作成して、「MultiLanguage」という名前を付けます。このライブラリー内にサイトを作成して、「MultiSite」という名前を付けます。次に、そのサイトの下に、各言語用のサイト領域、「HomeEnglish」と「HomeArabic」を作成します。アラビア語のサイト領域には、図 4 のように、国際化した表示名を選択してください。

図 4. コンテンツ・ライブラリー、サイト、およびサイト領域
コンテンツ・ライブラリー、サイト、およびサイト領域

次に、新規に作成したこれらのサイト領域の下に、サンプルによってレンダリングされるコンテンツ (例えばニュース) を格納するための別のサイト領域を作成します。各言語についてはローカライズされた異なる表示名を設定するのに対して、ニュースのサイト領域には 2 つの異なる親領域があるため、同じ名前を設定することができます。

コンテンツを公開するには、ワークフロー・ステージと、ニュース・コンテンツ項目によって使用されるワークフローを定義します。このサンプルには、単純な 1 ステージのワークフローで十分です。「New」 > 「Workflow stage」を選択してワークフロー・ステージを作成し、「Publish stage」という名前を付けて、このステージの公開アクションを選択します。

次に、「New」 > 「Workflow」を選択してワークフローを作成し、「One Stage Workflow」という名前を付けます。「Select Workflow Stage」オプションを選択し、先ほど作成したステージ「Publish stage」を選択します。

オーサリングと表示のテンプレート

コンテンツ項目のオーサリングを行うには、各言語でニュース詳細を表示するオーサリング・テンプレート「at_news_en」と「at_news_ar」を作成します。「New」 > 「Authoring Template」を選択して、オーサリング・テンプレートを作成します。「Manage Elements」オプションを選択し、フィールドのエレメント・タイプを選択して、「Add」をクリックします。例として、使用したリストを表 1 に示します。Element Manager を使用して、表 1 にあるフィールドを 2 つのテンプレートに追加します。

表 1. オーサリング・テンプレートのフィールド

エレメント・タイプ 名前表示タイトル
テキストtxt_titletxt_title
リッチ・テキストrtf_descriptionrtf_description
コンポーネント参照Img_newImageImg_newImage

前のセクションで作成したワークフローを、ここで作成したオーサリング・テンプレートのそれぞれ対応する方に関連付けます。

レンダリング部分については、表示テンプレート「pt_newsDetail」を定義します。「News Details」ページのソースはリスト 1 のとおりです。ページ・ソースにあるエレメントはテーブルにあるものですが、読みやすくするために省いてあります。

リスト 1. 「News Details」ページのソース・コード
.
.
<Element context="current" type="content" key="txt_title" /> 
.
.
<Element context="current" type="content" key="img_newsImage" />
.
.
 <Element context="current" type="content" key="rtf_description" />

.
.
<!-- links to the News List page created with the URL mapping as a back link -->
<a href="<PathCmpnt type="noprefixbase" start=" "
			end="/wps/myportal/NewsList" />"> <-- </a>

以上で、テンプレートを対応するニュース・サイトにマッピングする準備が完了しました。英語のニュース・サイト領域で、図 5 のように、「Edit Template Mapping」ボタンをクリックして、「at_news_en」をオーサリング・テンプレートとして、「pt_newsDetail」を表示テンプレートとして選択します。図 6 のように、同じことをアラビア語ニュース・サイト領域でも行います。ただし、「at_news_ar」をオーサリング・テンプレートとして選択します。

図 5. 英語ニュース・サイト領域のためのテンプレート・マッピング
英語ニュース・サイト領域のためのテンプレート・マッピング
図 6. アラビア語ニュース・サイト領域のためのテンプレート・マッピング
アラビア語ニュース・サイト領域のためのテンプレート・マッピング

「News List」ページのレンダリングについては、表示という観点から、レンダリング・オプションについて説明する以下のセクションで取り扱います。

イメージ・コンポーネント

このサンプルの「News Details」ページでは、イメージが 1 つ表示されます。イメージを 2 回 (各サイト領域または言語について 1 回ずつ) アップロードすることを回避するために、イメージ・コンポーネントを作成して、2 つのサイト領域の下で作成された各コンテンツ項目が同じイメージ・コンポーネントを参照するようにすることができます。

コンテンツ

さて、以上で Workplace Web Content Management の成果物の作成が完了しました。いよいよコンテンツ項目、すなわちタイトル、本文、およびイメージを含むニュース記事のオーサリングを開始することができます。このコンテンツは、次に来るレンダリング部分のプレビューに必要となります。

このセクションでは、「News List」ページの 2 つのレンダリング・オプションについて説明します。メニュー・コンポーネントを使用する方法と、パーソナライゼーション・コンポーネントを使用する方法です。

メニュー・コンポーネントを使用する

「News List」ページは、各言語について作成するメニュー・コンポーネント「menu_newsList_en」および「menu_newsList_ar」として実装することができます。作成したメニュー・コンポーネントはそれぞれ、図 7 (英語版) のように、自身のオーサリング・テンプレートまたは自身が属するサイト領域に応じてコンテンツを取得します。アラビア語のバージョンでは、これに対応する、アラビア語用に作成された成果物を使用します。

図 7. 英語の「News List」ページ用に作成されたメニュー・コンポーネント
英語の「News List」ページ用に作成されたメニュー・コンポーネント

その後、メニュー・コンポーネントの設計セクションにヘッダーとフッターを追加することができます。検索結果については、リスト 2 のように、タイトルと説明フィールドのためのプレースホルダーを置きます。コンテンツ項目がレンダリングされた時に、このプレースホルダーが該当する値に置換されます。リストの末尾に、その他のニュース見出しを表示するリンクを置きます。

リスト 2. 各メニューの検索結果のための設計
<a style="color: rgb(0, 0, 0); font-size: 14px; font-weight: bold;" 
href="<Placeholder tag="href" start="" end=""/>"> ** <FONT 
color="blue"><Element context="autoFill" type="content" 
key="txt_title"/></FONT> </a>

.
.
<Element context="autoFill" type="content" key="rtf_description"/>
.
.
<a href="<Placeholder tag="href" start="" end=""/>">More</a>

以上で、JSP コンポーネントがメニュー・コンポーネントを使用できる状態になりました。JSP コンポーネントを作成して、「jsp_DisplayNewsList」という名前を付け、「/jsp/html/gettingNewsContents.jsp」というパスの JSP ファイルをポイントするように設定します。これに伴い、JSP ファイルの物理的パスは、以下のような (またはこれに似た) ディレクトリーとなります。

<websphere portalのインストール・パス>\installedApps\

WCM_Local_ng_Portlet_PA_dvme0nk.ear\PA_dvme0nk.war\jsp\html\
gettingNewsContents.jsp

JSP コンポーネントの作成についての詳細は、WebSphere Portal V6.0 インフォメーション・センターを参照してください。

ここで、その JSP ファイルを作成して、リスト 3 のコードを追加します。

リスト 3. メニュー・コンポーネントを使用してコンテンツをレンダリングする JSP ファイル
<%@page language="java" contentType="text/html; charset=ISO-8859-1"	
pageEncoding="UTF-8" session="false"%>
<%@page import="com.ibm.workplace.wcm.api.*,com.ibm.workplace.wcm.api.exceptions.*"%>
<%@ taglib uri="/WEB-INF/tld/portlet.tld" prefix="portletAPI" %>
<%@ taglib uri="/WEB-INF/tld/portal.tld" prefix="wps" %>
<%
try {

//Connect to WCM Workspace
Workspace workspace = WCM_API.getRepository().getWorkspace("username", "password");
	
//Set it to the library that you have created for the example
workspace.setCurrentDocumentLibrary(workspace.getDocumentLibrary("MultiLanguage"));
	
//Get user language from the request and 
//according to the language, it chooses the correct menu component by name
String language  = request.getLocale().getLanguage();

//The example does not consider the case when no language is found 
//in the request. For a real implementation, you may need to handle that case.
if(language  != null){
//Set the menu component according to language
	String compName = "menu_newsList_" + language ;
	
		//Retrieve the menu component
		DocumentIdIterator docIds = 
workspace.findByName(DocumentTypes.LibraryComponent,compName);
if (docIds.hasNext()){
	DocumentId did = (DocumentId)docIds.next();
	LibraryComponent libComp = (LibraryComponent)workspace.getById(did);
				
	//Get the rendering key from the request
	RenderingContext rcjsp = 
	(RenderingContext)request.getAttribute(Workspace.WCM_RENDERINGCONTEXT_KEY);
           	//Now, render the personalization component and output the resulting html!

			String html = workspace.render(rcjsp, libComp);
			out.println(html);
				
		}
	}
}
catch (Exception e) {
	//For a real implementation, you may need to handle exceptions in a 
	//more advanced way. The basic handling below is just an example.
	out.println("exception = "+e.toString());
	e.printStackTrace();
}
%>

: 作成したコンポーネントとコンテンツに対するセキュリティー権限を付与する必要があります。このサンプルを実行するには、wcsadmins グループの任意のメンバーを使用できます。

パーソナライゼーション・コンポーネントを使用する

メニュー・コンポーネントに代わる手段として、WebSphere Portal のパーソナライゼーション・エンジンを使用したパーソナライゼーション・コンポーネントがあります。パーソナライゼーションの規則を使用して、言語とユーザーの関心領域の両方で同時にコンテンツのフィルタリングを行うことができます。

初めに、図 8 の各種関心領域のようなビジネス・カテゴリーを含む分類法を作成します。教育、健康、およびスポーツをカテゴリーとして追加します。

分類法を作成するには、「New」 > 「Taxonomy」を選択して、「Interest」という名前を付けます。次に、「New」 > 「Category」を選択してカテゴリーを作成します。親分類法として「Interest」を選択します。

図 8. 「Interest」という分類法の下にカテゴリーとして実装された関心領域
「Interest」という分類法の下にカテゴリーとして実装された関心領域

定義したカテゴリーを、「User Profile」セクションでコンテンツ項目に関連付けて、それらの項目が属する関心領域を指定することができます。プロファイル・ページにアクセスするには、「Administration」ページ > 「Launch」 > 「Edit My Profile」を選択します。使用するユーザー・アカウントのユーザー・プロファイルを編集して、関心領域を設定することができます。この操作は、同一の関心カテゴリー名が付けられた「businessCategory」フィールドを編集することにより行います。レンダリング中にマッチングの結果が表示されるよう、ユーザーに割り当てられたカテゴリーに関連付けられたコンテンツ項目が作成されていることを確認します。

ここから、コンテンツのフィルタリングに使用されるアクション規則を作成します。各言語について 1 つずつ規則が必要です。「UserInterestContents_en」と 「UserInterestContents_ar」とします。規則を新規作成するには、「Administration」ページ > 「Launch」 > 「Personalization」を選択して、「New」 > 「Rule」を選択します。規則タイプとして「Select Action」を選択します。

各規則では、図 9 (英語のパーソナライゼーション規則) のように、該当する言語用に作成された成果物を使用する必要があります。

図 9. ユーザーの関心領域に基づいて英語のコンテンツを取得するパーソナライゼーション規則
ユーザーの関心領域に基づいて英語のコンテンツを取得するパーソナライゼーション規則

: サイト領域の値は空白となっており、フィルタリングはオーサリング・テンプレートと関心カテゴリーにのみ基づいて行われています。

ここで必要となるのは、作成したパーソナライゼーション規則を使用する各言語用のパーソナライゼーション・コンポーネントです。それらのコンポーネントに「pers_NewsList_en」と「pers_NewsList_ar」という名前を付けます。

パーソナライゼーション・コンポーネントを作成する際に、「Personalization Element」セクションで、作成したルールを選択します。それらのパーソナライゼーション・コンポーネントの設計セクションで、メニュー・コンポーネント用に作成した設計セクションを再利用します。

ここでも、メニュー・コンポーネントについて行ったように、ここで作成したパーソナライゼーション・コンポーネントを使用する JSP コンポーネントを作成します。その JSP コンポーネントは、メニュー用に作成した JSP ファイルに似た、ただし以下の変更を加えた JSP ファイルを参照するようにします。

//Set the personalization component according to language
String compName = "NewsPersonalizedList_" + language ;

WebSphere Portal のページ

いずれかのレンダリング・オプションを適用した後に、ニュース項目のリストと、ニュース・リストから選択されたニュース項目の詳細ページを表示するための、レンダリング・ポートレットを含むポータル・ページを作成します。WebSphere Portal の管理画面で、2 つのページ「NewsList」と「NewsDetail」を作成します。Web Content Viewer ポートレットを各ページに追加します。2 つのページの間をより簡単に移動できるようにするため、各ページ (「News List」と「News Details」) のための URL マッピングを作成することができます。各ページの詳細は図 10 のようになります。

図 10. 作成されたポータル・ページの詳細
作成されたポータル・ページの詳細

: デフォルトのコンテンツは英語のコンテンツに設定されていますが、いずれのコンテンツを選択しても構いません。

「News List」ページで使用されるコンテンツは、先ほどメニュー・コンポーネントまたはパーソナライゼーション・コンポーネントのいずれかのために作成した JSP コンポーネント「jsp_DisplayNewsList」です。「News List」ページのターゲット・ポータル・ページのフィールドは、「News Details」ページをポイントします。これに対して、「News Details」ページがターゲット・ポータル・ページのフィールドを使用して、「News List」ページをポイントします。

これで、サンプルの実行準備が整いました。「News List」ページを表示して、先ほど入力したニュースのリストを、ログインしたユーザーの言語と関心領域に基づいて表示します。


設計上の考慮事項

このセクションでは、使用したサンプルによって実装された設計に関する重要な点、例えば保守性とパフォーマンスを向上させるための、設計の使用または変更に関するベスト・プラクティスなどについて解説します。

追加言語対応

この設計により、サイトの追加言語対応プロセスが簡素化されます。追加言語対応のために必要な作業は、新規言語のために作成された成果物と、オーサリング・テンプレートおよびメニュー・コンポーネントまたはパーソナライゼーション・コンポーネントを保持するための新規サイト領域を追加することのみです。

言語間の切り替えを行うには、ユーザーはブラウザーのロケールを変更するか、または「Edit My Profile」ページからユーザー選択言語を変更する必要があります。また、各言語のコンテンツ作成者が異なる場合には、アクセス制御を使用して、異なるサイト領域について異なる作成者を割り当てる、すなわち、言語ごとに作成者を割り当てることができます。

フィルタリング・オプション

多くの場合、パーソナライゼーション規則においてオーサリング・テンプレートによりフィルタリングを行った方が、サイト領域によってフィルタリングを行うよりも高いパフォーマンスが得られます。

コンテンツのオーサリングと保守を簡素化する

オーサリング・テンプレート内のフィールドが多ければ多いほど、設計の有用性は高くなります。各言語を表示するフィールドを備えた個別のオーサリング・テンプレートを用意した方が、すべての言語のためのすべてのフィールドを備えたオーサリング・テンプレートを用意するよりも保守が容易になります。

Workplace Web Content Management API の使用を最適化する

ここで採用された設計では、コンテンツをテンプレートとコンポーネントに関連付ける手法を使用しています。そのため、JSP が Workplace Web Content Management リポジトリー内でコンテンツを検索する API を使用する必要がありません。

その他のケースでは、JSP ファイル内での検索を追加する必要があるときは、パラメーターとして別個のオーサリング・テンプレートと別個のサイト領域をとる workspace.contentsearch() メソッドを使用します。このメソッドを使用すると、オーサリング・テンプレートによる検索を使用してコンテンツを検索した上でサイト領域によって結果をフィルタリングする方法よりも、高いパフォーマンスが得られます。また一方で、メソッドがサイト領域ではなくオーサリング・テンプレートによりコンテンツを取得する場合には、パーソナライゼーション規則の方が高いパフォーマンスを実現できます。


まとめ

WebSphere Portal の Workplace Web Content Management とパーソナライゼーション・コンポーネントを通じて、WebSphere Portal に組み込まれた機能によって、複数言語ポータルのサポートが容易になりました。この記事では、ポータルでユーザー選択言語とユーザー関心領域の両方に基づいてコンテンツを配信する方法について説明しました。

参考文献

コメント

developerWorks: サイン・イン

必須フィールドは(*)で示されます。


IBM ID が必要ですか?
IBM IDをお忘れですか?


パスワードをお忘れですか?
パスワードの変更

「送信する」をクリックすることにより、お客様は developerWorks のご使用条件に同意したことになります。 ご使用条件を読む

 


お客様が developerWorks に初めてサインインすると、お客様のプロフィールが作成されます。会社名を非表示とする選択を行わない限り、プロフィール内の情報(名前、国/地域や会社名)は公開され、投稿するコンテンツと一緒に表示されますが、いつでもこれらの情報を更新できます。

送信されたすべての情報は安全です。

ディスプレイ・ネームを選択してください



developerWorks に初めてサインインするとプロフィールが作成されますので、その際にディスプレイ・ネームを選択する必要があります。ディスプレイ・ネームは、お客様が developerWorks に投稿するコンテンツと一緒に表示されます。

ディスプレイ・ネームは、3文字から31文字の範囲で指定し、かつ developerWorks コミュニティーでユニークである必要があります。また、プライバシー上の理由でお客様の電子メール・アドレスは使用しないでください。

必須フィールドは(*)で示されます。

3文字から31文字の範囲で指定し

「送信する」をクリックすることにより、お客様は developerWorks のご使用条件に同意したことになります。 ご使用条件を読む

 


送信されたすべての情報は安全です。


static.content.url=http://www.ibm.com/developerworks/js/artrating/
SITE_ID=60
Zone=Lotus, WebSphere
ArticleID=347434
ArticleTitle=IBM WebSphere Portal で IBM Workplace Web Content Management を使用して複数言語サイトを実装する
publish-date=01292008