プライマリ・コンテンツに移動
Oracle® Fusion Middleware Oracle Site Studio Designerの使用
12c (12.2.1)
E67373-01
  ドキュメント・ライブラリへ移動
ライブラリ
目次へ移動
目次
索引へ移動
索引

前
 
次
 

8 テンプレートの操作

Oracle Site Studioでは、テンプレートを使用してWebサイト上にコンテンツを配置します。テンプレートはHTMLファイルであり、このうちページ・テンプレートが<HEAD>と<BODY>のタグを含む完全なファイルである一方、サブテンプレートおよびリージョン・テンプレートは部分的なHTMLセクションで、ページ・テンプレートの<BODY>タグ間に配置され、本文に関連するコンテンツにのみ使用されます。

この項の内容は次のとおりです。

8.1 テンプレートについて

テンプレートとは、Webサイト上にコンテンツを配置するために使用するファイルのことです。テンプレートはHTMLファイルであり、このうちページ・テンプレートが<HEAD>と<BODY>のタグを含む完全なファイルである一方、サブテンプレートおよびリージョン・テンプレートは部分的なHTMLセクションで、ページ・テンプレートの<BODY>タグ間に配置され、本文に関連するコンテンツにのみ使用されます。

Oracle Site StudioでのWebサイトの処理方法は、通常のWebサイト開発ツールとは異なります。これが明確にわかるのは、ページ・テンプレート、サブテンプレートおよびリージョン・テンプレートの使用方法です。

これらの任意のテンプレートに、どのような静的コンテンツおよび動的コンテンツでも追加できます。ただし、これらの各テンプレートでの作業時間が長くなるにつれ、ページに直接追加する静的コンテンツを比較的少なくする方が合理的である理由がわかります。ページに直接コンテンツを追加すると再利用性が制限され、何より、ローカリゼーションが困難になります。

テンプレートに直接追加するコンテンツは、サイト全体で静的または一貫性のある情報であると考えられます。これはサイトの基本的なルック・アンド・フィールを決めるものであり、背景色、背景イメージ、(テキストやグラフィックを配置する) HTML表などがあります。

その他のコンテンツは、コントリビュータによって更新され、テンプレートに関連付けられる、コントリビュータ・データファイルから作成されます。データの表示方法はテンプレートによって制御され、表示するデータは定義によって制御されます。

テンプレートをそれぞれ同じように使用して静的および動的なコンテンツを結合し、制御対象のサイトの各部分を完成します。

この項では、サイト・アセット・ペインに表示される3つのタイプのテンプレートについて説明します。

8.1.1 ページ・テンプレートについて

ページ・テンプレートは、Webページのレイアウトと構造全体を定義する、完全に形成されたHTMLファイルであり、コントリビューション・リージョン(ページの編集可能な領域)、ナビゲーション・ツール(フラグメント形式)、サイト全体にわたるイメージ(バナーなど)の配置も含みます。ページ・テンプレートは、サイトのコンテンツの表示に使用するフレームワークを提供します。Webサイトに必要なページ・テンプレートの数はサイトの複雑さによって決まりますが、通常は、少数の方が簡単に使用できます。

使用するテンプレートが少ないほどサイト全体の変更は簡単になります。ページ・テンプレートは、HCSP、JSPまたはASPでの完全なWebページであるアセットを表します。リージョン・テンプレートやサブテンプレートと同じように、テンプレートにはテキスト、イメージ、フラグメントなど、何でも直接配置でき、これらはこのテンプレートが使用されるすべてのインスタンスに表示されます。このことは、サブテンプレートおよびリージョン・テンプレートにも当てはまります。

ページ・テンプレートは、標準のHTMLレイアウトおよびフォーマット・コードと、フラグメントまたはプレースホルダ(あるいはその両方)をどこに配置するかを指定するOracle Site Studioタグで構成されます。したがって、ページ・テンプレートは通常は軽量であり、含まれているのはコントリビューション・リージョンが配置されるページ上の場所を示す高レベルの参照のみです。それらのリージョンに表示されるものに関しては、コンテンツについても視覚的なプレゼンテーションについても何も指定しません。これはリージョン定義およびテンプレートによって処理されます。ページ・テンプレートには通常、企業バナーやページ・レイアウト用イメージなどのサイト全体にわたるグラフィックと、ナビゲーション・ツールなどの繰り返し使用される編集不可能なその他のコンテンツが含まれています。

