ブログ

4.テーマ編集 – header.phpとfooter.php


カテゴリ:備忘録(WordPress)

まずは、index.phpからheader.phpとfooter.phpへ一部を移動させます。

まずは、header.phpから。
練習用のindex.phpのソースの一番先頭から

---------------------------------------------
<!doctype html>
<html>
<head>
<meta charset="utf-8">

<title>Portfolio 練習</title>

<link rel="stylesheet" href="reset_html5.css">
<link rel="stylesheet" href="style.css">

</head>

<body>

<div id="wrpper">

	<header>
		<h1 id="logo">Portfolio 練習</h1>
		<nav>
			<ul>
				<li>HOME</li>
				<li>自己紹介</li>
				<li>作品</li>
			</ul>
		</nav>
	</header>
	<!-- ここまで header▲ -->

---------------------------------------------

ここまでをindex.phpから切り取ってheader.phpへ貼り付けて保存。
index.phpへは変わりに以下を入れます。

---------------------------------------------
<?php 
/* Template Name: ホーム用 */
get_header(); ?>
---------------------------------------------

次にfooter.phpを。footerの上くらいから

---------------------------------------------
	
	<footer>
		<p>コピーライト</p>
	</footer>
	<!-- ここまで footer▲ -->

</div>
<!-- ここまで #wrapper▲ -->

</body>
</html>
---------------------------------------------

一番最後までを切り取ってfooter.phpへ貼り付けて保存。
index.phpへは変わりに以下を入れます。

---------------------------------------------
<?php get_footer(); ?>
---------------------------------------------

これで、index.phpのheader部分とfooter部分はheader.phpとfooter.phpを呼び出して出力されるので表示されるのを確認したらここまでは完了。
次はテーマ編集 – cssフォルダとイメージフォルダのパスをphp化へ。

この記事のトラックバック用URL

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA


PAGE TOP