目次


WebSphere Portal 7.0 でのアクティブ・サイト分析の有効化

WebSphere Portal 7.0 でのアクティブ・サイト分析に関するチュートリアル

Comments

はじめに

IBM は、WebSphere Portal 7.0 でサイト分析のサポートを強化しました。分析はユーザー・アクティビティーをキャプチャーおよび測定するプロセスで、より優れたサイト設計とターゲット設定を可能にするため、エンド・ユーザーのニーズと行動およびサイトのユーザビリティーを把握することが主な目的です。

お客様がポータル・アプリケーションを作成する場合、影響の度合いを知るため、実際の使用状況分析の必要性は非常に高くなります。収集されたデータは投資収益率 (ROI) を決定するための入力として使用され、さらに ROI に基づいて投資の拡大や削減、またはサイトの調整が行われます。データは、パッシブ・サイト分析 (ロギング) またはアクティブ・サイト分析 (タグ付け) を通じて収集されます。今日、サイト・アナライザー・ツールとの統合は、ポートレットやテーマへの手動でのタグの埋め込み、またはポータル・サイトの分析ログに基づくレポート作成によって実行されます。WebSphere Portal 7.0 では、タグの埋め込みを自動化することにより、ユーザー・エクスペリエンスが強化されています。

このチュートリアルでは、アクティブ・サイト分析を WebSphere Portal 7.0 環境に組み込む方法について説明します。

アクティブ・サイト分析の概要

アクティブ・サイト分析を組み込むことにより、Web ブラウザーはイベント処理システムの一部となります。ユーザーはポータル・ページをポータル・サーバーに要求します。ページはユーザーに返送され、ブラウザー内でレンダリングされます。これらのページ応答には、Web ブラウザーによって処理されるアクティブ要素 (たとえば、Java script 要素) が埋め込まれています。ページ内に埋め込まれたアクティブ要素は、構成に基づいて、使用状況イベントをレポートするリモート要求を分析サーバーに向けてトリガーします。分析サーバーは、選択されたレポート・ソリューションの一部であり、WebSphere Portal デプロイメントの一部ではありません。分析サーバーは、稼働中であり、ユーザーのブラウザーからアクセスできる必要があります。分析サーバーはイベントを処理し、イベント・データをシステム固有のイベント・データ・シンクに格納します。このイベント・データが処理され、ポータル・サイトの使用状況レポートが生成されます。

図 1
図 1
図 1

フローの概要を図 1 に示します。まず、ポータル・ページを要求するブラウザーから開始します (ステップ 1)。次に、ポータルはポータル・ページのマークアップを返します (ステップ 2)。このマークアップには、javascript ファイル (統合機能) への参照、およびアクティブ・サイト分析に関連するデータが含まれています。このデータには、マイクロフォーマットを使用してタグが付けられます。クライアントのブラウザーでページが解析されてレンダリングされると、統合機能が実行されます (ステップ 3)。統合機能は最初にページの HTML 表記からすべてのデータを取り出し、このデータを使用して外部の分析サービス向けの要求をフォーマットします。この要求は分析サービスのサーバーに送信されます。このとき、前のステップで HTML ページ内から収集されたすべてのデータが渡されます (ステップ 4)。一般に、データの送信はイメージをページ内に動的に注入することによって行われます (ただし、この方法に限定されません)。

この時点で、アクティブ・サイト分析の役割が終了します。データを処理し、それに基づいてレポートを生成するのは、分析サービスの役割になります。たとえば、イメージ要求を HTTP サーバーのログ・ファイルに書き込むことができます (ステップ 5)。そして、このファイルをレポート生成ソフトウェアによって処理します (ステップ 6)。

WebSphere Portal には、基本的な分析データが設定された、すぐに使用可能なテーマとスキンが用意されています。各項目はポータル・ページの HTML マークアップに存在し、CSS クラスを用いてタグが付けられています (下表 2 を参照)。統合機能は JavaScript の通常の演算子を使用して、HTML コードからこのデータを取得できます。

統合機能

統合機能の主な目的は、関連するすべての分析情報を収集し、1 つの要求として分析サーバーに送信できるように、これらを単一の情報文字列に集約することです。

