Skip to content

WordPressテーマ制作参考用メモ

Wordpressテーマ制作用にノートパソコンと植物を置いた机。

Bootstrap対応のWPテーマの作成に役立つ情報をまとめています。

何かお困りな点があればWordPressの公式参考書Wordpress Codex を参照ください。

テンプレート階層

最重要: テンプレート階層

WordPressテーマの開発に必ず理解する必要がある点がWordPressのテンプレート階層です。※ 2022年5月19日現在、WordPressの公式参考書で日本語でテンプレート階層を図で紹介する画像がなくなっているため以下ご紹介しています。

基本関数 index.php で使用する基本関数

ヘッダーにWordPressテーマやプラグインが指定するコードを挿入するための一行を </header> の前に記入します。

<?php get_header(); ?> <!-- ヘッダーを読み込む -->

続いてフッターにも同じ役割の一行を記入します。

<?php get_footer(); ?> <!-- フッターを読み込む -->

その他

サイドバーを挿入する場合は以下のコードを使用ください。

<?php get_sidebar(); ?> <!-- サイドバーを読み込む -->

<?php get_search_form(); ?> <!-- 検索フォームを読み込む => 使用はWordpress Codex 用参照 -->

検索フォームの場合はこちらになります。

<?php get_search_form(); ?> <!-- 検索フォームを読み込む => 使用はWordpress Codex 用参照 -->

ループについて 記事表示のスタンダードループ

基本ループ

ループはここから始まり、

<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>

ここで終わります。

<?php endwhile; else : ?>
<p><?php _e( 'すみません、記事は見つかりませんでした。' ); ?></p>
<?php endif; ?>

投稿/ページ用のスタンダードループ

<?php if ( have_posts() ) : ?>
  <?php while( have_posts() ) : the_post(); ?>
      <h2><?php the_title(); ?></h2>
      <p><?php the_content(); ?></p>
<?php endwhile; else : ?>
<p><?php _e( 'すみません、記事は見つかりませんでした。' ); ?></p>
<?php endif; ?>
 

参考コード: 特定のカテゴリーにある投稿のスタイルを変更する

<!-- ループ開始 -->
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
<!-- 以下で、投稿がカテゴリー3に属しているかテスト -->
<!-- もし属している場合、"post-cat-three"というCSSクラスのdivボックスを表示 -->
<!-- それ以外の場合、"post"というCSSクラスのdivボックスを表示 -->
<?php if ( in_category( '3' ) ) : ?>
<div class="post-cat-three">
<?php else : ?>
<div class="post">
<?php endif; ?>
<!-- 投稿のタイトルとパーマリンクを表示 -->
<h2><a href="<?php the_permalink(); ?>">
<?php the_title(); ?></a></h2>
<!-- 日時を表示 -->
<small>
<?php the_time('F jS, Y'); ?></small>
<!-- 投稿の本文をdiv内に表示 -->
<div class="entry">
<?php the_content(); ?>
</div>
<!-- 投稿のカテゴリーをコンマ区切りで表示 -->
<p class="postmetadata">Posted in
<?php the_category(', '); ?>
</p>
</div> <!-- 最初の div ボックスを閉じる -->
<!-- "else"部分を除いたループ終了 -->
<?php endwhile; else: ?>
<!-- 最初の"if"にて表示する投稿があるかどうかをテストしたため、"else"では投稿がない場合に実行 -->
<!-- つまり、投稿がなければ以下を表示 -->
<p>Sorry, no posts matched your criteria.</p>
<!-- ループを「完全に」終了 -->
<?php endif; ?>

投稿一覧に一般的使用される関数 (ブログリスト用)

<?php the_title(); ?> <!-- 記事のタイトルを読み込む -->
<?php the_excerpt(); ?> <!-- 抜粋を読み込む -->
<?php the_permalink(); ?> <!-- リンクを読み込む -->
<?php echo get_the_date(); ?> <!-- 投稿の作成びを読み込む -->
<?php the_author(); ?> <!-- 作成者を読み込む -->
最終更新日: 2025-12-05

この記事は役に立ちましたか?