php26 header.phpの切り出し

index.phpからヘッダー部分を切り出していきましょう。

ヘッダー用phpファイルの作成

index.phpと同じフォルダ内に、新規に「header.php」と名前を付けた、空のファイルを作成します。

index.phpをテキストエディタで開きます。

ヘッダー部分の切り出し

<!– ヘッダー部分 –>の範囲内だけではなく、
HTMLソースの1行目からhead要素など全部含めて<!– コンテンツ部分 –>の上の行までを切り取ります。

切り取った部分の記述をheader.phpに貼り付けます。

ヘッダー部分の呼び出し

index.phpの<!– コンテンツ部分 –>の上に、header.phpの内容を呼び出すための記述をしていきましょう。

<?php get_header(); ?>
<!– コンテンツ部分 –>

「get_header」でheader.phpに書かれている記述を呼び出します。

 

ここまでの記述確認

index.php

<?php get_header(); ?>
<!– コンテンツ部分 –>
<div id=”content”>
<?php if(have_posts()): while(have_posts()): the_post(); ?>
<div class=”post”>
<h3>
<a href=”<?php the_permalink(); ?>”>
<?php the_title(); ?>
</a>
</h3>
<?php the_content(); ?>
<p class=”postinfo”>
<?php the_date(); ?>
<?php the_time(); ?>
/記事カテゴリー:
<?php the_category(‘,’); ?>
</p>
</div>
<?php endwhile; ?>
<?php else: ?>
<h2>記事がありません</h2>
<?php endif; ?>
</div>
</div>
<!– サイドバー部分 –>
<div id=”sidebar”>
ここにサイドバーが入ります。
</div>
<!– フッター部分 –>
<div id=”footer”>
<p id=”copyright”>
Copyright &copy; <?php echo date(‘Y’); ?> <?php bloginfo(‘name’); ?>
All rights Reserved.
</p>
</div>
</div>
</body>
</html>

 

header.php

<!DOCTYPE html>
<html lang=”ja”>
<head>
<meta charset=”<?php bloginfo(‘charset’); ?>”>
<title>
<?php bloginfo(‘name’); ?>
</title>
<!– スタイルシート呼び出し –>
<link href=”<?php echo get_stylesheet_uri(); ?>” rel=”stylesheet” type=”text/css”>
</head>
<body>
<!– コンテナ –>
<div id=”container”>
<!– ヘッダー部分 –>
<div id=”header”>
<h1>
<a href=”<?php bloginfo(‘url’); ?>”>
<?php bloginfo(‘name’); ?></a>
</h1>
<h2>
<?php bloginfo(‘description’); ?>
</h2>
</div>

関連記事