WordPress オリジナルテーマを作る サイドバー/サイドメニューの作成

2カラム（または3カラム等）のブログでは、記事のサイドにブログの各メニューのリンクがあるのが一般的ですね。たとえば、カテゴリーや月別アーカイブなどです。それらのメニューを表示させるサイドバーを、今回は作っていきます。

サイドバーにも、サイドバー専用のファイルを作ると便利です。

「sample」（任意のテーマフォルダの名前）フォルダに「sidebar.php」というファイルを作成してください。これまでと同様にテーマフォルダにアップロードします。アップロード先は、「wp親フォルダ > wp-contet > themes > sample（「sample」は任意のテーマフォルダの名前）」でしたね。パーミッションは「755」または「777」にします。

これで「ダッシュボード > 外観 > テーマ編集」から編集できます。「サイドバー (sidebar.php)」となっているのがそうです。クリックするとファイルの内容を表示できます。現在はまだ白紙のままです。

かりに、今の状態の「sidebar.php」に文字を入力し更新しても、ブログにはサイドバーの中身は表示されません。なぜなら、まだその他のファイル（「index.php」など）に「sidebar.php」ファイルを表示させるテンプレートタグを挿入していないからです。
あるテンプレートファイルに、別のテンプレートファイルの内容を表示させるタグをインクルードタグと呼びます。

実はこのインクルードタグはすでに、ここまで作成してきたテンプレート内で使っています。
それが以下の緑色のタグです。

編集: index.php

<?php get_header(); ?>

<div id="contents">

<?php if(have_posts()): while(have_posts()): the_post(); ?>
<div class="entry">
<h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
<div class="entry_main">
<?php the_content(); ?>
</div>
<p class="state"><?php echo get_the_date(); ?> <?php the_time(); ?>　　カテゴリー： <?php the_category(', '); ?></p>
</div>
<?php endwhile; endif; ?>

<div class="navi">
<?php previous_posts_link('&lt;&lt; 新しい記事へ'); ?>
│<a href="<?php echo home_url(); ?>">トップ</a>│
<?php next_posts_link('古い記事へ &gt;&gt;'); ?>
</div>

</div>

<?php get_footer(); ?>

「<?php get_header(); ?>」「<?php get_footer(); ?>」のこの2つがインクルードタグです。「single.php」にもおなじように使われています。
では、このタグはそれぞれどのような意味を持つのでしょうか。

「<?php get_header(); ?>」は、このタグを入力したファイルのその場所に「header.php」を表示させます。「index.php」「single.php」共に、ファイルの一番先頭にタグを記述しているので、実際のウェブページではページ上部にこの「header.php」の中身が表示されています。
「<?php get_footer(); ?>」も同様に、このタグを入力したところに「footer.php」を表示させています。「index.php」「single.php」のページの一番最後の部分がそうですね。

インクルードタグはいくつかありますが、その中にないファイルを表示させたい場合は「<?php include( TEMPLATEPATH . 'ファイル名' ); ?>」を記述することで表示できます。ファイル名は必ず相対パス（例：'/neko.php'）で設定することに注意してください。

これでインクルードタグについてなんとなくわかっていただけたでしょうか。
次は今回の本題である、サイドバーの「sidebar.php」ファイルを、インクルードタグを使って表示させてみます。以下が「sidebar.php」を表示させるタグです。

Pick up

<?php get_sidebar(); ?>

ではこのタグを「index.php」「single.php」にさっそく記述します。

編集: index.php

<?php get_header(); ?>

<div id="contents">

<?php if(have_posts()): while(have_posts()): the_post(); ?>
<div class="entry">
<h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
<div class="entry_main">
<?php the_content(); ?>
</div>
<p class="state"><?php echo get_the_date(); ?> <?php the_time(); ?>　　カテゴリー： <?php the_category(', '); ?></p>
</div>
<?php endwhile; endif; ?>

<div class="navi">
<?php previous_posts_link('<< 新しい記事へ'); ?>
│<a href="<?php echo home_url(); ?>">トップ</a>│
<?php next_posts_link('古い記事へ >>'); ?>
</div>

</div>

<?php get_sidebar(); ?>

<?php get_footer(); ?>

編集: single.php

<?php get_header(); ?>

<div id="contents">

<?php if(have_posts()): while(have_posts()): the_post(); ?>
<div class="entry">
<h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
<div class="entry_main">
<?php the_content(); ?>
</div>
<p class="state"><?php echo get_the_date(); ?> <?php the_time(); ?>　　カテゴリー： <?php the_category(', '); ?></p>
</div>
<?php endwhile; endif; ?>

<div class="navi">
<?php next_post_link('%link', '<< 次の記事'); ?>
│<a href="<?php echo home_url(); ?>">トップ</a>│
<?php previous_post_link('%link', '前の記事 >>'); ?>
</div>

</div>

<?php get_sidebar(); ?>

<?php get_footer(); ?>

これで「index.php」「single.php」に、「sidebar.php」を表示することができます。現在はサイドバー部分は白紙ですが、次回から中身を作っていきます。