ページ・テンプレートを再利用する場合、テンプレート上に配置されたオブジェクトは、そのページ・テンプレートが開くたびに表示されます。また、ページ・テンプレートを効率的に使用する場合、少数のページ・テンプレート(または1つでも可)を使用してWebサイト全体を作成し、Webサイトの標準的なルック・アンド・フィールを保持しながら、サイト管理をできるかぎり単純化することもできます。

詳細は、第3.12項「ページ・テンプレート」を参照してください。

8.1.2 リージョン・テンプレートについて

リージョン・テンプレートは、Webページのコントリビューション・リージョン内のデータのレイアウトとルック・アンド・フィールを定義する部分的なHTMLファイルです。リージョン・テンプレートは、ヘッダー・セクションとボディ・セクションを持たない部分HTMLファイルです。したがって、Oracle Site Studioサイト用にWebページを生成するときに、他のHTMLコードの中に挿入できます。

これらのテンプレートは、標準的なHTMLレイアウトおよびフォーマット・コードと、(コントリビュータ・データファイルからの)要素または(ネイティブ・ドキュメントの)動的変換をどこに配置するかを指定するOracle Site Studioタグで構成されます。コントリビュータ・データファイルからの要素が、あるリージョン・テンプレートでは表示され、他のリージョン・テンプレートでは表示されないようにすることで、異なるページ間で情報を再利用することが可能になります。リージョン・テンプレートは、プレースホルダ内にデータを表示したり、要素(リージョン定義によって制限されます)をWebサイトで必要なレイアウトになるよう配置するために使用します。詳細は、第3.10項「リージョン・テンプレートとリージョン定義」を参照してください。

リージョン・テンプレートを作成するときにはリージョン定義と関連付ける必要があるため、リージョン定義を最初に作成してからリージョン・テンプレートを作成することをお薦めします。

8.1.3 サブテンプレートについて

サブテンプレートはページ・テンプレートと同じですが、サブテンプレートには<HTML>、<HEAD>および<BODY>セクションがないという重要な違いが1つあります。したがって、基本的にはページ・テンプレートに挿入できるHTMLコードのチャンクです。サブテンプレートには非常に単純なHTMLコードを含めることができますが、非常に複雑なものにすることもできます。サブテンプレート内のコードは、スクリプト、CSSファイルまたは挿入された他のアセットのいずれであるかにかかわらず、ページ・テンプレートに直接挿入された場合とまったく同様に扱われます。

サブテンプレートを配置できるのはプレースホルダ内のみであり、サブテンプレートに独自のプレースホルダを含めることができます。多くの場合、サブテンプレートは、ページ・テンプレートに単独で配置された1つのプレースホルダを複数のプレースホルダに分割する方法として使用されます。これは、再利用がより簡易なページ・テンプレートを作成する場合に役立ちます。

8.1.4 カスケード・スタイルシートについて

カスケード・スタイルシート(CSS)は、ページ上での位置指定、レイアウトおよびその他のスタイルを制御するために使用します。スタイルシートはソース・ビューで編集されます。これらは、通常、任意の静的HTMLページに挿入される場合と同じように、ページ・テンプレートやサブテンプレートなどのその他のオブジェクトに追加されます。

8.2 サイト・アセットとしてのテンプレートの管理

他のすべてのサイト・アセットと同じように、すべてのテンプレートはサイト・アセット・ペインで簡単に管理できます。ここで、新規テンプレートを追加したり、既存のテンプレートの情報を変更したり、サイトからテンプレートを削除できます。

この項の内容は次のとおりです。

8.2.1 新しいテンプレートの作成

テンプレートを作成するには、次のタスクを実行します。

  1. アセット・タイプのリストから、作成するテンプレート・タイプを選択します。

  2. 「新規作成」アイコン(図8-1)をクリックして、「新規」を選択してからテンプレート・タイプ(ほとんどの場合HCSP)を選択します。

    テンプレートをコンテンツ・サーバーにチェックインするための「情報の割当てフォーム」が開きます。

    図8-1 「新規作成」アイコン

    「新規作成」アイコン
  3. 「情報の割当てフォーム」に適切な値を入力します。

    Oracle Site Studioアセットの名前に関するガイドラインは、第4.2項「サイト・アセットの命名」を参照してください。

  4. 完了したら、「情報の割当て」をクリックします。

  5. テンプレートが作成されます。

