Web サイトにページ・テンプレートを適用する

ページ・テンプレートを使用して、Web サイト内のすべての Web ページで共通の要素を制御します。サイトにページ・テンプレートを適用した後は、 個々のページに何度も変更を行うのではなく、テンプレートで 1 回変更を行うことにより、 その後の設計の変更に要する労力を最小限に抑えることができます。
前提条件:
  1. Web プロジェクトを作成する。
  2. Web サイトを作成する。
  3. Web サイト・ナビゲーション で Web ページを作成するか、 または Web サイトに 既存の Web ページを追加する

サイト内での整合性を 維持するための推奨方法は、Site Designer ツールで提供されている ページ・テンプレートを使用することです。Web サイト・ナビゲーションは、Web サイト全体の ルック・アンド・フィールを編集するために提供されています。 ページ・テンプレートを 使用することにより、サイト全体でルック・アンド・フィールを整合させることができます。ページ・ テンプレート には、Web サイト・ ナビゲーション・ツールを使用して作成される Web サイト・ナビゲーション (ナビゲーション・バー、 ナビゲーション・トレール、ナビゲーション・ メニューなど) が含まれています。

ページ・テンプレートを適用するには、 以下のようにします。

  1. Web パースペクティブの「プロジェクト・エクスプローラー」ビューで Web プロジェクトを展開する。
  2. 「Web サイト・ナビゲーション」をダブルクリックして、Web サイトの構造を開く。
  3. CTRL キーを押しながらページ・アイコンをクリックして、ページ・テンプレートを 適用したいページを選択する。
  4. 右クリックして、「テンプレートの設定 (Set Template)」 > 「テンプレートの適用」と選択する。「ページ・テンプレートの適用」ウィザードが開きます。
  5. ウィザードの「ページ・テンプレートの指定」ページで、 使用したい「ページ・テンプレート・タイプ」を選択する。「マイ・テンプレート」フォルダーでユーザー定義のテンプレートを、「サンプル・テンプレート」フォルダーでサンプル・テンプレートを 選択できます。
  6. ページ・テンプレートを適用したい 1 つのページを選択した場合、 そのページが要素マッピングのベースとなるモデルとして使用される。 このステップをスキップして、このトピックの残りのステップを続けます。 ページ・テンプレートの適用先として複数のページを選択した場合は、 要素マッピングのモデルとして Web ページを選択する必要があります。ウィザードの 「ページ・テンプレートの適用方法を指定するための Web ページを選択」ページで、 Web ページのコンテンツ領域をページ・テンプレートのコンテンツ領域に マップします。マップに使用するページを選択します。「次へ」をクリックします。
    制約事項:
    • ページ・テンプレートから異なるエンコードを持つページを選択することはできません。
    • すでにページ・テンプレートを持っているページを選択することはできません。
    • フレームを使用するページを選択することはできません。
    • ページ・テンプレートが XML スタイル JSP によって記述されていない場合は、 XML スタイル JSP によって記述されているページを選択することはできません。
    • ページ・テンプレートが XML スタイル JSP によって記述されている場合は、 XML スタイル JSP によって記述されていないページを選択することはできません。
  7. ウィザードの「ページ要素をページ・テンプレートにマップ」 ページで、ページ・テンプレートでのページ・コンテンツの表示方法を指定する。

    コンテンツ領域のソースは、「ページ・テンプレートの コンテンツ領域」リストに定義されています。前のウィザード・ページで選択した Web ページに対する要素が、ページ要素のリストに表示されます。ページ・テンプレートのコンテンツ領域 リストで、コンテンツ領域を選択します。ページ要素のリストで、コンテンツ領域 をマップする要素を選択します。次に、「マップ」ボタンをクリックします。コンテンツ領域ごとにこの手順を行います。これにより、ページ・テンプレートのコンテンツ領域が、Web ページの要素に対して関連付けられます。

    例えば、 サンプル・ページ・テンプレートの 1 つを選択すると、 headareabodyarea コンテンツ領域が事前定義されます。headarea コンテンツ領域 を選択して、それを HEAD (開始 HEAD タグと終了 HEAD タグの間にあるもの) と関連付ける ことができます。headarea コンテンツ領域に対してページ・テンプレートに定義された 属性が既存の Web ページの HEAD 要素に適用されます。

    ページ・テンプレートのコンテンツ領域をページ要素にマップした例。
    プレビュー・ボックスには現行ページと、テンプレートの適用後に そのページがどのように見えるかを示したプレビューが表示されます。

    ヒント:
    • ページ要素リストでページ要素を選択することにより、 現行ページのプレビューで特定の要素を強調表示することができます。
    • 現在のページのプレビュー」を右クリックして、ポップアップ・メニューから 「オリジナル・サイズで表示」を選択すると、拡大されたプレビューを 表示することができます。
    ページ・テンプレートの適用先として 1 つのページを選択した場合は、 「終了」をクリックします。テンプレートが Web ページに適用されます。ページ・テンプレート の適用先として複数のページを選択した場合は、「次へ」をクリックします。
  8. ウィザードの「ページの選択 - ページ・テンプレートの適用」ページ で、ページ・テンプレートを適用したい Web ページを選択する。 Web ページがすでに関連付けられたページ・テンプレートを持っている場合、 2 番目のページ・テンプレートを適用することはできません。さらに、Web ページが フレームを使用している場合は、ページ・テンプレートを 適用できません。
    注: ページ・テンプレートは、ウィザードの 「ページ・テンプレートの適用方法を指定するための Web ページを選択」ページで、 仕様セットを使用して選択したすべての Web ページに適用されます。 同じ要素が他の Web ページで検出されると、その要素が 正しいコンテンツ領域に挿入されます。他の Web ページで同じ要素が 検出されないと、挿入される要素は拡張されてから、コンテンツ領域に 挿入されます。ウィザードが終了した後に不必要な要素を削除することにより、 Web ページを手動で変更することができます。
    制約事項: Web ページ のエンコードがページ・テンプレートのエンコードと異なる場合は、 そのページ・テンプレートを適用することはできません。ページ・テンプレートまたは Web ページの いずれかが XML スタイル JSP によって記述されている場合は、ページ・テンプレートを 適用できません。ページ・テンプレートを適用できないページは、 ウィザードの「ページ・テンプレートを適用するページ」リストで エラー・メッセージを受け取ります。
  9. 「終了」をクリックする。 テンプレートが Web ページに適用されます。
重要: JSP-*.jtpl という名前のサンプル・ページ・テンプレートの適用後または JSP ナビゲーション・バーの挿入後、「問題」ビューに以下のエラー・メッセージが 表示されます。
  • リンク切れ - http://java.sun.com/jsp/jstl/core
  • リンク切れ - http://www.ibm.com/siteedit/sitelib
  • リンク切れ - com.ibm.etools.siteedit.sitelib.core.SiteNavBean
  • JspCompile: パッケージ com.ibm.etools.siteedit.sitelib.core が存在しません
これらのエラーおよび警告を除去するには「プロジェクト・エクスプローラー」ビューで Web プロジェクトを右クリックし、「妥当性検査の実行」を選択してください。
関連概念
Cascading Style Sheet (CSS) Designer
関連タスク
ページ・テンプレートにコンテンツを追加する
ダイナミック・ナビゲーションをページ・テンプレートに追加する

フィードバック