インクルード
- 2013 7/28
まずは、ワードプレスに倣ってファイルを各パーツごとに分割していきましょう!
使用するPHPの関数は
include_onceです。→PHPマニュアル
include_once 命令は、スクリプトの実行時に指定 したファイルを読み込み評価します。
今回行うのは、header部分をheader.phpに、footer部分をfooter.phpに分けていきます。
header.phpを作成します。
first.phpからヘッダー情報からheaderタグ~navタグに相当する部分をコピーして header.phpに貼り付けます。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 |
<!DOCTYPE html> <!--[if lt IE 7]> <html class="ie6" lang="ja"> <![endif]--> <!--[if IE 7]> <html class="ie7" lang="ja"> <![endif]--> <!--[if IE 8]> <html class="ie8" lang="ja"> <![endif]--> <!--[if gt IE 8]><!--> <html lang="ja"> <!--<![endif]--> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> <title>PHP 練習</title> <meta name="description" content="" /> <meta name="author" content="ken mori" /> <meta name="viewport" content="width=device-width; initial-scale=1.0" /> <!--[if lt IE 9]> <script src="js/html5shiv.js"></script> <![endif]--> <link rel="stylesheet" type="text/css" href="style.css"> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script> </head> <body> <header> <h1>PHP 練習</h1> </header> <nav id="Gnuv"> <ul> <li><a href="index.php">topIndex</a></li> <li><a href="first.php">変数・配列・文字列</a></li> <li><a href="#">link_2</a></li> <li><a href="#">link_3</a></li> </ul> </nav> |
↑header.php
footer.phpを作成します。
first.phpからヘッダー情報からfooterタグ~</html>までをコピーして footer.phpに貼り付けます。
1 2 3 4 5 6 7 8 9 |
<footer> <p> © Copyright by your name lesson start from 07.29.13 to today <?php echo date("m.d.y"); ?> </p> <script src="js/autoHeight.js"></script> <script src="js/drive.js"></script> </footer> </body> </html> |
↑ footer.php
index.phpを作成します。
first.phpをコピーして、先ほどheader.phpやfooter.phpに貼り付けた部分を削除してください。または、<section>領域をひとつだけにしてく index(目次)として使用できるようリンクを作ってください(現状はfirst.phpへのリンク)。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
<div id="container"> <div id="article_wrap"> <article> <h2>INDEX</h2> <div class="sect_wrap"> <section> <ul> <li><a href="first.php">変数・配列・文字列</a></li> </ul> </section> </div> </article> </div> </div> |
↑ index.php
作成したindex.phpの一番上の行に
1 |
<?php include_once 'header.php'; ?> |
一番下の行に
1 |
<?php include_once 'footer.php'; ?> |
を追加してください。
first.phpを修正します。
index.phpと同じように、ヘッダーに関する部分、フッタに関する部分を削除して、それぞれinclude_once関数におき変えてください。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
<?php include_once 'header.php';?> <div id="container"> <div id="article_wrap"> <article> <div class="sect_wrap"> <section> <h2>section_title</h2> </section> </div> <div class="sect_wrap"> <section> <h2>section_title</h2> </section> </div> </article> </div> </div> <?php include_once 'footer.php';?> |
これで、コンテンツ部分を修正や作成する場合はそれぞれの該当するファイルを、ヘッダーやフッタを修正加筆する場合(リンクの追加など)はその該当ファイルだけに行えばよいことになり、保守性がかなりあがります!
ワードプレスも仕組み的にこのようなことを行っています(仕組みとしてはもっと複雑になっていますが・・・)