Dreamweaverのナビメニューをビルダーで再作成

Dreamweaver8で作成した「ライブラリ」を、ホームページビルダー16の「共通部分の同期」に移植しました。


やり方は簡単なのですが、予備知識として知っておいた方が良いこと、知っておくべきことを自分用の覚書として書いておこうと思います。


まず、ビルダーの「共通部分の同期」は、「フルCSSテンプレート」を使うことが前提となっています。
しかし、デザインを変えたくない場合、「フルCSSテンプレート」にするわけにはいかないので、裏技を使うことになります。

やり方です。

ポイントを赤い文字にしました。

1.bodyタグにビルダーのテンプレート名を書く。

<body id="hpb-template-01-01-01">

*テンプレート名はテキトーではだめ。

2.同期したい部分(ナビメニュー)を選択する

ビルダーには、タブが4つあります(16の場合)が、必ず「ページ編集」タブに切り替えてから、選択をすること!←地味ですがすごく大事。


「ページ編集」タブの状態でしか、「共通部分の同期」はできません。

3.共通部分の同期

同期したい部分(ナビメニュー)を選択をしたら右側のメニューから「タグ一覧」にして、右クリックし「共通部分として登録」をクリック。
一度登録したら、次からは「共通部分の同期」

*ナビメニューは、<div id="○○">として作成しておかなければいけません。私が引き継いだ元の作成者は、<div class="○○">として作成していたので、苦労しました。

共通部分の同期ができるのは、【id属性】のみ!
ページ内に【class属性】は何度でも使えるが、【id属性】は一度だけ!


心配だったのが、単純に class を id に書き換えるだけでいいのか?
という事。結果、OKでした。


という事は、Dreamweaverのライブラリは同じページの中に複数作れるので、ヘッドの部分とかフットの部分もライブラリで作成してあるので、自在に何か所でも一括変更ができました。
しかし、ビルダーの「共通部分の同期」は同じページ内で一つだけしか使えないid属性を利用しているので一括変更できる場所は一か所のみという事になります。そういったところがお値段の差なんでしょうね。納得。

まぁ、サイドメニューほど頻繁に内容は変えることはないと思いますが。
それでも変えなければいけない時は、サイドメニューのidをclassに書き換え、ヘッドやフッタにあるclassをidに書き換えて更新。
いや、コピペで一枚づつやったが早いかな(笑)


忘れがちなのが、「上書き保存」です。
私も最初、何度やっても同期されなかったのですが、「上書き保存」していないのが原因とわかるまでこれまた悩みました。
という事で!!


必ず、「上書き保存」をしてから、同期をすること!!


初歩的な事ですが、単純作業を延々とやっていると手落ちする時もあると思うので・・・


あとは、更新したいナビメニューの入っているhtmlファイルをひたすら書き換えて行って下さい。最初は大変ですが次回からはとても楽になります。


私の場合は、htmlファイルは55枚ありましたが、不必要なものを整理しながらやれたので、断捨離も兼ねられて良かったです。

何より、ナビメニューをちょっと変更したいだけなのに、トラブル続きのDreamweaver8と長いこと格闘していたことを思えばなんてことはありません。

さぁて、頑張って独自ドメインサイト。
更新しよう!!

PageTop