内容 (What's Covered)

この文書では、Adobe Dreamweaver でテンプレートを使用してドキュメントを作成する方法について説明します。

A. テンプレートについて

Dreamweaver では、作成したドキュメントをテンプレートとして保存することができます。
ドキュメントをテンプレートとして保存すると、ドキュメントのほとんどの領域がロックされます。テンプレートの作成者は、テンプレートから作成されたド キュメントのどの領域を編集できるようにするかを、テンプレートに編集可能領域または編集可能パラメーターを挿入することによって指定します。

テンプレート領域のタイプ

テンプレート領域には、次の 4 つのタイプがあります。

  • 編集可能領域
    ドキュメント内のロックされていない領域で、テンプレートユーザーが編集できる部分です。
  • リピート領域
    テンプレートユーザーが必要に応じて、リピート領域のコピーを追加または削除できる部分です。
  • オプション領域
    ドキュメントに表示するか非表示するかをテンプレートユーザーが制御できる部分です。
  • 編集可能なタグ属性
    テンプレート内のタグ属性のロックを解除して、属性を編集できる部分です。

B. テンプレートの作成

テンプレートは既存ドキュメントをテンプレートとして保存するか、新規ドキュメントから作成できます。テンプレート領域は、挿入/テンプレートオブジェクト から追加していきます。

B-1. 既存ドキュメントをテンプレートとして保存する

  1. Dreamweaver を起動し、テンプレートとして保存するドキュメントを開きます。

  2. ファイル/テンプレートとして保存 を選択します。

  3. 「テンプレートして保存」ダイアログボックスが開きます。

    「サイト」ポップアップメニューからテンプレートを保存するサイトを選択し、「保存名」にテンプレートの名前を入力します。

  4. 「保存」ボタンをクリックします。

    ※ Dreamweaver では、テンプレートファイルは、ファイル拡張子 .dwt を付けて、サイトのローカルルートフォルダーにあるサイトの Templates フォルダーに保存されます。サイトに Templates フォルダーがない場合は、新しいテンプレートを保存するときに自動的に作成されます。

B-2. 新規にテンプレートを作成する

  1. Dreamweaver を起動します。

  2. ウィンドウ/アセット を選択し、アセットパネルを表示します。

  3. アセットパネルでテンプレートカテゴリを選択します。

  4. アセットパネルの下部にある「新規テンプレート」ボタンをクリックします。
    名前の付いていない、新しいテンプレートがアセットパネルのテンプレート一覧に追加されます。

  5. テンプレート名を入力します。

C. テンプレート領域の作成

C-1. 編集可能領域、リピート領域、オプション領域の作成

  1. ドキュメントウィンドウで、以下のいずれかの操作を行います。

    • 領域として設定するエレメントを選択します。
    • 領域を挿入する位置に挿入ポイントを置きます。
  2. 以下のいずれかの操作を行って、領域を挿入します。

    • 挿入/テンプレートオブジェクト を選択し、挿入する領域名を選択します。
    • 右クリック(Windows)または Control キーを押しながらクリック(Mac OS)し、メニューから「テンプレート」を選択し、挿入する領域名を選択します。
    • 挿入パネルの「一般」カテゴリで、「テンプレート」ボタンをクリックし、ポップアップメニューから挿入する領域名を選択します。
  3. 「名前」ボックスに、領域の名前を入力します。

    ※ 特定のテンプレートでは、複数の編集可能領域に同一の名前を使用することはできません。

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

C-2. 編集可能タグ属性の指定

テンプレートから作成されたドキュメントで、指定したタグの属性をテンプレートユーザーが編集できるようにできます。

例えば、テンプ レートドキュメントの背景色はテンプレートの作成者が設定し、テンプレートユーザーが作成するページの背景色については、ユーザーが別の色を設定できるよ うにすることができます。ユーザーが更新できるのは、テンプレートの作成者が編集可能に指定した属性だけです。

また、ページに複数の編集可 能な属性を設定して、テンプレートユーザーがテンプレートから作成されたドキュメントで属性を修正できるようにすることもできます。サポートされている データタイプは、テキスト、Boolean(true/false)、色、および URL です。

  1. ドキュメントウィンドウで、編集可能なタグ属性を設定するアイテムを選択します。

  2. 修正/テンプレート/属性を編集可能にする を選択します。

  3. 「編集可能なタグ属性」ボックスで次のいずれかの操作をして、「属性」テキストボックスに属性の名前を入力するか属性を選択します。

    • 編集可能にする属性が属性ポップアップメニューにある場合は、それを選択します。
    • 編集可能にする属性が属性ポップアップメニューにない場合は、「追加」をクリックします。表示されるダイアログボックスで、追加する属性の名前を入力し、「OK」をクリックします。
  4. 「属性を編集可能にする」オプションが選択されていることを確認します。

  5. 「ラベル」ボックスに、属性の名前を入力します。

  6. 「タイプ」メニューで、以下のいずれかのオプションを設定し、この属性に許可する値のタイプを選択します。

    • この属性にテキスト値を入力できるようにするには、「テキスト」を選択します。例えば、align 属性にテキストを使用すると、ユーザーはこの属性の値を、「左」、「右」、または「中央」に設定することができます。
    •  イメージのファイルパスなど、エレメントにリンクを挿入するには、「URL」を選択します。このオプションを使用すると、リンクに使用されているパスが自動的に更新されます。ユーザーがイメージを新しいフォルダーに移動すると、リンクの更新ダイアログボックスが表示されます。
    • 値を選択する際にカラーピッカーを使用できるようにするには、「カラー」を選択します。
    • ページ上で真/ 偽の値の選択肢をユーザーに提供するには、「真/ 偽」を選択します。
    • イメージの高さや幅を変更する場合など、ユーザーが数値を入力して属性を更新できるようにするには、「数字」を選択します。
  7. 「初期設定値」ボックスに、選択したテンプレートのタグ属性値が表示されます。このボックスに新しい値を入力し、テンプレートから作成されたドキュメント内のパラメーターに別の初期値を設定します。

  8. 必要に応じて、再度属性の選択から操作して、別の属性のタグを設定します。

  9. 設定が終了したら、「OK」をクリックします。

D. テンプレートを利用したページの作成

作成したテンプレートを利用してページを作成するには、新規ドキュメントウィンドウの「テンプレートから作成」でテンプレートを選択するか、アセットパネルで作成したテンプレートを選択してドキュメントに適用します。

D-1. 新規ドキュメントウィンドウから使用する

  1. Dreamweaver を起動します。

  2. 新規ドキュメントウィンドウが表示されていない場合は、ファイル/新規 を選択します。

  3. 新規ドキュメントウィンドウで「テンプレートから作成」を選択します。

  4. サイトおよびテンプレートを選択し、「作成」ボタンをクリックします。

D-2. アセットパネルから使用する

  1. Dreamweaver を起動します。

  2. アセットパネルが表示されていない場合は、ウィンドウ/アセット を選択します。

  3. アセットパネルで、テンプレートカテゴリを選択します。

  4. テンプレートを選択し、「適用」ボタンをクリックします。

アドビコミュニティフォーラムをご利用下さい

この文章はお役に立てましたでしょうか?さらに情報をお探しになる場合には、アドビスタッフがお届けしている解決事例やメンバー同士での活発な意見交換をチェックできるコミュニティフォーラムをご利用下さい。

本作品は Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License によってライセンス許可を受けています。  Twitter™ および Facebook の投稿には、Creative Commons の規約内容は適用されません。

法律上の注意   |   プライバシーポリシー