統合機能は通常の JavaScript コードとして書かれていて、現在のページに関する情報を保持するデータのフォーマットと、分析サーバーが受け入れるデータのフォーマットという 2 つのインターフェースに対して機能する必要があります。

ブラウザー内で呼び出された統合機能は、通常、クライアントのブラウザーに存在するマークアップの DOM ツリー内のすべてのデータ・インスタンスに反復処理を行い、必要なすべての情報を収集して、統合機能内部の表現形式 (たとえば、JavaScript 配列) にします。JavaScript でノードを選択して反復処理を行うには多数の方法がありますが、Dojo の照会関数が非常に使いやすく、このタスクに適していることがわかりました。以下に示すサンプルの統合機能 (『統合機能の作成』セクションを参照) は、この手法を使用しています。まず、特定のクラス属性を持つ span 要素のすべてのインスタンスに反復処理を行い、一致する要素のテキストを配列に追加します。

2 番目のステップでは、分析サーバーによって定義されたインターフェースに対応する方法に沿って、統合機能が収集済みのデータをフォーマットします。このため、統合機能は特定の分析サーバーに合わせて個別に作成されます (Coremetrics 専用の統合機能があり、他にも Omniture 用、Webtrends 用などがあります)。収集したデータを分析サーバーに渡すために使用される伝送テクニックにも、同じことがあてはまります。

最新のブラウザーのセキュリティー・モデルにより、JavaScript はデータをサード・パーティー・サイトに送信することが許可されていません。ポータル・ページはポータル・サーバーから送られたものなので、ブラウザーは分析サーバーをサード・パーティーとみなし、分析サーバーへの直接のデータ送信を禁止します。しかし、ブラウザーはサード・パーティーからのイメージの取得については許可しています。このセキュリティー・ルールからの除外により、分析データをイメージ要素の src 属性の一部として送信できます。たとえば、統合機能が現在のポータル・ページの名前を「Home」と検出した場合、<img src=”http://server/page.png?name=Home”/> というイメージ要素をマークアップに注入することにより、この情報を分析サーバーに伝送できます。次に、分析プロバイダーは HTTP サーバー・ログ・ファイルに出力された照会文字列を参照し、そこからページ情報を抽出できます。

ブラウザーからサード・パーティー・サーバーに情報を送信する方法はこれ以外にもありますが、上記で概説した手法が一般的であり、後述するサンプルの統合機能でもこの手法が使用されています。

マイクロフォーマット

統合機能はクライアント・ブラウザーで動作するため、WebSphere Portal のサーバー・サイド API にはアクセスしません (REST サービスなどのリモート API が使用されている場合は例外ですが、これについては本書の範囲を超えています)。このため、統合機能の対象となる可能性があるすべての情報を、ポータル・ページの HTML マークアップ内に埋め込む必要があります。マークアップがブラウザーに到着した時点で、統合機能はページ内にすでに存在するものだけを使用できます。

ページ内に埋め込まれたデータへのアクセス方法を標準化するために、WebSphere Portal ではマイクロフォーマットが定義されています (基本的には、ポータル・ページ内のほぼすべての HTML 要素に追加できる CSS クラス名のセットです)。マイクロフォーマットは、アクティブ・サイト分析に関連するデータのタグ付けに使用されます (表 2 参照)。データ・インスタンスは、ポータル・デフォルト・テーマのテーマとスキン JSP に追加されます。