サイト階層を作成してからページ・テンプレートを作成した後に追加の方法もあります。詳細は、第8.2.2項「サイト階層からのページ・テンプレートの作成」を参照してください。

8.2.2 サイト階層からのページ・テンプレートの作成

ページ・テンプレートを作成する別の方法もありますが、この方法はサイト階層を作成した後にのみ使用できます。

  1. サイト階層で、セクションを右クリックしてから、ページ・テンプレートの使用場所に応じて、「ホームページの選択」「プライマリ・ページの選択」または「セカンダリ・ページの選択」のいずれかを選択します。

    メニューからの選択内容に応じて次のいずれかのダイアログが開きます。

  2. 「新規ページ・テンプレートの作成」を選択します。

  3. 「OK」をクリックします。

  4. 情報を追加して、ページ・テンプレートをコンテンツ・サーバーにチェックインします。

    Oracle Site Studioアセットの名前に関するガイドラインは、第4.2項「サイト・アセットの命名」を参照してください。

  5. ページ・テンプレートが作成され、セクションに関連付けられます。

この方法でページ・テンプレートを作成した場合、コンテキスト・データが「プレビュー」タブに表示されます。サイト・アセット・ペインを使用してページ・テンプレートを作成する場合、ページが含まれているセクションに基づいて表示されるデータを確認するためには、ページ・テンプレートをセクションに割り当てる必要があります。

8.2.3 テンプレートのコピー

リストからコピーするテンプレートを選択することも、コンテンツ・サーバーからコピーするテンプレートを選択することも、ローカル・インスタンスからコピーするテンプレートを選択することもできます。

サイト・アセット・ペインからのテンプレートのコピー

  1. サイト・アセット・ペインのメニューで、テンプレート・タイプを選択します。

  2. コピーするテンプレートをリストから選択します。

  3. 「新規作成」アイコン(図8-2)をクリックして、「コピー」「選択済」を選択します。

    アイテムをコンテンツ・サーバーにチェックインするための「情報の割当てフォーム」が開きます。

    図8-2 「新規作成」アイコン

    「新規作成」アイコン
  4. 「情報の割当てフォーム」に適切な値を入力します。

  5. 完了したら、「情報の割当て」をクリックします。

  6. テンプレートがコピーされます。

コンテンツ・サーバーからのテンプレートのコピー

  1. サイト・アセット・ペインのメニューで、テンプレート・タイプを選択します。

  2. 「新規作成」アイコン(図8-2)をクリックして、「コピー」「サーバーから」を選択します。

    検索結果ページが開きます。

  3. コピー対象に対応する「選択」ボタンをクリックします。

    アイテムをコンテンツ・サーバーにチェックインするための「情報の割当てフォーム」が開きます。

  4. 「情報の割当てフォーム」に適切な値を入力します。

  5. 完了したら、「情報の割当て」をクリックします。

  6. テンプレートがコピーされます。

ローカル・インスタンスからのテンプレートのコピー

  1. サイト・アセット・ペインのメニューで、テンプレート・タイプを選択します。

  2. 「新規作成」アイコン(図8-2)をクリックして、「コピー」「ローカルから」を選択します。

    ファイルを開くダイアログが開きます。

  3. ローカル・インスタンスで、コピーするテンプレートにナビゲートします。

  4. ファイルを選択し、「Open」をクリックします。

    アイテムをコンテンツ・サーバーにチェックインするための「情報の割当てフォーム」が開きます。

  5. 「情報の割当てフォーム」に適切な値を入力します。

  6. 完了したら、「情報の割当て」をクリックします。

  7. テンプレートがコピーされます。

8.2.4 テンプレートのコンテンツ情報の表示

テンプレートのコンテンツ情報を表示するには、次のタスクを実行します。

  1. サイト・アセット・ペインのメニューで、テンプレート・タイプを選択します。

  2. リストからテンプレートを選択します。

  3. 「ドキュメント情報」アイコン(図8-3)をクリックします。

    コンテンツ情報ページが開きます。

    図8-3 「ドキュメント情報」アイコン

    「ドキュメント情報」アイコン

