コンテンツ・レイアウトの開発

コンテンツ・レイアウトは、サイト・ページで使用されているコンテンツ・リストまたはコンテンツ・プレースホルダー・コンポーネントを使用してコンテンツ・アイテムのデータを表示するのに役立ちます。コンテンツ・タイプの複数のコンテンツ・レイアウトを作成して、異なるビューを作成したり、コンテンツ・アイテムの異なる部分を表すことができます。

たとえば、Blog-Postコンテンツ・タイプでは、Blog-Postコンテンツが使用される方法および場所に応じて異なるコンテンツ・レイアウトが必要である場合があります。サイトのホーム・ページにBlog-Postアイテムのリストが表示される場合がありますが、ホーム・ページでブログ投稿をクリックすると、「詳細」ページでそのブログ投稿の詳細を表示できます。

「ホーム」ページには、Blog-Post-Summaryコンテンツ・レイアウトをアイテム・ビューとして使用して、Blog-Postコンテンツ・タイプのアイテムをリストするように構成されたコンテンツ・リストがあります。

「詳細」ページでは、コンテンツ・プレースホルダーのBlog-Post-Headerコンテンツ・レイアウトを使用して、ヘッダー・イメージとタイトルを表示します。2列のセクション・レイアウトでは、Blog-Post-ContentとBlog-Post-Authorのコンテンツ・レイアウトを使用して、70%と30%の幅で2つのコンテンツ・プレースホルダーが囲まれます。ご覧のとおり、4つの異なるコンテンツ・レイアウトを使用して同じコンテンツ・タイプをビジュアル化しています。

次の2つの方法のいずれかでコンテンツ・レイアウトを作成できます:

  • Oracle Content Managementで、「開発者」「すべてのコンポーネントの表示」「作成」「コンテンツ・レイアウトの作成」を選択します。

  • OCEツールキット・プロジェクトで、cec create-contentlayoutコマンドを使用します。

Oracle Content Managementは、コンテンツ・タイプのデフォルトのコンテンツ・レイアウトを作成します。デフォルトのコンテンツ・レイアウトを変更するには、次のファイルを編集します:

  • assets/layout.html

    このファイルを編集してHTMLビューを変更します。

  • assets/design.css

    このファイルを編集してコンテンツ・レイアウトのスタイルを設定します。

  • assets/render.js

    このファイルを編集して、layout.htmlで使用されるデータを変更するか、コンテンツ・レイアウトに動的な動作を追加します。

コンテンツ・レイアウト・コンポーネントは、Oracle Content Managementサーバーからコンテンツ・アイテムをレンダリングします。ほとんどのアセットはOracle Content Managementサーバーに格納されています。場合によっては、スタイル設定目的のバックグラウンド・イメージなど、コンテンツ・レイアウト自体でローカルに使用できる静的アセットを使用することもできます。たとえば、次のコンテンツ・レイアウトでは、images/background.jpgの絶対URLをrender.jsで生成し、layout.htmlで使用することができます。

絶対URLを生成する最も簡単な方法は、組込みrequirejsファイルを使用することです。次のコードが示すとおり、依存性としてrequireを定義し、require.toURL()を使用してURLを生成します:

define([
    'require',
    'jquery',
    'mustache',
    'text!./layout.html',
    'css!./design.css'
], function (require, $, Mustache, templateHtml, css) {
    'use strict';

   var imageURL = req.toUrl('./images/background.jpg');

次のトピックでは、コンテンツ・レイアウトを開発する方法について説明します:

関連トピック

コンテンツ・レイアウトの管理方法の詳細は、「カスタム・コンポーネントおよびレイアウトの管理」を参照してください。

サイトでのデジタル・アセットおよびその他のコンテンツ・アイテムの使用の詳細は、Oracle Content Managementでのアセットの管理アセットの使用に関する項および「デジタル・アセットの管理」を参照してください。