10 コンテンツ・プレゼンタ表示テンプレートの開発
JDeveloperを使用して、WebCenter Portalで使用するための新しいコンテンツ・プレゼンタ表示テンプレートを作成、編集および公開します。
ノート:
コンテンツ・プレゼンタでは、Oracle WebCenter Content Serverベースのコンテンツのみを使用できます。他のコンテンツ・リポジトリ接続タイプはサポートされません。
この章の内容は次のとおりです。
コンテンツ・プレゼンタ表示テンプレートの開発の概要
コンテンツ・プレゼンタ表示テンプレートとは、コンテンツ・プレゼンタがポータル・ページでコンテンツ・アイテム(イメージやテキストなど)をレンダリングする方法を定義するJSFFファイル(JSFページ・フラグメント)です。
WebCenter Portalには即時利用可能な表示テンプレートがいくつか装備されており、これらを使用してすぐに作業を開始できますが、特定の表示要件を満たすために独自のテンプレートを作成することもできます。
コンテンツ・プレゼンタ表示テンプレートが値を提供する標準的な状況を次に示します。
-
ページの異なる部分に対して異なるレイアウトを提供します。たとえば、同じページに異なるソースからの記事があり、各記事に独自のレイアウトが必要な場合が考えられます(詳細は、「複数アイテムの表示テンプレートの定義方法」を参照)。
-
表示デバイスの機能に基づいてコンテンツを表示します。表示デバイスが標準モニター、タブレット、スマートフォンのどれかに応じて、表示テンプレートを提供できます(詳細は、「レスポンシブ・テンプレートの使用方法」を参照)。
コンテンツ・プレゼンタ表示テンプレートを使用してコンテンツを使用可能にすることによって、手動で個々のレイアウトを作成することなく、標準化されたテンプレートで複雑な表示問題を解決できます。他のユーザーが表示テンプレートを使用できるようにすると、開発者を介さずに、事前に定義された部署または会社の標準に基づいてレイアウトの要件を解決できます。
ヒント:
サンプル表示テンプレートは$ORACLE_HOME/jdeveloper/webcenter/samples/contentpresenter
に格納されています。これらのサンプル・ファイルは、Oracle JDeveloperに対するWebCenter Portalの拡張機能の一部としてインストールされています。
表示テンプレートでは充実したADFコンポーネントをすべて使用できるので、コンテンツを表示するために堅牢で人目を引くテンプレートをすばやく簡単に作成できます。ただし、テンプレートでこれらのコンポーネントを使用する必要はありません。
コンテンツ・プレゼンタ表示テンプレートでは、単一コンテンツ・アイテム、複数コンテンツ・アイテムまたは双方の組合せを処理できます。たとえば、複数コンテンツ・アイテムのテンプレートで各アイテムのタブをレンダリングしてから、単一アイテムのテンプレートをコールして選択アイテムの詳細をレンダリングできます。
各コンテンツ・アイテムは、Oracle WebCenter Content Serverリポジトリで定義された特定のコンテンツ・タイプに関連付けらます。コンテンツ・タイプはコンテンツ・アイテムのプロパティを定義します。コンテンツ・タイプはWebCenter Content Serverプロファイル定義とSite Studioリージョン定義にマップできます。
ヒント:
コンテンツ・プレゼンタ表示テンプレートを使用して、Site Studioリージョン・テンプレートではなくSite StudioとWebCenter Portalを統合することをお薦めします。推奨フローは次のとおりです。
-
Site Studioでリージョン定義を開発します。
-
JDeveloperを使用して、リージョン定義を参照するコンテンツ・プレゼンタ表示テンプレートを開発します。
-
テンプレートをWebCenter Portalに公開します。
-
コンテンツ・プレゼンタを使用して、コンテンツをレンダリングし、ユーザーがコンテンツを提供できるようにします。
コンテンツ・タイプはコンテンツ・リポジトリ(WebCenter Content Server)で作成されます。コンテンツ・プレゼンタ表示テンプレートの開発者は、選択されたコンテンツ・アイテムのページ上での表示方法を定義できるように、関連付けられたコンテンツ・タイプに定義されたプロパティの名前を知っておくことが必要です。
ヒント:
WebCenter Content Serverで定義されている既存のコンテンツ・タイプのプロパティを判断する方法の1つとして、ポータルの「コンテンツ・プレゼンタ構成」ダイアログを使用します。この方法の詳細は、「コンテンツ・タイプのプロパティ名の見つけ方」を参照してください。
実行時に権限のあるエンド・ユーザーは、「コンテンツ・プレゼンタ構成」ダイアログで表示テンプレートを選択できます。コンテンツ・プレゼンタ・テンプレートの使用時期と使用方法の決定、およびベスト・プラクティスの詳細は、次のブログ・エントリを参照してください。
http://www.ateam-oracle.com/portal-and-content-content-integration-best-practices
。
コンテンツ・プレゼンタ表示テンプレートの作成
この項では、新しいカスタム視覚化テンプレートの作成方法について説明します。内容は次のとおりです。
コンテンツ・プレゼンタ表示テンプレートの作成方法
この項では、新しいコンテンツ・プレゼンタ表示テンプレート用にWebCenter Portalアセット・アプリケーションを作成する方法について説明します。
コンテンツ・プレゼンタ表示テンプレートに関する必知事項
コンテンツ・プレゼンタ表示テンプレートの定義方法は、ニーズに応じて異なります。一般的には、コンテンツの特定単一アイテムについて表示テンプレートを定義してから、単一アイテムの表示テンプレートへのコールを含む複数コンテンツ・アイテムの表示テンプレートを定義します。
視覚化テンプレート・アセット・アプリケーションを作成すると、次のアーティファクトとともにデフォルト・テンプレートが生成されます。
-
ビュー・フラグメント・ファイル(
ContentPresenterTemplate-SingleItem1.jsff
など)
このファイルは図10-3に示すようにアプリケーション・ナビゲータに表示されます。
図10-3 コンテンツ・プレゼンタ表示テンプレート・アセット・アプリケーションのアーティファクト
![図10-3の説明が続きます 図10-3の説明が続きます](img/jpsdg_cp_disptmpart_png.png)
「図10-3 コンテンツ・プレゼンタ表示テンプレート・アセット・アプリケーションのアーティファクト」の説明
テンプレート定義には、次のように他の表示テンプレートへのコールを含めることができます。
-
単一コンテンツ・アイテムの表示テンプレートは、別の単一コンテンツ・アイテムの表示テンプレートをコールできます。
-
複数コンテンツ・アイテムの表示テンプレートは、単一コンテンツ・アイテムの表示テンプレートをコールできます(次の例を参照)。
-
複数コンテンツ・アイテムの表示テンプレートは、別の複数コンテンツ・アイテムの表示テンプレートをコールできます。
コンテンツ・プレゼンタ表示テンプレートを作成する際の基本的なタスクは、次のとおりです。
-
単一アイテムと複数アイテムのいずれの表示テンプレートを作成するかを決定します。「単一アイテムの表示テンプレートの定義方法」および「複数アイテムの表示テンプレートの定義方法」を参照してください。
-
選択したコンテンツ・アイテムについてどのような情報を表示するかを決定します。また、この情報を取得して表示するために、たとえば、WebCenter PortalのEL式をテンプレートで使用することも検討してください。EL式の使用方法の詳細は、「EL式を使用したコンテンツ・アイテム情報の取得方法」および「式言語式」を参照してください。
-
テンプレートのルック・アンド・フィールをデザインします。標準のJSFF構造に加えて、表示テンプレートではADFコンポーネントを使用できます(『Oracle ADF FacesによるWebユーザー・インタフェースの開発』を参照)。
-
テンプレートを共有アセットまたはポータル固有のアセットとして公開します。「コンテンツ・プレゼンタ表示テンプレートの公開」を参照してください。
-
『Oracle WebCenter Portalの管理』のコンテンツ・プレゼンタのキャッシュ設定の変更に関する項の説明に従って、本番環境(オプションですが推奨)およびHA環境(必須)用のキャッシュ・メカニズムとしてCoherenceを使用するようにコンテンツ・プレゼンタを構成します。
コンテンツ・プレゼンタ表示テンプレートの編集
コンテンツ・プレゼンタ表示テンプレートの初期フレームワークを作成したら、編集してそのテンプレートを定義する必要があります。
この項では、次の項目について説明します。
単一アイテムの表示テンプレートの定義方法
コンテンツ・プレゼンタ表示テンプレートを作成する単一コンテンツ・アイテムの例を次に示します。
-
ページ上で特定ルック・アンド・フィールで表示する個々のアイテム。
-
特定タイプのアイテムの異なるビュー(例: 記事の短いビューと詳細ビュー)。
-
類似アイテムの異なるバージョン(例: グループ別に異なるプロパティ・セットを使用して異なる方法でフォーマットされるプレス・リリース)。
単一アイテムの表示テンプレートを定義するには:
-
アプリケーション・ナビゲータで、表示テンプレートのJSFFファイルを右クリックし、「開く」を選択します。
-
必要に応じて、「ウィンドウ」→「コンポーネント」の順に選択してコンポーネント・パレットを開きます。
-
コンポーネント・パレット最上部のドロップダウン・リスト(図10-4)で、次の手順に従います。
-
表示テンプレート・タグのリストは、「WebCenterコンテンツ表示テンプレート」を選択します。
-
renderProperty
タグは、「WebCenterコンテンツ管理フェース」を選択します。
-
-
「ソース」ビューで、必要な表示テンプレート・タグをコンポーネント・パレットからページにドラッグ・アンド・ドロップして、テンプレートを定義します。各タグと必須のパラメータ値の詳細は、「単一コンテンツ・アイテムのコンテンツ表示テンプレートのタグ」を参照してください。
次の2つの例は、単一コンテンツ・アイテムの表示テンプレートのサンプル定義を示しています。これらの例のユース・ケースでは、特定のス類のドキュメント(プレス・リリース)が、会社内の2つの異なる部門によって作成され、それぞれの部門で独自のコンテンツ・タイプとプロパティを定義しています。これらのサンプル・コンテンツ・プレゼンタ表示テンプレートでは、これらの2つの異なるコンテンツ・タイプを一貫した方法で表示できます。
1つ目の例に示すテンプレートは、プレス・リリース・ドキュメントの見出しを表すxHeading
という名前のプロパティと、そのドキュメントの場所を表すxDestinationUrl
を使用するプレス・リリースを処理します。所定のコンテンツ・タイプに対するこのようなプロパティ名の取得方法を学ぶには、「コンテンツ・タイプのプロパティ名の見つけ方」を参照してください。
<?xml version = '1.0'?> <jsp:root xmlns:jsp="http://java.sun.com/JSP/Page" version="2.1" xmlns:af="http://xmlns.oracle.com/adf/faces/rich" xmlns:dt="http://xmlns.oracle.com/webcenter/content/templates"> <dt:contentTemplateDef var="node"> <af:goImageLink text="#{node.propertyMap['xHeading'].value}" id="gil1" icon="#{node.icon.smallIcon}" destination="#{node.propertyMap['xDestinationUrl'].value}" targetFrame="_blank"> </af:goImageLink> </dt:contentTemplateDef> </jsp:root>
次の例に示すテンプレートは、プレス・リリース・ドキュメントの見出しを表すdDocTitle
という名前のプロパティと、そのドキュメントの場所を表すxLinkUrl
を使用するプレス・リリースを処理します。
<?xml version = '1.0'?> <jsp:root xmlns:jsp="http://java.sun.com/JSP/Page" version="2.1" xmlns:af="http://xmlns.oracle.com/adf/faces/rich" xmlns:dt="http://xmlns.oracle.com/webcenter/content/templates"> <dt:contentTemplateDef var="node"> <af:goImageLink text="#{node.propertyMap['dDocTitle'].value}" id="gil1" icon="#{node.icon.smallIcon}" destination="#{node.propertyMap['xLinkUrl'].value}" targetFrame="_blank"> </af:goImageLink> </dt:contentTemplateDef> </jsp:root>
単一コンテンツ・アイテムのコンテンツ表示テンプレートのタグ
単一コンテンツ・アイテムの表示テンプレートの定義では、次に示すJSPタグを使用します。
表10-1 単一コンテンツ・アイテムのコンテンツ表示テンプレートのタグ
JSPタグ | 説明 | 例 |
---|---|---|
|
必須。単一コンテンツ・アイテムのテンプレートを定義します。 属性:
|
<dt:contentTemplateDef var="node"> <af:outputText value="#{node.name}" /> </dt:contentTemplateDef> |
|
オプション。指定ノード・プロパティの文字列値をインラインで取得およびレンダリングします。 属性:
|
<!--
Handling of text-based primary
properties (HTML, text, etc.).
-->
<dt:contentTemplateDef var="node">
<cmf:renderProperty id="rp1"
name="#{node.primaryProperty.name}"
node="#{node}"/>
</dt:contentTemplateDef> |
|
オプション。 別の単一アイテム・テンプレートをコールします。 属性:
|
<dt:contentTemplateDef var="node">
<af:outputText value="#{node.name}" >
<dt:contentTemplate node="#{node}"
view="templates.pressrelease.item"
/>
</af:outputText>
</dt:contentTemplateDef> |
複数アイテムの表示テンプレートの定義方法
コンテンツ・プレゼンタ表示テンプレートを作成する複数コンテンツ・アイテムの例を次に示します。
-
1つのページに表示する一群の類似アイテム(例: 本のリストや写真による従業員名簿)。
-
問合せ結果(例: 先週変更された全ドキュメント)。
-
Oracle WebCenter Content Serverフォルダの全ドキュメントのリスト。
コンテンツ・プレゼンタ表示テンプレートでは、単一アイテムと複数アイテムを組み合せることもできます。たとえば、複数コンテンツ・アイテムのテンプレートで各アイテムのタブをレンダリングしてから、単一アイテムのテンプレートをコールして選択アイテムの詳細をレンダリングできます。これを実行する方法の例は、次のブログ・エントリを参照してください。
http://www.ateam-oracle.com/enable-content-editing-of-iterative-components
複数アイテムの表示テンプレートを定義するには:
次の例は、複数コンテンツ・アイテムの表示テンプレートのサンプル定義を示しています。
このテンプレート定義では、参照されるビュー(view="mycorp.content.templates.pressrelease.listitem"
)に従って、表示するように選択されたデータ・アイテムを順に処理します。
<?xml version = '1.0'?>
<jsp:root xmlns:jsp="http://java.sun.com/JSP/Page" version="2.1"
xmlns:af="http://xmlns.oracle.com/adf/faces/rich"
xmlns:dt="http://xmlns.oracle.com/webcenter/content/templates">
<dt:contentListTemplateDef var="nodes">
<af:panelGroupLayout layout="scroll" id="nodeListPanel" valign="middle">
<af:iterator rows="0" var="node" varStatus="iterator" value="#{nodes}">
<dt:contentTemplate node="#{node}"
view="mycorp.content.templates.pressrelease.listitem"
nodesHint="#{nodes}"/>
</af:iterator>
</af:panelGroupLayout>
</dt:contentListTemplateDef>
</jsp:root>
複数コンテンツ・アイテムのコンテンツ表示テンプレートのタグ
複数コンテンツ・アイテムの表示テンプレートの定義では、次に示すJSPタグを使用します。
表10-2 複数コンテンツ・アイテムのコンテンツ表示テンプレートのタグ
JSPタグ | 説明 | 例 |
---|---|---|
|
必須。複数コンテンツ・アイテムのテンプレートを定義します。 属性:
|
<dt:contentListTemplateDef var="nodes"> <af:iterator value="#{nodes}" var="node"> <af:outputText value="#{node.name}" /> </af:iterator> </dt:contentListTemplateDef> |
|
オプション。 別の複数アイテム・テンプレートをコールします。 属性:
|
<dt:contentListTemplateDef var="nodes">
<!--
Reuse the default bulleted list view, but
indent it with a <blockquote>
-->
<f:verbatim>
<blockquote>
</f:verbatim>
<dt:contentListTemplate nodes="#{nodes}"
category="oracle.webcenter.content.
templates.default.category"
view="oracle.webcenter.content.
templates.default.list.bulleted"/>
<f:verbatim>
</blockquote>
</f:verbatim>
</dt:contentListTemplateDef> |
|
オプション。 単一アイテム・テンプレートをコールします。 属性:
|
<dt:contentListTemplateDef var="nodes">
<af:iterator rows="0" var="node"
varStatus="iterator" value="#{nodes}">
<dt:contentTemplate node="#{node}"
view="templates.pressrelease.listitem"
nodesHint="#{nodes}"/>
</af:iterator>
</dt:contentListTemplateDef> |
レスポンシブ・テンプレートの使用方法
この項には次のトピックが含まれます:
レスポンシブ・テンプレートについて
CSS3 Media Queriesを使用すると、コンテンツをレンダリングして、画面解像度などの条件に適応できます。
デフォルトのコンテンツ・プレゼンタ表示テンプレート「記事ビュー」
および「全記事ビュー」
は、コンテンツ・プレゼンタ表示テンプレートでレスポンシブ・レイアウト用にCSS3 Media Queriesをどのように使用できるかの例です。これらのレスポンシブ・テンプレートの拡張方法の詳細は、「レスポンシブ・テンプレートの拡張方法」を参照してください。スマートフォン、タブレットなどのモバイル・デバイス用のビューポート設定の最適化の詳細は、『Oracle WebCenter Portalでのポータルの構築』のモバイル・デバイス用のポータルの最適化に関する項を参照してください。
レスポンシブ・テンプレートの前提条件
デフォルトのコンテンツ・プレゼンタ・テンプレート「記事ビュー」
および「全記事ビュー」
は、Site Studio RD_ARTICLE
リージョン定義に依存します。
そのため、「記事ビュー」
および「全記事ビュー」
のコンテンツ・プレゼンタ表示テンプレートを使用可能にするには、Site StudioをOracle WebCenter Content Serverで有効にする必要があります。
次のステップに従って、Site Studioを有効にし、WebCenter Content ServerをRD_ARTICLE
リージョン定義でシードします。
- Site Studioを有効にします(『Oracle WebCenter Portalでのポータルの構築』のSite Studio統合の理解に関する項を参照)。
- Site Studioが有効になったら、WebCenter Portalを起動(または再起動)します(これで、
RD_ARTICLE
リージョン定義がシードされます)。
複数記事の表示
次の例のテンプレート定義では、表示するために選択されたデータ・アイテムを順に処理し、3つのスタイル・クラスを使用します。
-
article
- 各コンテンツ・アイテムに適用 -
article-3
- ページが3列の行に分割される場合、最初の列に配置される各コンテンツ・アイテムに適用 -
article-2
- ページが2列の行に分割される場合、最初の列に配置される各コンテンツ・アイテムに適用
スタイル・クラスは、articles.css
スタイル・シートに定義されています。
<?xml version = '1.0'?> <jsp:root xmlns:jsp="http://java.sun.com/JSP/Page" version="2.1" xmlns:af="http://xmlns.oracle.com/adf/faces/rich" xmlns:dt="http://xmlns.oracle.com/webcenter/content/templates" xmlns:f="http://java.sun.com/jsf/core" xmlns:h="http://java.sun.com/jsf/html" xmlns:rah="http://xmlns.oracle.com/webcenter/resourcehandler" <dt:contentListTemplateDef var="nodes"> <af:resource type="css" source="/oracle/webcenter/content/templates/seeded/articles.css"/> <af:iterator rows="0" var="node" varStatus="iterator" value="#{nodes}" id="it0"> <h:panelGroup styleClass="#{(iterator.index % 3 == 0) ? 'article-3 ' : ''}#{(iterator.index % 2 == 0) ? 'article-2 ' : ''}article" id="pg1"> <af:commandLink immediate="true" partialSubmit="true" id="cl2"> <rah:resourceActionBehavior id="rah1" serviceId="oracle.webcenter.content.presenter" resourceId="#{node.id}" resourceTitle="#{node.propertyMap['RD_ARTICLE:TITLE'].asTextHtml}" useResourcePopup="never"/> <f:attribute name="taskFlowInstId" value="a5fafea8-90e6-4972-997d-314401b6c98b"/> <f:attribute name="datasourceType" value="dsTypeSingleNode"/> <f:attribute name="datasource" value="#{node.id.repositoryName}#dDocName:#{node.propertyMap['dDocName'].value}"/> <f:attribute name="templateView" value="oracle.webcenter.content.templates.sitestudio.fullarticle"/> <f:attribute name="regionTemplate" value="#{false}"/> <af:outputText value="#{node.propertyMap['RD_ARTICLE:IMAGE'].asTextHtml}" escape="false" id="ot4"/> <tr:panelHeader text="#{node.propertyMap['RD_ARTICLE:TITLE'].asTextHtml}" id="ph1"> <af:outputText value="#{node.propertyMap['RD_ARTICLE:SUMMARY'].asTextHtml}" escape="false" id="ot3"/> </af:panelHeader> </af:commandLink> </h:panelGroup> </af:iterator> </dt:contentListTemplateDef> </jsp:root>
CSS3 Media Queriesの使用
次の例のスタイル・シートでは、ブラウザの幅に応じて異なる方法でコンテンツをレンダリングするために、Media Queriesを使用します。
/* Default styles */ .article { display: block; float: left; width: 31.623931623931625%; margin-left: 2.564102564102564%; margin-bottom: 1em; } .article-3 { margin-left: 0; clear: both; } .article img { width: 100%; margin: 0 0 .25em; float: none; padding-top: 0; display: block; border: 0; } .article h1 { font-size: 1.5em; } @media only screen and (max-width : 480px) { /* up to width of iPhone (excluding iPhone 5 in landscape) */ .article { margin-top: .5em; float: left; display: inline; width: 100%; margin-left: 0; } .article-3 { width: 100%; clear: none; } .article img { margin-right: 4%; width: 48%; float: left; } .article { font-size: 1em; } .article h1 { font-size: 1.25em; } } @media only screen and (min-width : 481px) and (max-width : 780px) { /* up to the width of iPad in portrait and iPhone 5 in landscape */ .article { display: block; float: left; width: 48.71794871794871%; margin-left: 2.564102564102564%; clear: none; } .article-3 { margin-left: 2.564102564102564%; clear: none; } .article-2 { margin-left: 0; clear: both; } .article h1 { font-size: 1.25em; } } @media only screen and (min-width : 769px) and (max-width : 1024px) { /* up to the width of iPad in landscape */ } @media only screen and (min-width : 1025px) { /* desktop */ }
レスポンシブ・テンプレートの拡張方法
次の各項では、デフォルトのテンプレートがローカル要件を満たさない場合に、それらの変更に必要なステップを説明します。
スマートフォン、タブレットなどのモバイル・デバイス用のビューポート設定の最適化の詳細は、『Oracle WebCenter Portalでのポータルの構築』のモバイル・デバイス用のポータルの最適化に関する項を参照してください。
この項には次のトピックが含まれます:
デフォルトのテンプレートの適応方法
この項では、「記事ビュー」
および「全記事ビュー」
テンプレートに対して行う変更、およびその変更方法の概要について説明します。
たとえば:
-
Internet Explorer 8などの古いブラウザでレスポンシブ・レイアウトをサポートするようにテンプレートを更新する場合。
-
異なるリージョン定義を操作するようにテンプレートを更新する場合。
以下の節ではこれらの拡張機能について説明します。
古いブラウザ用のレスポンシブ・レイアウトのサポート方法
現在のレスポンシブ・テンプレートはCSS3 Media Queriesに依存しますが、古いブラウザではサポートされていません。そのため、レスポンシブ・デザインを有効にするには、Media Queriesを受理してJavaScriptを使用できる、サード・パーティのJavaScriptライブラリを使用する必要があります。
古いブラウザ用にレスポンシブ・レイアウトをサポートするには:
異なるリージョン定義の使用方法
この項では、レスポンシブ・テンプレートでリージョン定義を変更する方法を示します。
たとえば、TITLE
、LEAD
、IMAGE
およびBODY
という4つの要素(「カスタム・ビューでのSite Studioリージョン要素の参照方法」を参照)を持つRD_NEWS
というリージョン定義があるとします。この場合、この新しいリージョン定義を参照するようにテンプレートを更新するには、RD_ARTICLES
の参照をRD_NEWS
に変更し、SUMMARY
の参照をLEAD
に変更します。
ニュース・ビュー
このテンプレートは、「記事ビュー」
テンプレートに基づいて新しいアイテム(RD_NEWS
タイプ)のリストを表示します。
<?xml version = '1.0'?> <jsp:root xmlns:jsp="http://java.sun.com/JSP/Page" version="2.1" xmlns:af="http://xmlns.oracle.com/adf/faces/rich" xmlns:dt="http://xmlns.oracle.com/webcenter/content/templates" xmlns:f="http://java.sun.com/jsf/core" xmlns:h="http://java.sun.com/jsf/html" xmlns:rah="http://xmlns.oracle.com/webcenter/resourcehandler" xmlns:tr="http://myfaces.apache.org/trinidad"> <dt:contentListTemplateDef var="nodes"> <af:resource type="css" source="/oracle/webcenter/content/templates/seeded/articles.css"/> <af:iterator rows="0" var="node" varStatus="iterator" value="#{nodes}" id="it0"> <h:panelGroup styleClass="#{(iterator.index % 3 == 0) ? 'article-3 ' : ''}#{(iterator.index % 2 == 0) ? 'article-2 ' : ''}article" id="pg1"> <af:commandLink immediate="true" partialSubmit="true" id="cl2"> <rah:resourceActionBehavior id="rah1" serviceId="oracle.webcenter.content.presenter" resourceId="#{node.id}" resourceTitle="#{node.propertyMap['RD_NEWS:TITLE'].asTextHtml}" useResourcePopup="never"/> <f:attribute name="taskFlowInstId" value="a5fafea8-90e6-4972-997d-314401b6c98b"/> <f:attribute name="datasourceType" value="dsTypeSingleNode"/> <f:attribute name="datasource" value="#{node.id.repositoryName}#dDocName:#{node.propertyMap['dDocName'].value}"/> <f:attribute name="templateView" value="oracle.webcenter.content.templates.newsitem"/> <f:attribute name="regionTemplate" value="#{false}"/> <af:outputText value="#{node.propertyMap['RD_NEWS:IMAGE'].asTextHtml}" escape="false" id="ot4"/> <tr:panelHeader text="#{node.propertyMap['RD_NEWS:TITLE'].asTextHtml}" id="ph1"> <af:outputText value="#{node.propertyMap['RD_NEWS:LEAD'].asTextHtml}" escape="false" id="ot3"/> </tr:panelHeader> </af:commandLink> </h:panelGroup> </af:iterator> </dt:contentListTemplateDef> </jsp:root>
ニュース・アイテム・ビュー
このテンプレートは、「全記事ビュー」
テンプレートに基づいてニュース・アイテム全体(View ID: oracle.webcenter.content.templates.newsitem
)を表示します。
<?xml version = '1.0'?> <jsp:root xmlns:jsp="http://java.sun.com/JSP/Page" version="2.1" xmlns:af="http://xmlns.oracle.com/adf/faces/rich" xmlns:dt="http://xmlns.oracle.com/webcenter/content/templates" xmlns:f="http://java.sun.com/jsf/core" xmlns:h="http://java.sun.com/jsf/html" xmlns:tr="http://myfaces.apache.org/trinidad"> <dt:contentTemplateDef var="node"> <af:resource type="css" source="/oracle/webcenter/content/templates/seeded/articles.css"/> <af:panelGroupLayout id="psl1" layout="vertical"> <tr:panelHeader text="#{node.propertyMap['RD_NEWS:TITLE'].asTextHtml}" styleClass="full-article" id="ph1"> <tr:panelGroupLayout id="pgl1" styleClass="full-article-image"> <af:outputText value="#{node.propertyMap['RD_NEWS:IMAGE'].asTextHtml}" escape="false" id="ot4"/> </tr:panelGroupLayout> <af:outputText value="#{node.propertyMap['RD_NEWS:BODY'].asTextHtml}" escape="false" id="ot3"/> </tr:panelHeader> </af:panelGroupLayout> </dt:contentTemplateDef> </jsp:root>
テンプレートのレイアウトの更新方法
コンテンツにより適合するようにテンプレートのレイアウトを変更するとします。
たとえば、1列のレイアウトでは、記事の要約のテキストが長い場合、「記事ビュー」
テンプレートはそのテキストをイメージの下にも表示します。
これを変更して、イメージの下にテキストが表示されないようにできます。
これを行うには、「記事ビュー」
テンプレートに基づいて新しいテンプレートを作成し、テキストのブロックにスタイル・クラス(article-text
)を追加して、このスタイル・クラスの表示CSSプロパティを、狭いレイアウト用のtable-cell
に設定します。
<?xml version = '1.0'?> <jsp:root xmlns:jsp="http://java.sun.com/JSP/Page" version="2.1" xmlns:af="http://xmlns.oracle.com/adf/faces/rich" xmlns:dt="http://xmlns.oracle.com/webcenter/content/templates" xmlns:f="http://java.sun.com/jsf/core" xmlns:h="http://java.sun.com/jsf/html" xmlns:rah="http://xmlns.oracle.com/webcenter/resourcehandler" <dt:contentListTemplateDef var="nodes"> <af:resource type="css"> /* Default styles */ .article { display: block; float: left; width: 31.623931623931625%; margin-left: 2.564102564102564%; margin-bottom: 1em; } .article-3 { margin-left: 0; clear: both; } .article img { width: 100%; margin: 0 0 .25em; float: none; padding-top: 0; display: block; border: 0; } .article h1 { font-size: 1.5em; } @media only screen and (max-width : 480px) { /* up to width of iPhone */ .article { margin-top: .5em; float: left; display: inline; width: 100%; margin-left: 0; } .article-3 { width: 100%; clear: none; } .article img { margin-right: 4%; width: 48%; float: left; } .article { font-size: 1em; } .article h1 { font-size: 1.25em; } /* Set the display CSS property to table-cell for the article-text style class in the narrow layout */ .article-text { display: table-cell; } } @media only screen and (min-width : 481px) and (max-width : 780px) { /* up to the width of iPad in portrait */ .article { display: block; float: left; width: 48.71794871794871%; margin-left: 2.564102564102564%; clear: none; } .article-3 { margin-left: 2.564102564102564%; clear: none; } .article-2 { margin-left: 0; clear: both; } .article h1 { font-size: 1.25em; } } @media only screen and (min-width : 769px) and (max-width : 1024px) { /* up to the width of iPad in landscape */ } @media only screen and (min-width : 1025px) { /* desktop */ } </af:resource> <af:iterator rows="0" var="node" varStatus="iterator" value="#{nodes}" id="it0"> <h:panelGroup styleClass="#{(iterator.index % 3 == 0) ? 'article-3 ' : ''}#{(iterator.index % 2 == 0) ? 'article-2 ' : ''}article" id="pg1"> <af:commandLink immediate="true" partialSubmit="true" id="cl2"> <rah:resourceActionBehavior id="rah1" serviceId="oracle.webcenter.content.presenter" resourceId="#{node.id}" resourceTitle="#{node.propertyMap['RD_ARTICLE:TITLE'].asTextHtml}" useResourcePopup="never"/> <f:attribute name="taskFlowInstId" value="a5fafea8-90e6-4972-997d-314401b6c98b"/> <f:attribute name="datasourceType" value="dsTypeSingleNode"/> <f:attribute name="datasource" value="#{node.id.repositoryName}#dDocName:#{node.propertyMap['dDocName'].value}"/> <f:attribute name="templateView" value="oracle.webcenter.content.templates.sitestudio.fullarticle"/> <f:attribute name="regionTemplate" value="#{false}"/> <af:outputText value="#{node.propertyMap['RD_ARTICLE:IMAGE'].asTextHtml}" escape="false" id="ot4"/> <af:panelHeader text="#{node.propertyMap['RD_ARTICLE:TITLE'].asTextHtml}" id="ph1" styleClass="article-text"> <af:outputText value="#{node.propertyMap['RD_ARTICLE:SUMMARY'].asTextHtml}" escape="false" id="ot3"/> </af:panelHeader> </af:commandLink> </h:panelGroup> </af:iterator> </dt:contentListTemplateDef> </jsp:root>
コンテンツ・プレゼンタ表示テンプレートでのイメージ・レンディションの使用方法
この項には次のトピックが含まれます:
イメージ・レンディションについて
異なる状況においては異なるイメージのレンディションを使用する場合があります。
たとえば、デスクトップ・ブラウザを使用してイメージを含むページを表示する場合、大きくて解像度の高いイメージを使用する場合があります。ただし、同じページをモバイル・デバイスで表示する場合、スクリーン・サイズは小さく、ダウンロード・スピードは遅くなることが予想されるため、解像度の高いイメージは適切でない可能性があります。モバイル・デバイスでは、小さくて解像度の低いバージョンやレンディションのイメージの方が適しています。コンテンツ・プレゼンタ表示テンプレートには、イメージのどのレンディションをどの状況で表示するかを指定する機能があります。
異なるイメージ・レンディションの使用を可能にするために、コンテンツ・プレゼンタ表示テンプレートではEL式を使用してどのイメージ・レンディションをいつ使用するかを決定できます。
ノート:
イメージ・レンディションはCMISではサポートされていません。
イメージ・レンディションの前提条件
フル・イメージ・レンディションをサポートするには、イメージがチェックインされているOracle WebCenter Content ServerでDigital Asset Management (DAM)が有効になっている必要があります。
DAMが有効でない場合、web
レンディションおよびthumbnail
レンディションのみがそれぞれサポートされます。DAMの有効化の詳細は、『Oracle WebCenter Portalの管理』のDigital Asset Managerの有効化に関する項を参照してください。
DAMが有効な場合、イメージがチェックインする際に様々なレンディションが自動的に作成され、チェックイン時にレンディション・セットによって判断されます。DAMには組込みレンディション・セットがいくつか用意されていますが、WebCenter Content Server管理者が新しいレンディション・セットを作成することもできます。個々のレンディションは、適切なEL式を使用することでコンテンツ・プレゼンタ表示テンプレートの名前で参照できます。
DAMおよびレンディション・セットの詳細は、『Oracle WebCenter Contentのマネージメント』の「イメージおよびビデオ変換の操作」を参照してください。
ノート:
WebCenter Portalでは、イメージのみの複数のレンディションをサポートします(ビデオはサポートしません)。
また、次のその他の前提条件が満たされている必要があります。
-
Oracle WebCenter Content リリース11gR1 (11.1.1.9.0)以降を使用する必要があります。
-
WebCenter PortalおよびWebCenter Contentは同じOHSフロント・エンドを使用する必要があります。
-
webContextRoot
パラメータは、WebCenter PortalがWebCenter Contentオブジェクトを検出できるように、共通のOHSフロント・エンドを使用してインラインに設定(/cs
など)する必要があります。 -
WebCenter PortalとWebCenter Content間で、シングル・サインオンが使用可能である必要があります。
イメージ・ドキュメントのイメージ・レンディション情報の取得
コンテンツ・プレゼンタ表示テンプレートでイメージ・ドキュメントのイメージ・レンディション情報を取得するには、次のEL式を使用します。
node.renditionsMap['renditionName:renditionProperty']
説明:
-
renditionName
は次のとおりです。-
DAM実装では、適切なレンディション・セットからのレンディションの名前です。たとえば、
web
、thumbnail
、preview
またはlowres
です。 -
非DAM実装では、
web
またはthumbnail
です。ノート:
renditionName
では、大文字と小文字を区別しないため、preview
はPreview
と同じレンディションを指します。
-
-
renditionProperty
は必須のレンディション情報です。多くの場合、ページにレンディションを表示できるようにイメージ・レンディションのURLを取得します。これには、
url
プロパティを使用します。name
、type
、width
、height
、resolution
、size
またはcontentType
などのレンディションに関するその他の情報も取得できます。ノート:
web
レンディションおよびthumbnail
レンディションでは、size
、contentType
およびurl
を適用でき、name
はwebレンディションやthumbnailレンディションの名前ではなく、ネイティブ・ファイルの名前を返します。
たとえば、イメージのpreview
レンディションを表示するには、次の情報を表示テンプレートに追加します。
<af:image source="#{node.renditionsMap['preview:url']}" shortDesc="Preview rendition" id="imageContent3"/>
ノート:
可能である場合、url
はWebCenter Content Serverのイメージ・レンディションの静的レンディションURLを指します。静的URL特定できない場合、url
はWebCenter Portal showProperty
サーブレットを使用します。
次の例では、イメージのカルーセルを表示するコンテンツ・プレゼンタ表示テンプレートを示します。カルーセルがデスクトップ・デバイスに表示される場合(rendered="#{DeviceAgent.desktop}
)、イメージにはa200
レンディションが使用されます(node.renditionsMap['a200:url']
)。カルーセルがモバイル・デバイスに表示される場合(rendered="#{DeviceAgent.mobile}
)、小さいthumbnail
レンディションが使用されます(node.renditionsMap['thumbnail:url']
)。
<?xml version='1.0' encoding='utf-8'?> <!-- Copyright (c) 2014 Oracle and/or its affiliates. All rights reserved. --> <jsp:root xmlns:jsp="http://java.sun.com/JSP/Page" version="2.1" xmlns:af="http://xmlns.oracle.com/adf/faces/rich" xmlns:dt="http://xmlns.oracle.com/webcenter/content/templates" xmlns:f="http://java.sun.com/jsf/core"> <dt:contentListTemplateDef var="nodes"> <af:carousel id="c1" value="#{nodes}" var="node" emptyText="#{templateBundle.EMPTY_NODES}" inlineStyle="#{DeviceAgent.desktop ? '' : 'height:200px;'}"> <f:facet name="nodeStamp"> <af:carouselItem id="ci1" text="#{node.isFolder ? node.name : (empty node.propertyMap['dDocTitle'] ? node.name : node.propertyMap['dDocTitle'].value.stringValue)}" shortDesc="#{not empty node.propertyMap['xComments'].value.stringValue ? node.propertyMap['xComments'].value.stringValue : node.primaryProperty.value.binaryValue.name}"> <af:image id="cimg1" source="#{node.primaryProperty.isImage ? node.renditionsMap['a200:url'] : node.icon.largeIcon}" shortDesc="#{node.primaryProperty.value.binaryValue.name}" rendered="#{DeviceAgent.desktop}"/> <af:image id="cimg2" source="#{node.primaryProperty.isImage ? node.renditionsMap['thumbnail:url'] : node.icon.largeIcon}" shortDesc="#{node.primaryProperty.value.binaryValue.name}" rendered="#{DeviceAgent.mobile}"/> </af:carouselItem> </f:facet> </af:carousel> </dt:contentListTemplateDef> </jsp:root>
Site Studioリージョン定義のイメージ・レンディションの取得
Site Studioリージョン定義にあるイメージのイメージ・レンディションの扱いは、Site Studio内でリージョン定義が定義されている方法によって決まります。
基本イメージを定義する単一のリージョン要素を含むリージョン定義またはイメージ・レンディションごとに別々のリージョン要素を含むリージョン定義のいずれかを保持できます。コンテンツ・プレゼンタ表示テンプレートでは、リージョン定義が設定されている方法に従って適切なEL式を使用する必要があります。
たとえば、リージョン定義には基本イメージの単一のリージョン要素(myimage
)を含めることができるため、特定のイメージ・レンディションを表示するために、Oracle WebCenter Content Serverからどのレンディション(highres
やlowres
など)を取得するかを指定できるEL式を使用する必要があります。あるいは、デスクトップ・ブラウザに適しているレンディションに1つの要素(desktop
)、モバイル・デバイスに適しているレンディションに1つの要素(mobile
)など、様々なイメージ・レンディションごとにそれぞれのリージョン要素がリージョン定義にある場合、使用するレンディションを定義するリージョン要素を直接指すEL式を使用できます。
ヒント:
将来、さらにイメージ・レンディションを追加する可能性が高い場合は(たとえば、新しいデバイス用に)、新規レンディションが追加されるたびに新しいリージョン要素を作成することなくコンテンツ・プレゼンタ表示テンプレートに含めることができるため、単一イメージ・リージョン要素でリージョン定義を作成することには意味があります。
-
基本イメージを定義する単一のリージョン要素がリージョン定義に含まれている場合、使用するイメージのレンディションを指定することもできます。
node.propertyMap['regionDefinitionName:elementName/Rendition:renditionName'].asTextHtml
-
特定のイメージ・レンディションを定義するリージョン定義でリージョン要素を参照するには、次のEL式を使用します。
node.propertyMap['regionDefinitionName:elementName'].asTextHtml
説明:
-
regionDefinitionName
はリージョン定義の名前です。 -
elementName
はリージョン要素の名前です。 -
renditionName
は次のとおりです。-
DAM実装では、適切なレンディション・セットからのレンディションの名前です。たとえば、
web
、thumbnail
、highres
またはlowres
です。 -
非DAM実装では、
web
またはthumbnail
です。ノート:
renditionName
では、大文字と小文字を区別しないため、preview
はPreview
と同じレンディションを指します。
-
EL式は、該当するイメージ・レンディションのURLを示すsrc
要素とともにHTML img
タグを戻します。
ノート:
可能である場合、src
URLはWebCenter Content Serverのイメージ・レンディションの静的レンディションURLを指します。静的URL特定できない場合、url
はWebCenter Portal showProperty
サーブレットを使用します。
図10-8は、記事のSite Studioリージョン定義(RD_REUSEIMG
)を表示します。定義には、記事のタイトル、サマリー、本体およびイメージのリージョン要素が含まれます。単一のイメージ・リージョン要素は元のイメージ(Image
)を定義します。
モバイル・デバイス上でイメージの低解像度レンディション(lowres
)を使用するには、次のコードを使用します。
<af:outputText value="#{node.propertyMap['RD_REUSEIMG:Image/Rendition:lowres'].asTextHtml}" escape="false" id="olmaget" rendered="#{DeviceAgent.mobile}"/>
ノート:
指定したrenditionName
がイメージに存在しない場合は、イメージのプライマリ・レンディションがかわりに使用されます。
図10-9に、別々の記事に対する別々のリージョン定義(RD_NAMEDREND
)を示します。これらには、記事のイメージに使用可能な別々のレンディションの個別のリージョン要素が含まれます。BaseImage
、ThumbnailImage
、A100Image
およびA200Image
。
モバイル・デバイス上でイメージをレンダリングするためにThumbnailImage
リージョン要素を使用するには、次のコードを使用します。
<af:outputText value="#{node.propertyMap['RD_NAMEDREND:ThumbnailImage'].asTextHtml}" escape="false" id="olmaget" rendered="#{DeviceAgent.mobile}"/>
ノート:
明示的に(基本イメージではなく)特定のイメージ・レンディションを参照するリージョン要素にrenditionName
を指定したEL式を使用する場合、(renditionName
によって指定されたレンディションではなく)リージョン要素によって定義されたレンディションが返されます。
WYSIWYGまたは静的リスト・リージョン要素内では、node.propertyMap['
regionDefinitionName
:
elementName
']
EL式を使用して、イメージの特定のレンディションを参照できます。あるいは、WYSIWGまたは静的リスト・リージョン要素で基本イメージを参照し、node.propertyMap['
regionDefinitionName
:
elementName
/Rendition:
renditionName
']
EL式を使用して要素内の全イメージに特定のレンディションを使用することもできます。
次の例では、特定のレンディション(Preview
)が静的リスト・リージョン要素(paragraph
)内のイメージにどのように使用されるかを示します。
<af:iterator value="#{node.propertyMap['RD_MYREGION:paragraph/Rendition:Preview'].values}"
var="row"
id="i1"
rendered="#{DeviceAgent.desktop}">
<af:showDetailItem text="#{row.nestedValue[0].value}" id="sdi1" stretchChildren="first">
<af:panelGroupLayout layout="horizontal" id="tt" inlineStyle="padding:5px;">
<af:outputText escape="false" value="#{row.nestedValue[1].value}" id="ld1"/>
<af:outputText escape="false" value="#{row.nestedValue[2].value}" id="ld2"/>
</af:panelGroupLayout>
</af:showDetailItem>
</af:iterator>
次の例では、RD_MYREGION:body
はWYSIWYGリージョン要素に対応します。WYSIWYG要素内のすべてのイメージはA100
レンディションを使用してレンダリングされます。
<af:outputText value="#{node.propertyMap['RD_MYREGION:body/Rendition:A100'].asTextHtml}" escape="false" id="ot5"/>
ノート:
WYSIWYGまたは静的リスト要素が特定のイメージ・レンディションを明示的に参照する場合、Rendition:
renditionName
構文を使用して指定されたレンディションにかわり、そのレンディションが使用されます。
EL式を使用したコンテンツ・アイテム情報の取得方法
この項では、コンテンツ・アイテムに関する特定情報を取得および表示するためにコンテンツ・プレゼンタ表示テンプレートの定義で使用できるEL式について説明します。
「単一アイテムの表示テンプレートの定義方法」および「複数アイテムの表示テンプレートの定義方法」の説明に従ってコンテンツ・プレゼンタ表示テンプレートを定義する際、次の表で説明するEL式を使用します。これらの式は、表10-1と表10-2で説明されている、JSPタグとともに使用します。
この項では、次の項目について説明します。
コンテンツ・アイテムに関する基本情報の取得方法
この項で示すEL式を使用すると、表示テンプレートでコンテンツ・アイテムの基本情報を表示できます。
表10-3 基本コンテンツ情報を取得するためのEL式
EL式 | 説明 |
---|---|
|
ノードの作成者のユーザー名を返します。 |
|
ノードの作成日を返します。 |
|
現在のノードが有効な親ノードIDを持っている場合または親がないノードの場合、 |
|
現在のWebアプリケーションで定義されたアイコン・サービスを返します。 |
|
ノードの識別子を返します。 |
|
このノードがフォルダまたはコンテナと関連付けられている場合、 |
|
このノードが別のオブジェクト・クラス定義によって継承された場合、 |
|
ノードの最終更新者のユーザー名を返します。 |
|
ノードの最終更新日を返します。 |
|
ノードの名前を返します。 |
|
親ノードの識別子を返します。 |
|
ノードのパスを返します。 |
|
ノードの主要プロパティがある場合、それを返します。 |
|
プロパティ名をキーとする、ラップされたプロパティ・オブジェクトのマップを作成して返します。プロパティには |
|
このノードの主要プロパティがある場合、そのノード・プロパティURLサービスのインスタンスを返します。デフォルトでは、 |
コンテンツ・アイテムのプロパティおよび値の操作方法
この項で説明するEL式を使用して、コンテンツ・アイテム・ノードのプロパティおよびプロパティ値に対してアクションを実行します。
ヒント:
所定のコンテンツ・タイプに定義されたプロパティ名を判断するには、「コンテンツ・タイプのプロパティ名の見つけ方」を参照してください。
表10-4 コンテンツ・アイテムのノード・プロパティのEL式
EL式 | 説明 |
---|---|
|
タイプがテキストまたはHTMLの場合、テキストまたはHTMLとしてこのプロパティを返します。 |
|
このプロパティに値が関連付けられている場合、 |
|
現在のWebアプリケーションで定義されたアイコン・サービスを返します。 |
|
複数値を持つプロパティのインデックス付き名前を返します。たとえば、 |
|
プロパティのMIMEタイプが |
|
現在のプロパティのタイプが |
|
現在のプロパティのタイプが |
|
現在のプロパティのタイプが |
|
現在のプロパティのタイプが |
|
プロパティのMIMEタイプが |
|
プロパティのMIMEタイプが |
|
プロパティのMIMEタイプが |
|
プロパティのMIMEタイプが |
|
プロパティのMIMEタイプが |
|
現在のプロパティのタイプが |
|
現在のプロパティのタイプが |
|
プロパティのMIMEタイプが |
|
このプロパティが複数値を持つ場合、 |
|
現在のプロパティのタイプが |
|
プロパティのMIMEタイプが |
|
プロパティのMIMEタイプが |
|
プロパティのMIMEタイプが |
|
プロパティのMIMEタイプが |
|
このプロパティが主要プロパティの場合、 |
|
このプロパティが必須の場合、 |
|
このプロパティが制限付きの場合、 |
|
プロパティのMIMEタイプが |
|
現在のプロパティのタイプが |
|
このプロパティがテキスト・ベース( |
|
プロパティのMIMEタイプが |
|
プロパティのMIMEタイプが |
|
プロパティのMIMEタイプが |
|
例: |
|
プロパティの名前を返します。 |
|
この単一値プロパティのネストされたプロパティを取得して、プロパティのリストを返します。 |
|
このプロパティ値のデータ型を返します。たとえば、 |
|
このプロパティのURLサービスを返します。 |
|
このプロパティの値サービスを返します。 |
|
静的リストの要素を返します。たとえば: <af:iterator var="listItem" value="#{node.propertyMap['ARTICLE_RGD:Paragraphs'].nestedProperties}" varStatus="vs"> <af:outputText id="ot1" value='#{listItem[0].value}'/> <af:outputText id="ot3" value="#{listItem[1].value}"/> </af:iterator> |
|
Site StudioデータをHTMLテキストとして返します。たとえば:
要素名( |
表10-5 コンテンツ・アイテムのノード・プロパティ値のEL式
EL式 | 説明 |
---|---|
|
バイナリ・プロパティ・タイプまたは添付のカスタム属性を返します。
|
|
このプロパティの値を |
|
このプロパティの値を |
|
このプロパティの値を |
|
このプロパティの値を |
|
プロパティが複数値を持つ場合、プロパティのインデックスを返します。 例: |
|
このプロパティの値を 例: |
コンテンツ・アイテムのアイコンおよびURLの操作方法
この項で説明するEL式を使用して、コンテンツ・アイテムおよびプロパティに関連付けられたアイコンおよびURLを操作します。
表10-6 コンテンツ・アイテムのノードまたはプロパティ・アイコンのEL式
EL式 | 説明 |
---|---|
|
大きいアイコンのイメージ・リソースのURLを返します。 例: |
|
小さいアイコンのイメージ・リソースのURLを返します。 例: |
表10-7 コンテンツ・アイテムのノードURLのEL式
EL式 | 説明 |
---|---|
|
バイナリ・コンテンツへのURLを作成します。ダウンロードを強制し、オペレーティング・システムはコンテンツ・タイプに基づいてコンテンツをレンダリングします。 例: |
|
バイナリ・コンテンツへのURLを作成します。コンテンツ・タイプに基づいてブラウザがコンテンツをレンダリングできるようにします。 デフォルトでは、 例: |
イメージ・レンディションの操作方法
この項では、イメージ・ドキュメントの特定のレンディションと、そのレンディションを使用してイメージをレンダリングするためのURLを含むSite Studioリージョン要素に関する情報を取得するために使用できるEL式を示します。
イメージ・レンティションの詳細は、「コンテンツ・プレゼンタ表示テンプレートでのイメージ・レンディションの使用方法」を参照してください。
表 10-8 イメージ・ドキュメントのイメージ・レンディション用EL式
EL式 | 説明 |
---|---|
|
イメージ・レンディションのURLを返します。たとえば: http://mymachine.example.com:8888/cs/groups/ personalspaces/@pewebcenter/ @799c4d7d-255c-46c8-80f5-0d06c848dd65/documents/ document/awrf/mdax/~edisp/~extract/ ID_001642~3~staticrendition/preview.gif 可能である場合、 |
|
レンディションの名前、たとえば
|
|
イメージ・レンディションのファイル・タイプ(たとえば、
|
|
ピクセルでイメージ・レンディションの幅(たとえば、
|
|
ピクセルでイメージ・レンディションの高さ(たとえば、
|
|
イメージ・レンディションの解像度(DPI)(たとえば、
|
|
イメージ・レンディションのファイル・サイズ(たとえば、 |
|
イメージ・レンディションのMIMEタイプ(たとえば、 |
表10-9 Site Studioリージョン要素のイメージ・レンディション用EL式
EL式 | 説明 |
---|---|
|
特定の要素に定義されているイメージのURLに設定されている <img src="http://mymachine.example.com:9400 /cs/idcplg?IdcService=GET_FILE&dDocName= id_038497&RevisionSelectionMethod=LatestReleased" alt="S3-1" class=""> このELを使用して、イメージの特定のレンディションを定義するSite Studioリージョン要素を示します。 可能である場合、URLはWebCenter Content Serverのイメージ・レンディションの静的レンディションURLを指します。静的URL特定できない場合、 |
|
特定の要素に定義されているイメージの特定のイメージ・レンディションのURLに設定されている <img src="/cs/groups/wc081512c/ @sb5cdcaa4610341a8bb8387effdf21790/documents/document/ awrf/mdm4/~edisp/~extract/ ID_038497~1~staticrendition/preview.gif" alt="S3-1" class=""> 指定したイメージ・レンディションがイメージに存在しない場合、基本イメージのURLが返されます。 このELを使用して、指定された 可能である場合、URLはWebCenter Content Serverのイメージ・レンディションの静的レンディションURLを指します。静的URL特定できない場合、 |
グループ・ポータル情報の操作方法
この項では、コンテンツ・プレゼンタ表示テンプレートでグループ・ポータル情報を操作するのに使用できるEL式を示します。
表10-10 基本グループ・ポータル情報のEL式
EL式 | 説明 |
---|---|
|
現在のグループ・ポータルまたは指定したグループ・ポータルを作成したユーザーを返します。 |
|
現在のポータルまたは指定したポータルが作成された日時を表す |
|
|
|
現在のポータルまたは指定したポータルのデフォルト言語を返します。 |
|
現在のポータルに関連付けられた説明と表示名を、ポータルが作成された言語で返します。ポータル名が翻訳されている場合、翻訳された名前は表示されません。 例: 財務活動に従事するすべての複合チームを評価します。 |
|
現在のポータルまたは指定したポータルに関連付けられた表示名を、ポータルが作成された言語で返します。ポータル名が翻訳されている場合、ポータルが作成された名前が表示されます。 例 Web20Portalという名前のグループ・ポータルの表示名がWeb 2.0 Portalの場合、
これは、Web 2.0 Portalと評価されます。 |
|
現在のポータルまたは指定したポータルに関連付けられた一意のIDを返します。 |
|
現在のポータルまたは指定したポータルに関連付けられたアイコンへのURLを返します。 |
|
現在のポータルまたは指定したポータルに関連付けられた検索可能なキーワードのカンマ区切りリストを返します。 |
|
現在のグループ・ポータルまたは指定したグループ・ポータルが最後に更新された日時を表す |
|
現在のポータルまたは指定したポータルのロゴに関連付けられたイメージへのパスを返します。 |
|
通常、ポータルのバックエンドでプリティURLで使用される、現在のポータルまたは指定したポータルの名前を返します。 |
|
現在のポータルまたは指定したポータルのプリティURLを返します。 |
|
ポータルが閉じられているかどうかを示すブール値を返します。 |
|
ユーザーがポータルの存在を検索または「マイ・ポータル」のリストからの取得によって検出できるかどうかを示すブール値を返します。 |
|
ポータルが遮断されているかどうかを示すブール値を返します。 |
|
ポータルがRSSフィードを公開しているかどうかを示すブール値を返します。 |
|
ユーザーによるポータルのサブスクライブが許可されているかどうかを示すブール値を返します。 |
|
現在のポータルまたは指定したポータルからのサブスクライブ解除に承認が必要かどうかを表すブール値を返します。 |
表10-11 ポータルUI情報のEL式
EL式 | 説明 |
---|---|
|
現在のポータルまたは指定したポータルに関連付けられたページ・テンプレートのIDを返します。 |
|
現在のポータルまたは指定したポータルに関連付けられたリソース・カタログのIDを返します。 |
|
現在のポータルのページ・テンプレートに関連付けられたリソース・カタログのIDを返します。 |
|
現在のポータルに関連付けられたナビゲーション・モデルのIDを返します。 |
|
現在のポータルに関連付けられたADF Facesスキン・ファミリを返します。 |
|
ポータルのフッターが非表示かどうかを表すブール値を返します。 |
|
ポータルで使用する著作権メッセージを返します。 |
|
従っているプライバシ・ポリシー・ドキュメントのURLを返します。 |
コンテンツ・タイプのプロパティ名の見つけ方
コンテンツ・プレゼンタ表示テンプレートの開発者は、選択されたコンテンツ・アイテムのページ上での表示方法を定義できるように、関連付けられたコンテンツ・タイプに定義されたプロパティの名前を知っておくことが必要です。
各コンテンツ・アイテムは、Oracle WebCenter Content Serverリポジトリで定義された特定のコンテンツ・タイプに関連付けらます。コンテンツ・タイプはWebCenter Content Serverプロファイル定義とSite Studioリージョン定義にマップできます。タイプは、WebCenter Content Server で作成され、コンテンツ・アイテムのプロパティを定義します。しかし、コンテンツ・アイテムのコンテンツ・タイプのプロパティ名は表示名とは異なり、WebCenter Content Serverから取得する必要があります。詳細は、『Oracle WebCenter Contentのマネージメント』のコンテンツ・タイプの定義に関する項を参照してください。
ノート:
RESTサービスを使用しても、コンテンツ・タイプのプロパティ名を取得できます。詳細は、「WebCenter Portal REST APIの使用」を参照してください。
表示テンプレートでの外部ファイルの参照方法
場合によっては、CSSファイルのような外部ファイルを表示テンプレートで参照する必要があります。このようなすべての参照では、Webアプリケーションのルートへの相対パスか絶対パスを指定します。
たとえば:
-
絶対パス –
http://host:port/mypath/file.css
-
相対パス –
/webcenter/mypath/file.css
外部ファイルに対するローカル参照は使用しないでください。外部ファイルに対するローカル参照は、「コンテンツ・プレゼンタ表示テンプレートの公開」の説明に従ってコンテンツ・プレゼンタ表示テンプレートをアセットとして公開する際に組み込まれないため機能しません。
カスタム・ビューでのSite Studioリージョン要素の参照方法
カスタム表示テンプレートを使用してSite Studioリージョン定義要素を表示できます。
たとえば、TITLE
、LEAD
、IMAGE
およびBODY
という4つの要素を持つRD_NEWS
というSite Studioリージョン定義があると仮定します。コンテンツ・プレゼンタ表示テンプレートでは、次のようなノード・プロパティEL式を使用して、これらの要素を参照できます。
#node.propertyMap['RD_NEWS:LEAD'].asTextHtml}
次の例に、このようなSite Studioリージョン要素をcontentTemplateDef
定義に含める方法を示します。
<dt:contentTemplateDef var="node"> <af:panelGroupLayout layout="vertical" id="pgl3"> <af:panelGroupLayout layout="horizontal" valign="top" inlineStyle="background-color:#FFF; padding:10px;" id="pgl4"> <af:panelGroupLayout layout="vertical" id="pgl2" valign="top"> <af:outputText value="#{node.propertyMap['dInDate'].value.calendarValue}" id="ot3" styleClass="bodytext" converter="javax.faces.DateTime"/> </af:panelGroupLayout> <af:spacer width="10px;" id="s1" inlineStyle="background-color:#DDD; color:white;"/> <af:panelGroupLayout layout="vertical" id="pgl1" valign="top"> <af:outputText value="#{node.propertyMap['xTargetGroup'].value}" id="ot12" inlineStyle="background-color:#0A9FC0; color:white; text-align:left; padding:5px;"/> <af:goLink text="#{node.propertyMap['RD_NEWS:TITLE'].asTextHtml}" id="gil1" destination="#{'/faces/home/news-viewer?news_id='}#{node.propertyMap['dDocName'].value}" styleClass="newstitle"/> <af:outputText value="#{node.propertyMap['RD_NEWS:LEAD'].asTextHtml}" id="ot2" styleClass="bodytext"/> </af:panelGroupLayout> <af:panelGroupLayout layout="vertical" id="pgl32" valign="top" styleClass="newsimage"> <af:outputText value="#{node.propertyMap['RD_NEWS:IMAGE'].asTextHtml}" escape="false" id="ot1" inlineStyle="max-width:100px;"/> </af:panelGroupLayout> </af:panelGroupLayout> <af:panelGroupLayout layout="horizontal" id="aaaa"> </af:panelGroupLayout> </af:panelGroupLayout> </dt:contentTemplateDef>
複数のテンプレートでSite Studioリージョン要素を参照する方法を始めから終わりまで示す完全な例は、次のURLでWebCenterアーキテクチャ・チームのブログ・エントリを参照してください。
コンテンツ・プレゼンタ表示テンプレートの公開
コンテンツ・プレゼンタ表示テンプレートを作成してページ・フラグメントを編集したら、次のステップはテンプレートを公開してWebCenter Portalでテストします。
コンテンツ・プレゼンタ表示テンプレートを共有アセットとして公開する、または特定のポータルにポータル・アセットとして公開する方法の詳細は、「WebCenter Portalアセットの公開」を参照してください。
コンテンツ・プレゼンタ表示テンプレートのパフォーマンスの最適化
コンテンツ・プレゼンタ表示テンプレートで表示するためにコンテンツ・ノードを取得すると、ほとんどのコンテンツ・アイテム・ノード・プロパティ値はノードとともに即座に取得されますが、一部の値は後で必要な場合のみロードされます。ノード・プロパティ値の選別的なロードは、パフォーマンスの違いをもたらすほか、ユーザーや開発者に透過的です。
コンテンツ・プレゼンタ表示テンプレートの開発者は、異なるプロパティ値がロードされたことに気付いた場合、テンプレートのパフォーマンスを最適化できます。たとえば、一般的なリストの表示テンプレートの場合、ノードを最初に取得したときに即座にロードされるプロパティのみを参照して、後で必要なときにロードされるプロパティを避けると、より高速にレンダリングされます。
2番目の考慮点は、ノードの取得方法(検索による方法と親IDによるフェッチする方法)によって決まります。検索(「問合せの結果」など)のためのノード取得時には即座にロードされるプロパティが、他の取得方法(「フォルダの下のコンテンツ」など)では後でロードされることがあります。表10-12は、取得メカニズム別に、ノード取得時にノード・プロパティが即座にロードされるかどうかを示しています。
表10-12 ノード取得メカニズム別のノード・プロパティのロード
OCSグローバル・プロファイル・プロパティ | ノードの初回取得時にロードするか | ||
---|---|---|---|
親IDによる取得(フォルダの下のコンテンツ) | 検索(問合せの結果) | UUIDによる取得(単一のコンテンツ・アイテムとアイテムのリスト) | |
|
N |
Y |
Y |
|
Y |
N |
Y |
|
Y |
Y |
Y |
|
Y |
Y |
Y |
|
Y |
Y |
Y |
|
Y |
Y |
Y |
|
Y |
Y |
Y |
|
Y |
Y |
Y |
|
Y |
Y |
Y |
|
Y |
Y |
Y |
|
Y |
Y |
Y |
|
Y |
N |
Y |
|
Y |
Y |
Y |
|
Y |
N |
Y |
|
Y |
N |
Y |
|
Y |
N |
Y |
|
Y |
Y |
Y |
|
Y |
N |
Y |
|
Y |
Y |
Y |
|
Y |
Y |
Y |
|
Y |
N |
Y |
|
Y |
Y |
Y |
|
N |
N |
Y |
|
Y |
Y |
Y |
|
N |
N |
Y |
|
Y |
Y |
Y |
|
Y |
Y |
Y |
|
Y |
Y |
Y |
|
Y |
Y |
Y |
|
Y |
Y |
Y |
|
Y |
Y |
Y |
コンテンツ・プレゼンタの使用(ヒント、チュートリアルおよび例)
次の補足チュートリアルおよび例に、コンテンツ・プレゼンタの使用方法を詳細に示します。
-
「UCM, Site Studio and Templates」 - WebCenter Portal内のコンテンツのやり取りを行うコンポーネント(コンテンツ・サーバー、Site Studioおよびコンテンツ・プレゼンタ)について説明します。
-
「Content Presenter-CMIS-Complete」 - コンテンツ・プレゼンタ・ベースのページや複雑なCMISおよびカスタム・テンプレートを使用して、フィルタリング可能なコンテンツ・リスト・ビューアを作成するステップを説明します。
-
PortalおよびContent - コンテンツ統合 - ベスト・プラクティス - コンテンツをポータルに統合する際に考慮するいくつかのベスト・プラクティスに注目します。
http://www.ateam-oracle.com/portal-and-content-content-integration-best-practices/