8.2.5 サイト階層からのページ・テンプレートのコンテンツ情報の表示

ページ・テンプレートの「コンテンツ情報」ページを表示することが必要になる場合があります。コンテンツ・サーバーで使用可能な機能を使用して、メタデータを更新したり、電子メールでファイルへのリンクを送信したり、この電子メールをサブスクライブできます。

サイト階層ペインを使用して、コンテンツ情報ページを表示できます。

ページ・テンプレートのメタデータを表示するには、サイト階層ペインで目的のページ・テンプレートを右クリックし、「ドキュメント情報の表示」を選択します。

8.2.6 サイトへのテンプレートの追加

サイトにテンプレートを追加するには、次のタスクを実行します。

  1. サイト・アセット・ペインのメニューで、テンプレート・タイプを選択します。

  2. 「サイトに追加」アイコン(図8-4)をクリックします。

    検索結果ページが開きます。

    図8-4 「サイトに追加」アイコン

    「サイトに追加」アイコン
  3. 追加するテンプレートを選択して、Oracle Site Studio「印の付いたドキュメントを選択」をクリックします。

  4. 構成によっては、サイトに追加しようとしているアセットがすでに存在するという注意を受け取る場合があります。「OK」をクリックします。

    これで、テンプレートはWebサイトに関連付けられました。

8.2.7 サイトからのテンプレートの削除

サイトからテンプレートを削除するには、次のタスクを実行します。

  1. サイト・アセット・ペインのメニューで、テンプレート・タイプを選択します。

  2. リストから、削除するテンプレートを選択し、「サイトから削除」アイコン(図8-5)をクリックします。

    テンプレートを削除しても、単にサイトとテンプレートの関連付けが削除されるだけです。コンテンツ・サーバーからファイルが削除されることはありません。

    図8-5 「サイトから削除」アイコン

    「サイトから削除」アイコン

8.3 コントリビューション・リージョンの理解

コントリビュータが編集できる領域は、コントリビューション・リージョンと呼ばれます。この領域は設計者によってプレースホルダを使用して定義されます。該当するプレースホルダ内では、サブテンプレート(使用されている場合)およびリージョン・テンプレートを使用して、コントリビューション・リージョン内に関連付けられているデータの表示方法が制御されます。定義(プレースホルダ、リージョンおよび要素)は、コントリビュータによる該当データの編集方法や操作方法を制御するために使用します。

要素定義は、コントリビュータが使用できるツールバー・アイコンや編集機能を決定するために使用します。要素はリージョン・テンプレート上に配置されます。リージョン・テンプレートは、サイト・アセットとして制御されるHTMLの最小のチャンクであり、これにより、HTMLの特定のセクションやテンプレートを通じて渡される関連コンテンツを使用および再利用できます。リージョン定義では、リージョン・テンプレートで使用可能な要素を定義します。また、リージョン・コンテンツの切替えについてコントリビュータに付与されるアクセスのレベルも定義します。

リージョン定義には、リージョン・テンプレートに配置する要素定義より多くの要素定義を含めることができます。リージョン定義にリストされているもののリージョン・テンプレートで使用されていない要素定義は、データファイルを編集する際、引き続きContributorに表示されます。これは、あるページに表示される情報のティーザーを使用して別のページ上の情報の完全なセットに移動する場合に覚えておくと特に有用です。この概念の詳細は、第3.10項「リージョン・テンプレートとリージョン定義」を参照してください。

コントリビューション・リージョンの境界は、プレースホルダによって設定されます。一般的に、プレースホルダはコントリビューション・リージョンと呼ばれる領域を意味します。プレースホルダはアセットではなく、ページ・テンプレート(またはサブテンプレート)上の単なるマーカーであり、サイト・テンプレートまたはサブテンプレート上のその他のオブジェクトの配置に対して相対的なコントリビューション・リージョンの位置を示すために使用します。プレースホルダに割り当てられているプレースホルダ定義により、コントリビュータにデータを編集するためのアクセス権があるかどうか、およびコントリビュータがコンテンツを切替え可能かどうかが定義されます。

