なかなか思った通りにはいかないな。
photo credit: linh.ngan via photo pin cc
状況
お客さんから、ホームページの更新方法の相談を受けている。
HTMLで書かれた静的ページが何ページかあるが、フッター部分に手を加えようとすると、今は全てのページを変更しなくてはいけない。
これを1箇所修正して、複数ページに反映されるようになって欲しいとのこと。
考えたこと その１
PHPが使えるサーバーにホームページを設置されているので、PHPにしてしまってフッターも部品化して、
<?php
require_once("../parts/footer.php");
?>
としてしまえばいいが、各ページのURLが変わってしまうので、リンクも変更しなくてはいけないので、結構手間がかかる。
考えたこと その2
HTMLのままで対処できないか考えたら、iframeタグでなんとかなるのではと考えて、試してみた。
結果
iframeタグを使って分割したフッターを読み込むようにしたが、幅300px、高さ150pxでなぜか表示される。
FirefoxのFirebugを使ってチェックしても、どこかで指定しているかわからないので、勝手になっているっぽい。
調べたら、widthがピクセルか%で指定できることがわかったので、
<iframe src="../footer/index.html" scrolling="no" frameborder="0" style="width:100%;"></iframe>
としたら、横幅はブラウザの最大サイズまで自動調整された。
高さは、JavaScriptで取得する方法が検索で見つかったので、取り入れてみようと考えている。
JavaScriptで高さが自動で調整できるようになれば、ブラウザ違いを試してみて、よければ、他のページにも試しに導入してみて、全ページで大丈夫そうか、見極める予定をしている。
