【Q】ホームページが大きくなるにつれてナビゲーションの管理(?)に困っています。ページを増やすたびにたくさんのファイルを変更しなくてはいけません・・
ナビゲーションは、ホームページによっては、サイトのヘッダーにあったり、サイドナビにあったりして、目次の役目を担う部分ですが、ページが増えたり、サイト内で何か変更があったときにナビゲーションも変えないといけないので、数ページ程度のサイトなら問題ないのですが、何十ページと増えてくるとリンクミスを起こしたり、なかなか管理が大変です。
《2016年2月補足》サイトリニューアルにあたり、旧記事を整理していますが、アクセスの多い記事は残していこうと思います。古い情報が入っていますのでご注意ください。
Dreamweaverを使う方法
Dreamweaverを持っている場合は、テンプレートかライブラリーという機能を使えば、サイト内のナビゲーションなどの管理が楽になります。
テンプレートとライブラリーの違いはこうです。
テンプレートは全体のデザインを作っておいて、共通部分(ナビゲーション)はテンプレートに管理させ、テンプレートの中に編集可能領域を設定し、その中にコンテンツを作って行く方法です。
ライブラリーは、ページそのものは普通に作っておいて、共通部分をパーツのようにライブラリーの中にいくつか作って行き、共通部分(ナビゲーション)が変更になったらライブラリーを更新する。すると、サイト内のライブラリーを使っているページが一斉に書き換わるというものです。
[Dreamweaverのテンプレートとライブラリーの違い]
私が使ってみて思うにはテンプレートよりはライブラリーの方が初心者にやさしいです。テンプレートは、リニューアルなど、テンプレートの差し替え等の操作を間違えると、サイト内を壊してしまい大変な状態になってしまう可能性が・・・・。
こちらの動画マニュアルで、Dreamweaverのテンプレートの使い方と、ライブラリーの使い方を紹介していますので初心者の方は参考にしてください。テンプレートとライブラリーは最初の設定を間違えるとおかしいことになるので注意が必要です。
コツとしては、ナビゲーションのリンク先が相対パスになっていること。
テンプレートやライブラリーとして保存したとたんに、そのテンプレートからみたパスに書き換わります。
それが、テンプレートやライブラリーを適用したとたんに、そのファイルからみたパスに自動的に書き換わります。
>Dreamweaverのテンプレートの使い方
>Dreamweaver のライブラリーの使い方
PHPにしてナビゲーション部分を読み込む方法
htmlファイルをphpファイルに変えて、共通部分を読み込ませるという方法があります。サーバーがphpに対応していないと使えません。
ヘッダー部分をheader.phpで作っておき、サイドナビの部分をsidenavi.phpで作っておき、
読み込ませたい部分に下記のコードをいれます。
<?php include(”header.php”); ?> |
phpでヘッダーとサイドナビを読み込む方法
ページはindex.phpという拡張子で保存します。
サーバーにアップして、ブラウザのアドレスに
http://www.●●.com/ と打ち込むと 、そのディレクトリに、index.htmlが存在する場合はそちらが出てしまうので注意が必要です。その場合は、index.htmlは削除しておき、index.phpが表示されればOK。だめだったら、.htaccessでサーバーの設定を変更する必要があります。
どう変更するかというと、「スラッシュ以下を省略した場合、最初にindex.phpを読みにいきなさい、そのファイルがない場合は、index.htmlを読みにいきなさい」というような命令を書いてあげないといけません。詳しくは上記の.htaccessの使い方を見てください。
phpファイルについては、もう少し詳しく紹介したいところですが、かな~りざっくり説明すると、
htmlの中に埋め込むことができる便利なプログラムの言語で、全部をこのプログラム言語で書く必要はなく、ウェブデザイナーさんが知っているHTMLの中の一部として使うことができます。
上記で利用した命令は、includeという命令ですが、他にもいっぱい便利な命令があり、ここに今日の日付を入れなさいとか、ここにユーザーの名前を入れなさい(その名前はユーザーによりそのたびに変わる)そんないろんなことができます。
これだけではあまりにも片手落ちなので参考サイトを載せておきます。
>>php.net PHP とはなんでしょう?
htmlファイルではなくなると、作業しているパソコン上でプレビューができなくなってしまいます。(Dreamweaverでphpファイルを作っている場合はできますが)
その場合は、自分のパソコン上にプログラムが動く場所(Apache+PHPの動く場所)を作らなければいけません。
>>PHP制作環境の設定(macもしくはウィンドウズのところを見てください)
拡張子が変わってしまうと外部リンクなどもリンク切れになってしまい困る
htmlという拡張子のままでも、phpを動かす方法はあります。サーバーの設定を変えないといけないんですが、下記を参考にしてください。
>>拡張子htmlのファイルをPHPで動かす
>>さくらサーバーで.php以外の拡張子でphpを動かしたい
webの森では、デザイナーの卵さん向けの個人講習も行っています。
会社でweb担当者になったんだけど、基本を知らないとまずいらしい・・・??と思われた方などなど。
詳しくはお問合せください
- 前の記事
- Art Beau Entrance(アート・ボー・エントランス) 様
- 次の記事
- 絵本のイラスト
関連記事
-
-
【ホームページの作り方】病院・歯科医院のホームページ作成
歯科医院のホームページは、院長・スタッフ紹介、治療内容、医院の紹介と受付時間・交通アクセスなど、だい ≫続きを読む
-
-
Dreamweaverで携帯サイトを作る方法
携帯(ガラケー)サイトの作り方なんてもう不要な技術なのかもしれませんが、自分でも、この記事の中身をも ≫続きを読む
-
-
【Q】サーバーとかドメインとか言われてもよくわからないのですが・・・
webの森では、サイト制作をご依頼したお客様に、毎回サーバーとドメインの管理を今後どうするかをお聞き ≫続きを読む
-
-
【ホームページの作り方】スクールサイト・教室・教育機関のホームページ作成
学校のホームページを作る時、何を目的につくるか、誰が対象か、更新は誰がどんな方法で行うか、この点が大 ≫続きを読む
-
-
質問:わたしのホームページ検索で出てこないんです・・・その原因
先日、「うちのホームページ、検索しても出てこないんです」という相談をされ、見てみたところ、本当に、サ ≫続きを読む
-
-
Q:FBページを作りました。書いたブログを自動的にリンクさせたいのですが・・・
A:結論からいうと、facebookの自動投稿はおすすめできません クライアント様から質問をいただい ≫続きを読む
-
-
Q:ドメイン移管の手順を教えてください
ドメインの移管(ドメインの管理者を移動すること)の手順は、転出と受け入れ先のそれぞれのレジストラ業者 ≫続きを読む
-
-
調整レイヤーの使い方
フォトレタッチの極意1:紅葉の色彩をアップする | Adobe Creative Station 部 ≫続きを読む
-
-
【Q】ドメインの引っ越しについて何からしたら良いかわかりません。具体的には今別会社で管理しているのを私が管理したいのですが・・・
ドメインの移管は何度やってもけっこう大変というか、失敗しないように出来るかちょっと緊張します。 とい ≫続きを読む
-
-
覚えてもらえるお店になること・・・
webの森は信州EC実践会という、ウェブマーケティングの勉強会を主催していまして、たくさんのネット店 ≫続きを読む