また、プレースホルダ定義では、プレースホルダで使用可能なリージョン定義、使用可能なリージョン・テンプレート、およびプレースホルダ内の各リージョン定義用のデフォルトも定義されます。

プレースホルダはコントリビュータから必ずしもアクセス可能ではなく、プレースホルダにサブテンプレートを含めて、他のプレースホルダに分割することもできるため、プレースホルダが厳密にコントリビューション・リージョンであるとはかぎりません。ただし、一般的な意味で単純なプレースホルダを考える場合、プレースホルダはコントリビュータが作業するコントリビューション・リージョンになります。

8.4 プレースホルダの挿入

プレースホルダは、コンテンツを配置する領域をマークするために、ページ・テンプレートおよびサブテンプレートで使用されます。プレースホルダはアセットではなく、プレースホルダ定義は、プレースホルダのページでの使用方法およびページに配置されるコンテンツを定義するために使用します。

プレースホルダを挿入するには、次の手順に従います。

  1. テンプレート内のプレースホルダを配置する場所をクリックします。

  2. ツールバーで、「プレースホルダーの挿入」ボタンをクリックします。

  3. 「プレースホルダーの定義」ダイアログ(第A.75項「「プレースホルダーの定義」ダイアログ」を参照)が表示されます。

    ダイアログに、「プレースホルダー定義マッピング」ダイアログ(第A.73項「「プレースホルダー定義マッピング」ダイアログ」を参照)で作成されたプレースホルダ名がリストされます。

  4. プレースホルダに関連付けるプレースホルダ名を選択して、「OK」をクリックします。

8.5 オブジェクトの挿入

その他のサイト・アセットは、そのオブジェクトを直接テンプレート内に配置することで簡単に追加されます。これを行うには、ツールバーからアイコンを選択するか、またはテンプレートを右クリックして使用可能なサイト・アセットを追加します。

ページ・テンプレート、サブテンプレートまたはリージョン・テンプレートにオブジェクトを追加することは非常に簡単です。

オブジェクトを追加するには、次の手順に従います。

  1. テンプレート内のアセットを配置する場所を右クリックします。

  2. コンテキスト・メニューが表示されます。「オブジェクトの挿入」を選択します。

  3. さらにコンテキスト・メニューが開き、挿入に使用可能なサイト・アセットが表示されます。

    たとえば、リージョン・テンプレート内にカーソルを置いていない場合、要素を選択することはできません。

  4. サイト・アセットは選択後、テンプレートに追加されます。

動的コンテンツ(プレースホルダなど)を含むアセットを追加する場合、コンテンツが挿入される位置にマーカーが表示されます。イメージなどの静的コンテンツを含むアセットを追加する場合、コンテンツが表示されます。

アセットは、ソース・ビューで直接追加することもできます。

リージョン・テンプレートでは、リージョン定義により、追加に使用可能な要素が制限されます。

8.6 フラグメントの挿入

フラグメントは任意のテンプレートに簡単に追加できます。テンプレートにフラグメントを追加する場合、フラグメント・ツールボックスからフラグメントを選択すると、そのフラグメントがテンプレート内の選択した場所に挿入されます。

ただし、フラグメントを使用する際に重要な考慮事項が1つあります。

Oracle Site Studio Designerに付属の数多くのフラグメントは、ページ・テンプレートのヘッダーとボディに使用されるスニペットで構成されています。サブテンプレートとリージョン・テンプレートにはヘッダーがなく、ボディのみが含まれるため、フラグメントがこれらのテンプレートに挿入された場合、正常に動作しません。

正常に動作するフラグメントをサブテンプレートまたはリージョン・テンプレートに含めるには、ヘッダー・スニペットがなくボディ・スニペットを1つ含む独自のフラグメントを作成する必要があります。ヘッダー・スニペットとボディ・スニペットを含むフラグメントはページ・テンプレートでは動作しますが、その他のテンプレートでは動作しません。これにより、フラグメントの再利用性が制限されます。

詳細は、第13章「フラグメントの操作」を参照してください。

8.7 テキストの操作

