「【Wordpress】style.cssに書くこと」で「style.css」を作成しました。後は作成するサイトに必要なスタイル（css）を記載すれば完成です。
では、次に「index.php」には何を書いたらいいか見ていきましょう。
スポンサーリンク共通部分を読み込む
サイトにはヘッダーやフッター、サイドなどサイト全体で共通する箇所があります。その共通部分を読み込むための関数がWordpressには用意されています。
ヘッダーを読み込む
<?php get_header(); ?>
上のように関数「get_header()」を使えばヘッダーを読み込んでくれます。具体的にいうと、「header.php」を読み込んでくれます。
つまり、header.phpに「ヘッダーで共通する部分」を書けばOKです。
「get_header(‘top’)」というように引数を渡すると、読み込まれるファイルは「header.php」ではなく「header-top.php」になります。
トップページだけ他のページとは異なるヘッダーを使いたい場合などに、引数を指定するといいですね。
サイドを読み込む
<?php get_sidebar(); ?>
上のように関数「get_sidebar()」を使えばサイドを読み込んでくれます。具体的にいうと、「sidebar.php」を読み込んでくれます。
つまり、sidebar.phpに「サイドで共通する部分」を書けばOKです。
「get_sidebar(‘top’)」というように引数を渡すると、読み込まれるファイルは「sidebar.php」ではなく「sidebar-top.php」になります。
トップページだけ他のページとは異なるサイドを使いたい場合などに、引数を指定するといいですね。
フッターを読み込む
<?php get_footer(); ?>
上のように関数「get_footer()」を使えばフッターを読み込んでくれます。具体的にいうと、「footer.php」を読み込んでくれます。
つまり、footer.phpに「フッターで共通する部分」を書けばOKです。
「get_footer(‘top’)」というように引数を渡すると、読み込まれるファイルは「footer.php」ではなく「footer-top.php」になります。
トップページだけ他のページとは異なるフッターを使いたい場合などに、引数を指定するといいですね。
トップページの内容をhtmlで書く
共通部分を読み込む部分も含めたソースがこちらです。
<?php get_header(); ?> <p>ここにトップページの内容を書きます。</p> <?php get_sidebar(); ?> <?php get_footer(); ?>
テキストだけなので非常にシンプルです。
反映したトップページを見てみる
先ほどのシンプルなソースを反映してトップページを見てみると身に覚えのない情報が表示されました。
実は、Wordpressでは「get_header()」「get_sidebar()」「get_footer()」で読み込むはずの「header.php」「sidebar.php」「footer.php」がテーマフォルダに無い場合、下記ファイルを代わりに表示してくれる仕様になっています。
| header.phpが無い場合 | wp-includes/theme-compat/header.php |
|---|---|
| sidebar.phpが無い場合 | wp-includes/theme-compat/sidebar.php |
| footer.phpが無い場合 | wp-includes/theme-compat/footer.php |
WordPressがデフォルトのファイルを用意してくれているということですね。
実際はこれらのファイルを用意すると思いますので特に覚えておく必要はありません。
「header.php」「sidebar.php」「footer.php」を用意する
中身が空の「header.php」「sidebar.php」「footer.php」を用意してテーマフォルダに入れました。
反映したトップページを見てみる
改めてトップページを見てみると、先ほど代わりに表示されていた内容は消えましたが、管理バーも消えてしまいました。
これは、「wp_footer()」が記述されていないことが原因です。
通常「footer.php」に記述するのですが、今は空ファイルなので、管理バーが表示されていません。先ほど代わりに使用していた「wp-includes/theme-compat/footer.php」には下記のように「wp_footer()」が記述されているので管理バーが表示されていました。
今後「footer.php」についても記事を書く予定ですので、その際に対応します。
まとめ
少し脱線が多くなってしまいましたので、「index.php」に書くソースを見直しておきましょう。
<?php get_header(); ?> <p>ここにトップページの内容を書きます。</p> <?php get_sidebar(); ?> <?php get_footer(); ?>
記事自体は長くなってしまいましたが、index.phpのソースは↑これだけです。
今後「<p>ここにトップページの内容を書きます。</p>」の部分についてもう少し手を加えていきたいと思います。
手を加える内容としては、下記のようなトップページでよく利用されるコンテンツを考えています。
- ページタイトル、エディターの読み込み
- お知らせなど投稿の読み込み
- スライダーの実装
- カスタムフィールドの読み込み
etc…
スポンサーリンク
