Dreamweaver(ドリームウィーバー)のテンプレート4|リピート領域

リピート領域1


今回はDreamweaver(ドリームウィーバー)のテンプレート機能の中でも

とても便利で分かりやすい機能を紹介します。

ホームページを運営する際に、

下記のように同じような項目を更新することがあると思います。

リピート領域1

リピート領域1

このように決められた構成のページの場合

アイキャッチ画像、タイトル、テキスト(詳細はこちら)で構成されたブロックを

ワンクリックで追加し、内容を編集するだけにしておけば更新が楽になりますね。

リピート領域の設定方法

まずは上記ページのhtmlコードから見て頂きます。cssのclass名は任意となります。

するとテンプレート内では下記のようになります。

リピート領域2

リピート領域2

この部分をリピート領域に変えて行きます。

まずはリピート領域に変えたいhtml部分を選択します。

選択したまま「挿入」⇒「テンプレートオブジェクト」⇒「リピート領域」を選択します。

リピート領域3

リピート領域3

リピート領域の名前を任意で入れます。ここでは仮に「event」としています。

リピート領域4

リピート領域4

これでリピート領域は出来ました。

ですがこれだけだとnoimageのアイキャッチのdivが繰り返されるだけで中身を編集できません。

更新の際に都度、内容を変更したい場合は

リピート領域内で変更する箇所だけに「編集可能領域」の設定をします。

ここでは3箇所に編集可能領域を設定します。

リピート領域5

リピート領域5

編集可能領域の名前は任意ですがここでは仮に

アイキャッチは「event_img」、タイトルは「event_title」、

内容には「event_text」と名前をつけました。

これで「編集可能領域」を含んだ「リピート領域」の完成です。

このテンプレートを使用するとこのようにリピート領域名の横にある「+」や「-」で

自由に増やしたり、減らしたりできます。

リピート領域6

リピート領域6


Pocket