| Oracle® Fusion Middleware WebCenter Sites開発者ガイド 11gリリース1 (11.1.1.8.0) E49681-03 |
|
 前 |
 次 |
Burlington Financialサンプル・サイトでは、WebCenter Sitesのアセットを使用したサイト・デザインのベスト・プラクティスを実際に使用してみます。
コンテンツ管理は、アセット、問合せおよびテンプレートの観点から記述されている場合は特に、非常に抽象的である可能性があります。Burlington Financialは、アプリケーションの最終的な成果の内容(ライブで機能するWebサイト)を理解するうえで役立ちます。開発者とコンテンツ・マネージャは、直接、簡単にサンプル・サイトのコードと問合せにアクセスできます。
この章には次の項が含まれます。
Burlington Financialは架空の金融情報のサイトです。このサイトでは、セクション間の移動、サイトの階層、サイトとアセット・タイプの連動方法、および実際のルックアンドフィールが重視されています。また、Burlington Financialには約500の記事と100以上のイメージがあり、複数のセクションに移入できる実在のコンテンツも十分に備わっています。
Burlington Financialは、次の機能が備わった完全に動作するサンプルです。
検索、メンバー・ログイン、プリンタ対応の記事、友人への電子メール、トピック・ディレクトリおよびスタイルシート
Webサイト・セクションの階層のデモ
コンポーネントのキャッシュおよびSatellite Serverのサポート
AssetMakerで作成されたアセットの使用のデモ
フレックス・アセットおよびEngageセグメント・アセットの使用のデモ
十分な量のコンテンツ
開発者が学べる実在のサイトの近似機能
Burlington Financialのホーム・ページは、次の図のとおりです。
Burlington Financialはキャッシュ可能なページレットを活用しています。これらの個々のページレットは個別にキャッシュして管理でき、開発の際にはサイトのパフォーマンスと柔軟性が高まります。
キャッシュ可能なページレットを使用してサイトを設計するようお薦めします。詳細は、第5章「ページのデザインとキャッシング」を参照してください。
Burlington Financialでは、プライマリ・ナビゲーション・バーを表示するために、次の3つのエレメントを使用しています(Oracle WebCenter Sites Explorerの使用時に確認できます)。
この項の内容は、次のとおりです。
このエレメントは、ホームページと、Burlington Financialのロゴのすぐ下にあるページの最上部にあるトップレベルの子にハイパーリンクを作成します。
「Home」ページのトップレベルの子のみを意図的に表示して、ハイパーリンクの行が折り返されてページのデザインを損なわないようにします。「Home」ページは最初に表示され、その子と同じレベルになります。
このエレメントでは、Webサイトのメジャー・セクションの詳細マップを作成し、「Home」ページの子ページおよび孫ページを確認します。このエレメントは2レベルより深く進むように変更できます。ただし、サイトのグラフィック・デザインが使用できるスペースは制限されます。
TopSiteBarにはリストされていなかった2つの別のメジャー・ページがここにリストされることに注目してください。「Wire Feed」ページおよび「Columnists」ページは「Home」ページとその子からは独立していて、個別に表示されます。
このエレメントは、すべてのページの下部にハイパーリンクを作成します。LeftSideSiteBarと同様に、BottomNavFooterエレメントも「Home」ページの子ではないページへのリンクが含まれます。
|
注意: 別のPageアセットをサイトに追加した場合、それがHome Pageアセットの子でないと、Burlington Financialで使用されるどのナビゲーション・バーにも自動的に表示されません。 |
これらのナビゲーション・バーは動的に算出されますが、実際のWebサイトでは、それほど頻繁な変更はありません。最大パフォーマンスを得るために、エレメント内の動的コードをトップレベル・ページへのハードコード化されたリンクの静的リストと置換できます。後からサイトの変更および新規トップレベル・セクションの追加が必要になった場合、少数のエレメントを変更するだけで済みます。
動的ナビゲーション・バーのエレメントを使用する場合、ナビゲーション・バーのページレットに対して長期のキャッシュ・タイムアウトを設定する必要があります。
Webサイト内のこの共通機能は、特定項目へのパスを示す小さなマップです。Burlington Financialでは、これはアクセスしたページの実際の履歴ではなく概念的なパスで、トップ・ナビゲーション・バーのすぐ下に配置されています。
WebCenter Sitesではアセットを同時に複数の親に割り当てることができるため、同じ記事が同時に「Home」ページと「News」ページのコレクションのメンバーとして表示される可能性があります。記事の真の親を識別する方法がないため、Burlington Financialでは、親Pageで子へのハイパーリンクを作成するたびに親Pageのidを渡しています。それにより、子アセットを単独で作成するときには、該当する親のIDがすでに備わっています。この値は変数pで渡されます。
テンプレートがpに対する異なった値に基づいて異なったHTMLを生成するため、それらのバージョンは個別にキャッシュされる必要があります。そのため、変数pは、そのテンプレートのSiteCatalog内のページ・エントリにリストされているページの基準変数の一部である必要があります。これは、共通的な技法といえるため、WebCenter Sitesでは、TemplateアセットのSiteCatalogページ・エントリに対応するページの基準変数のリストに、自動的にpを含めます。
pをオーバーライドして異なる親アセットを使用する必要が出てくることがあります。たとえば、次の寄稿者の記事へのリンクをBurlington Financialの「Home」ページに設定するとします。
ただし、これらの記事は概念的には「Home」ページに属しているのではなく、「Columnists」ページに属しています。したがって、Columnists PageアセットのIDをこれらのハイパーリンクの親としてロードし、渡すことができます。これにより、訪問者がそれらをクリックした際に、ブレッドクラムはColumnistsを親として識別します。この動作は、Columnistsリンクをナビゲーション・バーでクリックし、そこにあるいずれかの記事をクリックすることと同じです。
他の場合には、どのアセットが親であるかがすぐには明確になりません。たとえば、Burlington Financialで「From the Wires」ボックスの記事が現在のページの付属として処理されるとします。メインの「Wire Feed」セクション・ページにリストされたストーリーは「Wire Feed」セクションに属しており、それらの親として「Wire Feed」を示しています。
Burlington Financialサンプル・サイトでは、実際のWebサイトで使用されているその他のいくつかの重要な機能について、WebCenter Sitesのベスト・プラクティスを示しています。
この項の内容は、次のとおりです。
Burlington Financialのデータベース検索コードは、WebCenter Sitesのアプリケーション自体の検索コードに酷似しています。この検索コードは動的配信で機能しますが、エクスポートされた静的HTMLでは機能しません。この場合、静的HTMLファイルの索引付けに別の検索メカニズムが必要になります。
BurlingtonFinancial/Util/SearchPostエレメントでは、Article表に対してSQL検索を使用します。また、検索エンジンの索引がインストールされていて、Articleアセット・タイプに対して有効化されている場合には、この索引を使用することもできます。SQL検索は大/小文字を区別します。検索エンジンにより、大/小文字を区別しない検索、単語のバリアント、ステミングなどのさらに高度な検索機能が使用できるようになります。
Articleアセット・タイプには、keywordというフィールドがあります。このフィールドを使用すると、エディタは、特定の用語をArticleに関連付けて、Articleアセット・タイプの検索機能を向上できます。Burlington Financial Articleアセットには、カンマで区切られた1つ以上のキーワード(例: Energy, Shell Oil, OPEC)があります。Burlington Financialでは、キーワードを使用してHot Topicsのリストを表示します。
Burlington Financialの「Hot Topics」は、問合せアセットの1つの使用方法を示しています。
大半のページの左側に、サイトの特定のセクションを示す「Hot Topics」のリストがあります。「Hot Topics」は、Pageアセットによって指定されたとおり、訪問者が表示するセクションに従ってリストされます。
次の例では、「News」セクションの「Hot Topics」は「Human Genome」、「History」、「Sanctions」、「Energy」および「California」となっています。
エレメントBurlingtonFinancial/Common/LeftNavColumnには、ページレットBurlingtonFinancial/Query/ShowHotTopicsが含まれています。このエレメントは、変数pを通じて渡される、ページ・アセットのIDを受け取ります。pの値が検出できない場合には、デフォルトでは「Home」ページが使用されます。そのページ・アセットがロードされ、ページに関連付けられたトップ・ストーリーのコレクションが検索されてロードされます。次に、コレクション内の各記事をループさせ、記事のキーワード・フィールドからプルされたキーワードのリストを作成します(1つの記事に対する複数のキーワードはカンマで区切る必要があります)。キーワードのリストが作成されると、エレメントはHotTopicsと名付けられた問合せアセットをレンダリングして、そのキーワードに対する問合せを実行するページへのハイパーリンクとして各キーワードをリストして、そのリストをループします。
訪問者がリンクをクリックすると、HotTopicFrontテンプレートを使用して、問合せアセットHotTopicsをレンダリングするページに移動します。HotTopics問合せは、選択されたキーワードを含む記事に対して完全なSQL一致を実行します。キーワード検索には、まったく制約がありません。特定のセクションやカテゴリにある記事のみでなく、Burlington Financialサイト内のすべての記事を検索します。
HotTopics問合せで返された各記事は、訪問者が最初にキーワードで検索を開始したページ・アセットの親IDを継承します。「News」ページの「Energy stories」のリストから「Shell Oil story」をクリックすると、「News」を親ページとして表示されます。同じ「Shell Oil story」を「World News」ページの「Energy stories」のリストからクリックすると、「World News」を親として表示されます。
この設計は動的ライブ・サイトでは問題ありませんが、静的配信サイトへエクスポートする際にファイルの重複の原因となります。
「Topic Directory」へのハイパーリンクは、左側のナビゲーション・コラムの下部、および各ページの下部にあるナビゲーション・リンクにあります。
このページは、セクションごとのHot Topicsのページレットで構成されています。ここで使用されているページレットは左のナビゲーション・コラムでも使用されているため、ブラウザで非常に素早く表示されます。各トピックはその親ページを継承し、それを問合せが返す記事のリストに渡します。
記事の「Related Stories」リストに使用される問合せアセットは、前述したHotTopics問合せと似ていますが、キーワードを他のページから取得するのではなく、問合せが関連付けられている記事から取得します。Articleテンプレートの「Full」にはRelated Storiesのページレットが用意されていて、記事の最初のキーワードを問合せアセットに渡します。Related Storiesの問合せが実行されると、同じキーワードを持つその他の記事が検索されます。
たとえば、「Home」ページから「Hot Topic」の「Microsoft」をクリックし、「Microsoft launches worldwide campaign against counterfeit software」を選択します。この記事(cid=984156689788)のkeywordフィールドには、Microsoftという単語が含まれます。また、記事に関連付けられた関連キーワードの問合せもあります。この問合せがレンダリング時に実行されると、SQLはkeywordフィールドに「Microsoft」という用語が含まれているその他の記事を5つ検索します。問合せは、その問合せに関連付けられた記事は除外するよう指定されているため、「Related Stories」のサブヘッドラインには「Microsoft Campaigns Against Counterfeit Software」が表示されません。
動的な環境では、この問合せから返される記事のリストはサイトに追加される記事として変更できます。
Webページのテキストのみのバージョン作成(印刷用に)は、非常に簡単にWebCenter Sitesで実装できます。WebCenter Sitesのレンダリング・モデルを使用すると、レンダリングに使用するページ名を変更するだけで指定されたアセットを表示するテンプレートをオーバーライドできます。オーバーライド・テンプレートを個別のパラメータとして渡す必要はありません。ページのプリンタ優先バージョンは、該当するテンプレートのプレーン・テキスト・バージョンを使用するハイパーリンクを追加するだけで作成できます。
たとえば、記事をポイントする場合は、次のURLにアクセスします。
http://myserver/servlet/ContentServer?pagename=BurlingtonFinancial/Article/Full&cid=987654321
ページのテキストのみのバージョンを変更するには、テンプレートのテキスト・バージョンをポイントします。
http://myserver/servlet/ContentServer?pagename=BurlingtonFinancial/Article/FullText&cid=987654321
Burlington Financialでは、Templateアセット名の最後にTextを追加する表記規則を使用して、別のスタイルのテンプレートとエレメントを指定します。その例は、次のとおりです。
Webフォーマット: BurlingtonFinancial/Article/Summary
プレーン・テキスト: BurlingtonFinancial/Article/SummaryText
Webフォーマット: BurlingtonFinancial/Page/SectionFront
プレーン・テキスト: BurlingtonFinancial/Page/SectionFrontText
ほとんどのWebサイトでは、テキストのみのページにはフル・フォーマットのWebページに戻るハイパーリンクが備わっています。そうでない場合は、プリンタ優先ページにナビゲートするリンクはありません。ただし、Burlington Financialのテンプレートは訪問者にサイトのプレーン・テキスト・バージョン全体を表示するために設計されています。
プレーン・テキスト・バージョンに切り替えた後は、プレーン・テキスト・ページのままで移動できます。しかし、Burlington Financialサイトのすべての単独ページがサイトのプレーン・テキスト・バージョンで表示されるわけではありません。さらに、プレーン・テキスト・ページはグラフィック・バージョンと同じコンテンツやハイパーリンクを備えていない場合もあります。これは、プレーン・テキストの訪問者は複雑でないサイトのバージョンを好むと考えられるため、意図的に処理されたものです。Burlington Financialを拡張してその他のパラレル・スタイル(WAPテンプレート、WebTV、PDF、XML)を追加することは、非常に簡単です。
Webサイトのもう1つの一般的な機能は、ストーリーの電子メール送信機能です。Burlington Financialでは、この機能は比較的簡単です。
|
注意: ユーザーに電子メールを送信するには、電子メール機能を使用するためにWebCenter SitesとContent Centreを構成する必要があります。 まず、 cs.emailreturnto=<your email address> cs.emailhost=po-1.example.com (or the emailhost is) 次に、 xcelerate.emailnotification=true |
BurlingtonFinancial/Util/EmailFrontエレメントとBurlingtonFinancial/Util/EmailPostエレメントは、記事のページレットBurlingtonFinancial/Article/Summaryをコールし、サマリー・フォームにそのストーリーを表示します。このコードのさらに強力なバージョンでは、訪問者がフォームを送信する前に、有効な電子メール・アドレスが入力されていることが確認されます。実際のサイトでも、電子メールで送信されたストーリー、送信者の電子メール・アドレス、および受信者の電子メール・アドレスの記録が保存されます。
AssetMakerは、ベーシック・アセット・タイプを構成するWebCenter Sitesユーティリティです。Burlington Financialには、ImageFileとStylesheetの2つのサンプルAssetMakerアセット・タイプが用意されています。これらのアセット・タイプは、AssetMakerからの標準エレメントを変更せずに使用します。どちらにもデータベース内にファイルを格納するためのファイル・アップロード・フィールドが備わっています。
Burlington Financialには各ページの上部にJavaScriptが備わっており、クライアント側のブラウザを検出し、該当する4つのStylesheetアセットの1つをロードします。エレメントBurlingtonFinancial/Common/SetHTMLHeaderは、各ページ全体のテンプレートの最上部でコールされ、WebCenter SitesのエレメントGetBlobURLを使用して4つの異なるBlobServer URLを取得します。これは、Burlington Financialで使用される4つの異なる各Stylesheetアセットに対するURLです。Stylesheetアセットからの実際の.cssファイルは、バイナリ・データではない場合でも、BlobServerを介して提供されます。
イメージ・ファイル・アセット・タイプおよびスタイルシート・アセット・タイプのどちらも、BlobServerサーブレットを使用してブラウザに提供されます。ブラウザがコンテンツの任意の部分の処理方法を認識できるように、MIMEタイプ・コードが保存され、ブラウザに渡されます。WebCenter Sitesには、これらのコードを格納するためのMimeType表が用意されています。
AssetMakerでは、アセット・タイプによって独自のMIMEタイプ・フィールドを定義できます。ImageFileアセット・タイプとStylesheetアセット・タイプのどちらにも、アセット記述子ファイルの一部としてMIMEタイプ・フィールドが含まれています。Oracle WebCenter Sites Explorerまたはその他のデータベース・ツールを使用して、独自のMIMEタイプ・コードと拡張子をMimeType表に追加できます。
コレクション・アセット・タイプでは、WebCenter Sitesでコンテンツを管理可能なグループに配置する方法を指定します。Burlington Financialでは、子アセット・タイプがコレクションであるコレクションもデモで使用して確認できます。これにより、エディタはコレクションをランク付けしなおすだけで、Webページ上のコンテンツのグループを簡単に再配置できます。これらのサブコレクションを使用して、お気に入りのストーリーのライブラリ、ニュース速報、ホット・トピックなどを作成できます。
Burlington Financialでは、HomeStoryGroupsという名前付きアセット・アソシエーションが、ページ・アセット・タイプからコレクション・アセット・タイプに作成済です。ページ・テンプレートSectionFrontは、StoryGroupsスロットのコレクションを検索します。コレクションは、BurlingtonFinancial/Collection/StoryGroupsテンプレートを使用して強制的に表示されます。
<ASSET.CHILDREN NAME="SectionFrontPage" LIST="StoryGroups" CODE="HomeStoryGroups"/
<IF COND="IsList.StoryGroups=true"
<THEN
<RENDER.SATELLITEPAGE PAGENAME="BurlingtonFinancial/Collection/StoryGroups"
ARGS_cid="StoryGroups.oid"
ARGS_p="Variables.asset:id"/
</THEN
</IF
The StoryGroups template then loops over each collection in the asset:
<LOOP LIST="theGroups"
<RENDER.SATELLITEPAGE PAGENAME="BurlingtonFinancial/Collection/PlainList"
ARGS_cid="theGroups.oid"
ARGS_p="Variables.p"/
<img src="/futuretense_cs/bf/images/dot_rule_125.gif" width="125" height="1"/<P/
</LOOP
これはニュース・ページで確認できます。ニュース・ページに関連付けられたNewsGroupというコレクションがあります。このコレクションには、それ自体が3つの記事を持つ、Energy Listと呼ばれる子コレクションが1つ含まれています。これにより、エディタはNewsGroupコレクションのランク付けをしなおして、アイテムを「News」ページに追加したり、「News」ページから削除したりできます。
Burlington Financialサンプル・サイトには、新規メンバーのサインアップおよび既存メンバーのログインを実行するエレメントが含まれたメンバーシップ・コンポーネントが用意されています。これらの訪問者登録エレメントは、実際のWebサイトで使用できるほど強力ではありませんが、独自のデザインの開始ポイントとして使用できます。たとえば、Burlington Financialには訪問者アカウントのサンプル画面があり、これを使用すると、訪問者はそれぞれのプリファレンスを登録して設定できます。ただし、この情報を使用して、特定のWebページに対する訪問者のアクセスを制限したり、メンバーのプロファイルに基づいて推奨したりすることはありません。
Burlington Financialの訪問者の登録と一般的なセキュリティの詳細は、第31章「配信システムにおけるユーザー管理」を参照してください。
ホームページ・テンプレートおよびセクション・フロント・ページ・テンプレートのどちらにも、「From the Wires」というストーリーのリストが用意されています。これは、自動的に取り込まれるコンテンツを表しています。大きなサイトでは、通常、ワイヤー・フィード・サービスやその他のコンテンツ・アグリゲータをサブスクライブします。これらのソースからのストーリーは、人の手をほとんど介さずサイトに移動します。
Burlington Financialの主要セクションを構成する各ページ・アセットは、問合せアセットに関連付けられています。ワイヤー・フィード・セクションの場合、この問合せアセットにはソース・フィールドがWireFeedに設定されている記事アセットを検索するための問合せが含まれています。これらの問合せも各記事のカテゴリ・フィールドを確認します。Burlington Financialの各セクションにはストーリーの特定のカテゴリが含まれているため、ワイヤー・フィードの問合せではそれらのカテゴリとの一致が試行されます。
WireFeedと名付けられたページ・アセットには、それらのカテゴリとは無関係にワイヤー・フィード・ストーリーを返す問合せが含まれてます。
資金セクションのフロント・ページ・テンプレートには、Featured Fundsという資金のリストが用意されています。このリストには、Engageセグメント・アセットを使用して選択された資金が記載されています。セグメント・アセットは、訪問者を共通した特徴に基づいてグループ化します。
セグメント・アセットを作成するには、まず訪問者のデータ・アセットを作成します。訪問者のデータ・アセットには、Webサイトへの訪問者に関する郵便番号などの情報が格納されます。セグメントを作成するには、セグメントの基となる訪問者データ・アセットを選択し、その基準の条件を満たす値を設定します。たとえば、郵便番号の訪問者データ・アセット内の値を使用して、地元企業の広告を表示する郵便番号セグメントを作成できます。
「Featured Funds」リストは、Webサイトの訪問者がBFfrequentvisitorセグメントまたはHighriskinvestorセグメントのいずれに属しているかに基づいて資金を表示します。
Fund Finderは、選択した基準に基づいて資金を検索できるフォームです。一部の「Fund Finder」フォームのドロップダウンはフォームにハードコード化されます。ただし、フォームが検索するFund Familiesは、assetsetおよびsearchstateの概念を使用して動的にリストに記入されます。
searchstateは、属性値に基づく一連の検索絞込み条件です。
<SEARCHSTATE.CREATE NAME="ss"/> <ASSETSET.SETSEARCHEDASSETS NAME="as" ASSETTYPES="ProductGroups" CONSTRAINT="ss"/> <ASSETSET.GETATTRIBUTEVALUES NAME="as" TYPENAME="PAttributes" ATTRIBUTE="FundFamily" LISTVARNAME="fflist"/> <P> <SELECT name="FundFamily" SIZE="3" MULTIPLE="1"> <OPTION SELECTED="" VALUE="NoPreference"/>No Preference <LOOP LIST="fflist"><OPTION/><csvar NAME="fflist.value"/> </LOOP> </SELECT> </P>
デフォルトでは、Templateアセットを保存する際に作成されるどのSiteCatalogページ・エントリにも、cacheinfoプロパティがcs.pgcachefolder,*に設定されます。ただし、ページをキャッシュしない選択もあります。
BurlingtonFinancial/Util/LoginPostやBurlingtonFinancial/Page/AccountAccessなどのページは、特にcs.nevercacheに設定されます。それらのページは訪問者専用であるため、この設定は必要です。また、特定の訪問者に別の訪問者のキャッシュ済ページの結果を表示しない必要があります。実際のお客様サイトでは、キャッシュを各ページで微調整する必要があります。
WebCenter Sitesには、SiteCatalogエントリの作成に対応した一連のデフォルト・ページ基準が用意されています。その他のページ基準の変数を追加することも可能ですが、デフォルト値は削除できません。キャッシュおよびページ基準の詳細は、第5章「ページのデザインとキャッシング」を参照してください。