名前説明タグ付けの方法注入先
Page Titleポータルのデフォルト言語でのページ・タイトルasa.page.titleテーマ
Page ID現在のページのObjectIDasa.page.idテーマ
Navigation Breadcrumbナビゲーション階層でのページ位置を示す疑似 URLasa.page.breadcrumbテーマ
Friendly URLページのクリック可能なURL(状態なし)asa.page.urlテーマ
Visitor ID現在ログオンしているユーザーのObjectID、または空asa.visitorテーマ
Portlet Window Titleクライアントに配信されるポートレットのタイトルasa.portlet.titleスキン
Portlet Window IDポートレットの固有のIDasa.portlet.idDojo トピック・キューに公開*
Portlet Screen IDポートレットに表示される画面/ビューの固有のIDasa.portlet.screen.idカスタム・ポートレット
Portlet Screen Titleポートレットに表示される画面/ビューのタイトル(ローカライズ済み)asa.portlet.screen.titleカスタム・ポートレット
Portlet Screen Titleポートレットに表示される画面/ビューのタイトル(ローカライズ済み)asa.portlet.screen.titleカスタム・ポートレット
WCM Content Querystringポートレットに表示される WCM コンテンツ項目の固有のIDasa.wcm.content_item.pathWCM レンダリング・ポートレット
WCM Content Titleポートレット・ウィンドウのタイトルと異なる場合がありますasa.wcm.content_item.titleWCM レンダリング・ポートレット
Search term 照会Dojo トピック・キューに公開
Number of search results 結果Dojo トピック・キューに公開
Search Scope ID scope.idDojo トピック・キューに公開
Search Scope Label scope.labelDojo トピック・キューに公開

*トピック名: "com.ibm.portal.theme.portlet_ready"

** トピック名: "com.ibm.portal.search.RESULTS_ANALYTICS“

データ:
{

 "query": "<query_text>", "results": <total_number_of_results>, 
 "scope": { 
 id: "<scope_id>" 
 label: "<scope_name>“
 }
}

表 1

このデータには、エンド・ユーザーに表示されるものも、されないものもあります。CSS クラスを使用してデータにタグを付けるので、既存のデータ要素に設定を容易に追加できます。さらに、カスタム CSS 定義を追加し、マイクロフォーマット・インスタンスの外観と動作をきめ細かく制御することも可能です。

WebSphere Portal 7.0 のデフォルト・テーマには、分析データのデフォルト設定が用意されているため、テーマまたはスキンへの変更は必要ありません。WebSphere Portal 7.0 の一部であるすべてのデータ要素のリストを表 2 に示します。今後、タグ付き情報の数が拡張される可能性があります。IBM はマイクロフォーマットを公開 API として扱い、必要に応じて妥当な非推奨の手法を適用します。

アクティブ・サイト分析用の統合機能の作成

メモ: Coremetrics、Webtrends、Omniture の各分析を使用している場合は、すでに利用可能な統合機能があります。これらの統合機能のダウンロードおよびインストール方法については、次の Wiki ページを参照してください。(Coremetrics、Webtrends、Omniture)

ユーザーは、アクティブ・サイト分析用のデータをポータルのテーマとスキンから取得する独自のスクリプトを記述できます。このようなスクリプトは、統合機能と呼ばれます。ポータルの「タブ・メニュー - ページ・ビルダー」テーマには、サンプルの統合機能が含まれています。

ポータルのテーマとスキンには、ユーザーによるカスタム Javascript スニペットの注入を可能にするプラグ・ポイントが用意されています。これらのスクリプトは、統合機能と呼ばれます。ユーザーは、関心のあるマイクロフォーマットのインスタンスを取得するために、そのような統合機能を記述できます。たとえば、これを「asa」で始まるすべての CSS クラスにすることが可能です。そのデータを抽出し、記録と評価用の処理を行う外部の分析サービスに送信できます。

通常、統合機能スクリプトは JavaScript ファイルですが、JSP を使用して増強することもできます。

ポータルには、ページ・ビルダーのテーマとスキンで機能するサンプルの統合機能が含まれています。これらはすでに Dojo フレームワークに基づいているため、サンプルの統合機能も Dojo を使用します。

しかし、アクティブ・サイト分析フレームワーク全体では、Dojo への一般的な依存関係はありません。代わりに、統合機能は、テーマとスキンの実装方法の詳細に基づきます。たとえば、テーマとスキンが Dojo を使用しない場合は、統合機能で Dojo を使用する必要はありません。

つまり、統合機能はテーマとスキンの一部として開発および管理しなければなりません。

サンプル・コード

Websphere Portal 7.0 に含まれている asa_sample.js ファイルのリストを以下に示します。このコードを使用して、独自のカスタム統合機能を作成する方法を見ていきましょう。

メモ: サンプル・コードは、本書に適合するように再フォーマットされています。