設計ビューでのテキストの操作は、ワープロ・プログラムでテキストを使用する場合とよく似ています(ワード・ラップ、改行、フォーマット・オプションなど)。ページ・テンプレートにテキストを追加するには、ページ・テンプレート内のテキストを追加する場所をクリックし、入力を開始するだけです。Designerにより、必要なHTMLコードがバックグラウンドで処理されます。

テキストを追加して編集した後、タイプフェースやフォント・サイズを変更して、テキストをインデントまたはセンタリングし、箇条書きまたは番号付きリストを追加してテキストをフォーマットできます。

テンプレートに直接テキストを追加することは推奨されていません。テキストがコントリビュータ・データファイルではなくテンプレート上に存在する場合、ローカリゼーションが困難になります。

8.8 テンプレート上のオブジェクトの配置

特定のレイアウト構造が必要な場合、ページ上の情報の配置は、HTML表またはオブジェクトを配置するCSSのいずれかを使用して行うことができます。

ほとんどの場合、ページ・テンプレート、サブテンプレートまたはリージョン・テンプレートにアセットを挿入する際には、カーソルを置いた場所に挿入されます。ただし、完了したWebページでは、アセットが必ずしもDesignerで表示されるのと同じように表示されるとはかぎりません。コンシューマによるブラウザの選択、ブラウザ・ウィンドウのサイズ、コントリビュータがコントリビュータ・データファイルにその他のオブジェクトをどのように配置したかなどの差異により、Webサイトの編成が異なっているように見える場合があります。

CSSファイルは管理対象オブジェクトであり、再利用性を最大限に高めることができるため、CSSを使用する方法はより効率的です。サブテンプレートなどのアセットに表を配置した後、その同じ構造を他のアセットに使用するには、表を再作成する必要があります。このような方法で表を使用すると、変更を行う必要がある場合に複数の場所で変更する必要があります。

CSSを使用すると、要素などの各サイト・アセットの正確な配置をスタイルシート内で特定できます。

多くの場合、Webページでの設定および作成が簡単なため、表の使用が好まれます。表を使用すると、相対的な配置を簡単に構築できます。表では、データを互いに相対的に配置するセルの形状を作成できます。

8.9 CSSクラスの適用

Oracle Site Studioでは、デフォルトで、フォントと段落の設定がテキストに直接適用(インライン)されます。

または、カスケード・スタイルシートからクラスをテキスト(およびイメージ)に適用することもできます。CSSクラスを使用すると、フォントと段落の設定をすべて1つの場所に格納してから、これらの設定をWebページに適用できます。

これにより、個別の見出しや段落ごとにフォントと段落の設定を変更するかわりに、それぞれに1つのクラスを指定できるため、時間が節約されます。これらの設定を変更する必要がある場合は、クラスを更新するだけです。

CSSクラスを実装するには、スタイルシートへの参照をページ・テンプレートのヘッダーに挿入します。これは、たとえば、次のような相対パスを使用して行うことができます。

<link href="<!--$HttpRelativeWebRoot-->groups/public/documents/adacct/stylesheet.css" type="text/css" rel="stylesheet" />

または、より典型的な例としては、フラグメントに配置します。CSSの参照をフラグメントに配置する場合、サーバーのディレクトリ構造は公開されません。

次に、ソース・ビューでページ・テンプレートを編集するか、または設計ビューのプロパティ・ペインを使用して、スタイルシートからクラス名をテキストおよびグラフィックに適用します。

図8-6 プロパティ・ペインを使用したクラスMyNewStyleの適用。

プロパティ・ペインでのプロパティ・クラス名

Designerのサイト・アセット・ペインは、コンテンツ・サーバー内のカスケード・スタイルシートへのパスを追加、編集および識別する場合に、非常に役立つ場合があります。

Oracle Site Studioに付属するフラグメントの多くには、CSSファイルがフラグメントへのアセットとして含まれます(第13.12.5項「フラグメント・アセットの追加、編集および削除」を参照)。必要に応じて、これらのCSSファイルからのクラス名を参照することもできます。

また、Contributorアプリケーションで作業する際に、コントリビュータがこれらのクラスを使用できるようにすることが必要な場合もあります。これは、サイト全体の一貫性を向上し、サイト全体のスタイル更新をさらに簡易化するのに役立ちます。

8.10 HTML表の操作