// This is a sample for an Active Site Analytics aggregator. 
// 
// It injects a 1x1 pixel image into every page that has the metadata
// item "asa_aggregator" set to "asa_sample.js" 

 
// The aggregator will assemble the image URL, containing a list of
// portlet ids and titles, as well as a number of additional data, as
// HTTP GET parameters, in the query part of the URL. The image is then
// added to the page (and requested by the browser, subsequently). 
// 

// Testing the sample aggregator 
// 
// 1. Follow the Infocenter topic "Adding an Active Site Analytics
//    aggregator to a portal page" 
// 
// 2. In this script, change the value of the variable 'trackingImg'
//    to point to location that is reachable for a browser via HTTP
//    (e.g. local Apache server). 
// 
// 3. Using a browser, load the page to which an aggregator was
//    assigned in step 1 
// 
// 4. Check the log file of the HTTP server where the URL from step 2
// points to. 
// It looks something like this: 
//   http://example.com/tracking.gif

//asa.portlet.id=xyz0987654321abc&asa.portlet.title=Example&asa.visitor
//=1234567890ABCDEFG&asa.url=/wps/myportal/Home/asa&asa.page.title=Samp
//le_Page&asa.page.id=XYZ123ABC4567890&asa.page.breadcrumb=/Home/ASA" 
//width="1" height="1"> 
// 
// 5. Check that the query information contained in the requested URL
//    corresponds to details of the page and portlets. 
// 
// For debug purposes, the presence of the tracking picture in the DOM
// can be checked with dojo.query("[alt *= 'ASA']") on the client
// side, e.g. in FireBug. 

var trackingImg = "http://example.com/tracking.gif"; 

// Subscribe to search events 
dojo.subscribe("com.ibm.portal.search.RESULTS_ANALYTICS", function(e)
{ 
 // enable this statement for debugging 
 //console.log( "*** search term was '" + e.query 
 //               + "' with " + e.results 
 //               + " results in scope '" + e.scope.label + "' (" + 
 //               e.scope.id + ")" 
 //              ); 
}); 

// Only submit to analytics server once the page is complete 
dojo.subscribe("com.ibm.portal.theme.portlet_ready", function()
{ 
   var imgURL = trackingImg + "?" + retrieveData(dojo.query("[class *= 
      'asa']")); 
   dojo.create("img", {src:imgURL, alt:"ASA Tracking Image"}, 
      dojo.body()); 
 //   console.log("*** page initially loaded. Reported URL is: " +

 //   imgURL); // enable this line for debugging 
}); 

// Helper - extract all instances of asa microformats and return them 
//          as parameter string 
function retrieveData(nodes)
{ 
   var result = new String(); 
   
   nodes.forEach(function(node, index, arr)
   { 
      var key = dojo.attr(node, "class").match(/asa¥.[^¥s]*/); 
      var val = cleanup(dojox.xml.parser.textContent(node)); 
	  
      if (0 < result.length) 
        result += "&" 

      result += escape(key) + "=" + escape(val); 
   }); 

 return result; 
}

// Helper - remove clutter from values 
function cleanup(node_value)
{ 
    return dojo.map(node_value.split('/'), function(part)
    { 
      return dojo.trim(part).replace('¥n', '')
    }).join('/'); 
}

サンプルの統合機能の説明

サンプルの統合機能は、ポータル・ページに組み込まれた後、どの Javascript コードもすぐには呼び出しません。代わりに Dojo トピックの listen を開始し、そのトピックにイベントが公開されたときに呼び出されるイベント・ハンドラーを添付します。その理由は、ページ・マークアップがブラウザーに配信されたときに、マイクロフォーマットのすべてのインスタンスがその中に存在するとは限らないからです。一部のインスタンスは、ブラウザーがマークアップをレンダリングした後でのみ、Javascript を使用してページに注入されます。検索結果にも、同様のアプローチが使用されます。

すべてのデータがページ内に存在し、Dojo イベントがトピックに公開されると、分析情報 (ページ名、ポートレット・タイトルなど) を含む照会文字列がイメージ URL に追加されます。サンプル・コードはヘルパー関数 retrieveData を使用します。この関数は、関数の呼び出し時に渡されたすべてのノードに反復処理を行います。ノードごとに、ノードの CSS クラスの名前とノードのテキスト・コンテンツが「キー = 値」のペアとしてフォーマットされ、ヘルパー関数の戻り値に付加されます。

ノード値から不要なホワイト・スペースを削除するために、cleanup という別のヘルパー関数が使用されます。

getElementHTMLByClassName 関数

Dojo が利用できない、または統合機能に適さない場合、同様の機能を達成するために次のコードを使用できます。

function getElementHTMLByClassName(strTagName, strClassName, 
arrReturnElements){
      var arrElements = document.getElementsByTagName(strTagName);
      strClassName = strClassName.replace(/¥-/g, "¥¥-");
      var regex = new RegExp("(^|¥¥s)" + strClassName + "(¥¥s|$)");
      var elem;
      for(var i = 0; i < arrElements.length; i++){
           elem = arrElements[i];
           if(regex.test(elem.className)){
                arrReturnElements.push(elem.innerHTML);
           }
      }
      return (arrReturnElements)
}

この機能は、htmlドキュメント全体をスキャンします。タグが"strTagname"と定義され、かつクラス名が "strClassName" と定義されているすべての要素を検索し、"arrReturnElements"と定義された配列へ、検索された要素をセットします。

例えば

htmlドキュメントが次のライン(コード)を持っていた場合

<span class="test" style="display:none;">abcdef></span>

次の機能が呼び出されます。

getElementHTMLByClassName(“span”, “test”, testArray)

配列 "testArray" に "abcdef"を挿入するでしょう。

Portletタイトルを検索します。

最初のセクションのコードは、現在のページのすべてのポートレットのタイトルを得るのにgetElementHTMLByClassName関数を使用します。結果は配列portletTitlesにロードされます。

// retrieve portlet titles tagged with 
// <spanclass="asa.portlet.title"/>
var portletTitles = new Array();

getElementHTMLByClassName("span","asa.portlet.title", portletTitles);
Retrieving Portlet IDs

次のセクションは、現在のページのすべてのportletsのIDを得るためにgetElementHTMLByClassNameを呼びだします。

// retrieve portlet IDs tagged with <span class="asa.portlet.id"/>
var portletIDs = new Array();

getElementHTMLByClassName("span", "asa.portlet.id", portletIDs);

ページタイトルとURLを検索します。

ページHTMLは“rel=”bookmark”があるリンクノードを含むでしょう。このノードはページタイトルとページurlを含む属性を含みます。

<link rel="bookmark" title='Test' href='/wps/mypoc/!
ut/p/nm/oid:6_4OPHUKG1089IE0IIST7F831000' hreflang="en"/>

以下のコードは、次のセクションで使用するために、そのリンクノードとストアを検索します(注意: あるいはasa.page.titleタグは、ページタイトルの場所を見つけるのに使用されるかもしれません)。

// retrieve the page's link node containing the bookmark
var bookmarkElement = null;
var links = document.getElementsByTagName("link");
for (var index = 0; index < links.length; index++) {
     var elem = links[index];
     if (elem.getAttribute("rel") == "bookmark") {
          bookmarkElement = elem;
          break;
     }
}

イメージおよび URL の作成

コードの最後のセクションでは、イメージ要素の src 属性の一部として分析データを送信するために URL をセットアップします。title 属性および href 属性を得るために、上記で取得したブックマーク要素が使用されている点に注目してください。最後の行では、img タグを 1 x 1 ピクセルのイメージとして html 文書に書き出しています。

var imgURL =  "http://example.com/analytics/tracking.png"
              + "?" + "page_title=" + 
escape(bookmarkElement.getAttribute("title"))
              + "&" + "page_url=" + 
escape(bookmarkElement.getAttribute("href"))
              + "&" + "portlets=" + escape(portletTitles.join(','))
              + "&" + "portlet_ids=" + escape(portletIDs.join(','))
//alert("imgURL = " + imgURL); 
document.write("<img alt='' src='" + imgURL + "' width='1' 
height='1'>");

統合機能を作成するための追加ヒント

HTML 文書の DOM ツリーから関連情報を取得するために、統合機能はメタデータのすべてのインスタンスに反復処理を行うことができます。反復ループ内では、統合機能が外部の分析サービスの要件に応じて個々のデータを収集し、フォーマットします。

メタデータのすべてのインスタンスを収集すると、統合機能は新しい要素 (たとえば、img 要素) を現在のページの HTML DOM ツリーに追加します。外部の分析サービスを示すソース URL をこの要素に追加することで、そのリモート・ロケーションからのブラウザー要求がトリガーされます。要素の URL には収集されたメタデータが HTTP GET パラメーターとして含まれているため、ブラウザーはこのデータを外部の分析サービスに送信することになります。

ポータル・ページへの ASA 統合機能の追加

ポータル管理者は統合機能を管理できます。また、1 つ以上のポータル・ラベルまたはページに統合機能を割り当てられます。

ポータル管理者は、ページのプロパティーを編集し、新規パラメーターを追加することで統合機能をページに割り当てます。これを行うには、ポータル管理ポートレットを使用し、次の手順に従います。

  1. 「管理」 -> 「ページの管理」をクリックします。
  2. 統合機能を割り当てるページを見つけます。ページの検索には「ページの管理」ポートレットを使用します。
  3. 選択したページの「ページ・プロパティーの編集」ボタンをクリックします。
  4. 利用可能な選択肢を展開表示するために、「拡張オプション」の横にあるプラス符号 (+) のアイコンをクリックします。
  5. 「パラメーターを設定する」リンクをクリックします。
  6. 「新規パラメーター」フィールドに「asa.aggregator」と入力します。
  7. 「新しい値」フィールドに、統合機能スクリプト・ファイルの名前を入力します (この場合は asa_sample.js です)。
  8. 「追加」をクリックします。
  9. 新規パラメーターがリストに追加されたことを確認します。
  10. 「asa_js」で始まるすべてのページ・メタデータが、統合機能で使用できる ibm_page_metadata という JS オブジェクトに追加されます。メタデータの値は、「=」で始まっていない限り文字列として扱われます。「=」で始まる場合は、JS コードまたは式 (つまり、formulaformula‘) として扱われます。「OK」をクリックし、メインの「ページ・プロパティー」画面に戻ります。
  11. 「OK」をクリックして変更を保存し、「ページの管理」画面に戻ります。
  12. インストール済みテーマの js ディレクトリーに統合機能スクリプトを配置して、テーマがこのスクリプトを見つけられるようにします。PageBuilder テーマについては、WebDAV を使用して実行中のポータルでテーマを更新できます。カスタム・テーマも同じ方法で編集できます。あるいは、デプロイ前に統合機能とともにカスタム・テーマを更新することもできます。

メモ: 子ページは、親ページに設定されたスクリプトを継承します。子ページで別の統合機能を使用したい場合は、上記と同じ手順を子ページに実行し、適切な割り当てを行う必要があります。

アクティブ・サイト分析用のテーマの設定

WebSphere Portal には、アクティブ・サイト分析での使用に適した「タブ・メニュー ― ページ・ビルダー」テーマが用意されています。また、他のポータル・テーマを強化したり、独自のカスタム・テーマを作成したりして、アクティブ・サイト分析機能を活用できます。

カスタム・テーマでアクティブ・サイト分析を機能させるには、次の作業が必要です。

  1. メタデータをページに追加する。
  2. 統合機能をページにインクルードする。
  3. 関心のある項目、つまり収集したい統計データに関連する項目のマイクロフォーマットをインクルードする。

ページへのメタデータの追加

統合機能は、ページの DOM (Document Object Model) ツリーに格納されている情報を取り出します。この情報は、ページの HTML ソースに存在しなければなりません。この情報をページに追加するための推奨アプローチは、ページの DOM ツリーに必要な情報をすべて書き込めるように、テーマまたはスキンを実装することです。

例を示します。

  1. スキンの Control.jsp に次の行を追加することにより、ポートレットの ID を DOM ツリーに追加できます。
    <span class="asa.portlet.id" style="display:none;"><%= 
    myPortletID %></span>

    次に、統合機能は、「asa.portlet.id」というクラス属性を持つ生成済みのすべての「span」要素に反復処理を行い、ページ上のすべてのポートレットの ID を取り出すことができます。


    メモ: この行は、Control.jsp の前の部分にある myPortletID の定義に基づいています。デフォルトでは、これは次の JSP コードを使用して定義されます。

    <portal-skin:portletID var="myPortletID"/>
    <jsp:useBean id="myPortletID" class="java.lang.String" 
    scope="page"/>
  2. Control.jsp で、「asa.portlet.title」クラス属性を持つ span 要素を用いて <portal-skin:portletTitle> ステートメントをラッピングすることにより、ポートレット・タイトルを DOM ツリーに追加できます。
    <span class="asa.portlet.title"><portal-
    skin:portletTitle></portal-skin:portletTitle</span>

ページへの統合機能のインクルード

ポータルには、テーマの拡張ポイント com.ibm.portal.theme.plugin.ActiveSiteAnalyticsItems のデフォルトの実装が含まれています。これは、ページ・メタデータとともに提供されるキー asa_aggregator によって指定された値に対応する名前を持つ JavaScript を特定し、インクルードします。テーマの Default.jsp ファイルにある終了側の body タグ ( </body> ) の近くに、次のコードを追加します。

<portal-theme-ext:themeExtension 
id="com.ibm.portal.theme.plugin.ActiveSiteAnalyticsItems">
  <portal-theme-ext:themeExtensionLoop>
    <portal-theme-ext:themeExtensionItemText />
  </portal-theme-ext:themeExtensionLoop>
</portal-theme-ext:themeExtension>

このコードは、テーマの拡張ポイントの各実装に対してループし、各実装を実行します。ポータルに含まれるデフォルトの実装は、上記で概説したアプローチに従っています。

関心のある項目のマイクロフォーマットのインクルード

ページのレンダリング時に、キャプチャーしたいすべてのマイクロフォーマット情報が存在するように、テーマによって使用されるスキンを変更することが必要な場合があります。たとえば、次のコードをスキンの Control.jsp ファイルに追加すると、ページ上のすべてのポートレットのポートレット ID が統合機能のスクリプトによって検出されるようになります。

<span class="asa.portlet.id" style="display:none;"><%= myPortletID 
%></span>

この場合、asa_sample.js ファイルはクラスが asa.portlet.id の要素を検索し、ページに存在するすべてのポートレットのポートレット ID を検出します。ポートレットのタイトルは、次のようなコードを使用してレンダリングできます。

<portal-skin:portletTitle />

このようなポートレット・タイトルを取得するために、タイトル用に定義されたクラスを持つ span 要素を追加できます。分析用の JavaScript ファイルは、この要素を検索します。

<span class="asa.portlet.title"><portal-skin:portletTitle /></span>

この場合は、asa.portlet.title が、ポートレット・タイトルのレンダリング済みテキストを含むすべての span 要素のためのクラスとして認識されます。

トラブルシューティング

アクティブ・サイト分析が正しく機能しない場合は、次の項目をチェックしてください。

  • ポータル・ページの HTML マークアップに、統合機能が検索するメタデータが含まれていることを確認します。
  • テーマ、スキン、ポートレットで使用されるタグ付けの方法が、統合機能が求めている動作と一致していることを確認します。たとえば、ポータルに含まれる「タブ・メニュー - ページ・ビルダー」テーマでは、「asa」で始まる名前の CSS クラスを持つすべてのメタデータにタグが付けられます。サンプルの統合機能はポートレット ID とポートレット・タイトルを取得するために、これらの CSS クラスを検索します。
  • 統合機能は通常の JavaScript ファイルです。このため、一般的な JavaScript デバッグに利用可能なすべてのツールとヘルパーを統合機能の開発およびデバッグにも適用できます。

ダウンロード可能なリソース


コメント

コメントを登録するにはサインインあるいは登録してください。

static.content.url=http://www.ibm.com/developerworks/js/artrating/
SITE_ID=60
Zone=Lotus
ArticleID=642974
ArticleTitle=WebSphere Portal 7.0 でのアクティブ・サイト分析の有効化
publish-date=03312011