Webページ設計では、多くの場合、HTML表が使用されます。Webページの構築にカスケード・スタイルシートを使用しない場合は、これを使用します。ページ・テンプレートでのHTML表の処理は、その他のWebページでの表の処理と同じです。

HTML表の主な用途は2つあり、1つ目は表形式でデータを表示すること、2つ目はテキストとグラフィックをWebページ上にレイアウトすることです。サイトの設計者は、後者の用途でより頻繁に表を使用する場合があります。

表を使用する場合、Webページでのコンテンツの表示方法は、表のサイズと場所、それぞれの列と行のサイズ、各セルに含めるコンテンツを指定することで制御できます。枠線を非表示にして、サイト閲覧者に対して表が表示されないようにします。Oracle Site Studioでは、表は特に、コントリビューション・リージョンとリージョン内の要素の位置指定に役立ちます。

表に特定の編集を行うには、プロパティ・ペインでHTML <TABLE>タグを直接変更できます。また、ソース・ビューで変更することもできます。

図8-7 設計ビューでの<TABLE>タグのプロパティ

プロパティ・ペインでの表タグ・プロパティ

プロパティ・ペインでは、背景色、枠線の幅、セルのパディングおよびその他複数の設定を変更できます。<TABLE>タグに入力される可能性のある属性はすべて、プロパティ・ペインで使用可能です。<TABLE>タグの詳細は、World Wide Web Consortium (W3C)のWebサイト(http://www.w3.org/TR/html401/struct/tables.html#edef-TABLE)を参照してください。

8.11 Designerでのテンプレートの表示

Designerでテンプレートを表示する場合、設計ビュー、ソース・ビューおよびプレビューという3つの方法があります。それぞれ、Designerでのテンプレートの操作時におけるテンプレートの表示方法が異なっています。

Designerのワークスペースにある各テンプレート・ウィンドウには、下部に3つのタブがあります。設計ビュー、ソース・ビューまたはプレビューで該当のテンプレートに使用するタブを選択します。

この項の項目は次のとおりです。

8.11.1 設計ビュー

Designerでテンプレート(ページ・テンプレート、リージョン・テンプレートまたはサブテンプレート)を開く場合、ワークスペースの設計ビューで開き、ここでそのテンプレートを必要に応じて編集できます。その後、ワークスペースは、多数の一般的な編集機能を備えたエディタとして機能します。

設計ビューでは、テンプレート上に配置されているとおりにすべてのオブジェクトが表示されます。設計ビューでは、静的コンテンツ(固定バナー・グラフィックなど)と動的コンテンツ(プレースホルダやフラグメントなど)の両方の位置指定が表示されます。テンプレートの設定方法および使用されている位置指定方法(アセットの位置合せに表とCSSのいずれを使用しているかなど)に応じて、Webブラウザで表示したときのページ・レイアウトの状態をこのビューで予測することができます。テキスト、イメージ、色、ハイパーリンクおよび表は実際のWebサイトに表示されるとおりに表示されますが、(フラグメントとスクリプトからの)動的コンテンツは、実際のコンテンツではなくタグとして表示されます。これは、ほとんどのフラグメントとスクリプトに、サーバー側スクリプトおよび動的にレンダリングされるコンテンツが必要であるためです。

図8-8 設計ビュー

Webページのテンプレートの設計ビュー

テキストとオブジェクトは、一般的な編集キーストローク(コピーして貼り付けるには[Ctrl]+[C]と[Ctrl]+[V]など)、アプリケーション・ツールバー(第5.10項「ツールバー」を参照)および右クリック・メニュー(第5.6.7項「右クリック・メニュー」を参照)を使用して編集できます。オブジェクトを選択する場合、そのオブジェクトをクリックするだけで、選択ハンドルが表示されます(図8-9)。

図8-9 設計ビューで選択されたオブジェクト

設計ビューで選択されたオブジェクト

設計ビューを使用して実行できない編集については、プロパティ・ペインを使用できます(第5.5項「プロパティ・ペイン」を参照)。ここで特定の編集を行うことができない場合は、いつでもソース・ビューで実際のコードを編集できます。

Designerでは、設計ビューでHTMLタグの場所をハイライトすることもできます。この機能を有効にするには、フォーマット・ツールバーで「HTMLタグの表示/非表示」アイコン(図8-10)をクリックします。このアイコンの横にある下矢印をクリックして、特定のHTMLタグを表示または非表示にすることができます。

図8-10 HTMLタグの表示/非表示

「HTMLタグの表示/非表示」アイコン

8.11.2 ソース・ビュー

ソース・ビューには、テンプレート内のコード(HTML、XML、JavaScript、Idocスクリプト、Oracle Site Studioのタグなど)が表示されます。

図8-11 ソース・ビュー

Webページのテンプレートのソース・ビュー

ソース・ビュー内の情報は、色分けされたテキストとして表示されます。

  • 黒はXMLコード、HTMLタグ属性およびWebページに表示されるテキストに使用されます。

  • 紫はHTMLタグに使用されます。

  • 青はHTMLタグ属性値に使用されます。

  • 緑は、Idocスクリプト、HTMLコメントおよびOracle Site Studioによって挿入されたコードに使用されます。

タイプフェース、インデント・レベル、行折返しなど、これらの設定の多くは変更可能です。詳細は、第6.9項「ソース・ビューでのコードのフォーマット」を参照してください。

ソース・ビューにより、サイト・テンプレートを完全に制御できます。このことは、複数のカスタム・アセットを実装している場合に特に当てはまることがあります。実際、設計ビューで開始してページを作成してから、ソース・ビューに切り替えて、ページの外観と動作をカスタマイズする場合もあります。

8.11.3 プレビュー

プレビューでは、すべてのアセットが配置されたWebページの実際のビューが、コンシューマに対してWebブラウザで表示されるとおりに表示されます。これは、テンプレートをプレビューして、フラグメントとプレースホルダがどのようにテンプレートに配置されているかを確認する場合に役立ちます(設計モードでは、ページ・レイアウトがCSSによって制御されている場合には特に、確認が困難なことがあります)。

図8-12 プレビュー

Webページのプレビュー

注意:

Oracle Site Studioは、プレビュー機能を提供するためにはInternet Explorer 7以上を必要とします。

8.12 リージョン・テンプレートとリージョン定義

リージョン定義は、Webページ上のコントリビューション・リージョンに何を含めるかを指定し、リージョン・テンプレートは、コントリビューション・リージョンの外観を定義します。言い換えると、リージョン定義はサイト・コンテンツの構造(および属性)を指定し、リージョン・テンプレートはそのコンテンツのWebページ上でのプレゼンテーションを定義します。

1つのリージョン定義に複数のリージョン・テンプレートを関連付けることができます。それにより、サイトのコンテンツをサイト内のコンテキストに合せて異なる方法で表示できます。1つのリージョン定義に対して複数のリージョン・テンプレートがある場合、特に別のリージョン・テンプレートを使用するように設定されていないかぎり、デフォルトのリージョン・テンプレートが使用されます。

リージョン・テンプレートを作成するときにはリージョン定義と関連付ける必要があるため、リージョン定義を最初に作成してからリージョン・テンプレートを作成することをお薦めします。

8.13 ネイティブ・ドキュメントおよび変換定義の操作

ネイティブ・ドキュメントでは、Webページでネイティブ・ドキュメントを変換するのに適切なルールとテンプレートを定義する、変換定義が使用可能になっている必要があります。ネイティブ・ドキュメントを使用および変換するには、最初に「チェックアウトして開く」およびDynamic Converterがコンテンツ・サーバーにインストールされている必要があります。

動的変換は、リージョン・テンプレート上にのみ配置できます。リージョン・テンプレートへの変換の追加は簡単であり、他のアセットをテンプレートに追加する場合と同じように動作します。

動的変換をリージョン・テンプレートに追加するには、次の手順に従います。

  1. 変換ドキュメントを表示するリージョン・テンプレートを開きます。

  2. 右クリックして、メニューから「オブジェクトの挿入」「動的変換」を選択します。

    動的変換の挿入ダイアログ(第A.78項「動的変換の挿入ダイアログ」を参照)が開きます。

  3. 使用する動的変換を選択します。

  4. 「OK」をクリックします。

ネイティブ・ドキュメントと変換定義の詳細は、第10.8項「ネイティブ・ドキュメントの操作」を参照してください。