【初心者向け】WordPressで投稿ページを作る方法をわかりやすく解説

2025年9月21日

WordPress

WordPressには「固定ページ」と「投稿ページ」の2種類のページがあります。
固定ページは「会社概要」や「お問い合わせページ」のように、基本的に1つだけ置いておく情報を作るのに向いています。

一方で、ブログ記事やお知らせなど「更新してどんどん追加していくコンテンツ」を作るのに使うのが 投稿ページ です。
投稿ページは日付順に並び、カテゴリーやタグで整理できるのが特徴です。

本記事では、初心者の方に向けて

管理画面から投稿ページを作る方法
投稿ページを表示するためのテンプレート single.php の基本構造

を、わかりやすく解説していきます。
「投稿ページってどうやって作るの？」「コードで呼び出すときはどうするの？」と疑問を持っている方は、ぜひ参考にしてください。

目次 [ close ]

WordPress管理画面で投稿ページを作る

WordPressでは管理画面から簡単に投稿ページを作成できます。
ここでは Classic Editor を使う方法を中心に解説します。

STEP1

プラグイン「Classic Editor」をインストール

プラグインを追加から「Classic Editor」をインストールし有効化する

STEP2

新規投稿を作成する

WordPressの管理画面にログインします。
左側のメニューから 「投稿」 → 「新規追加」 をクリックします。
タブを「コード」に切り替えてください。

STEP3

記事の内容コピペする

タイトル：記事のタイトルを入力
本文：HTMLでコーディングした内容をそのままエディターに貼り付けることもできます。

STEP4

カテゴリーとタグを設定する

カテゴリー：記事の大まかな分類（例：お知らせ、ブログ）
タグ：記事のキーワード（例：WordPress、更新情報）

STEP5

アイキャッチ画像を設定する

記事のサムネイル画像として表示されるのが アイキャッチ画像 です。
トップページや記事一覧で見栄えをよくするために設定しておくと便利です。

STEP6

記事を公開する

右側の「公開」ボタンをクリックすると、投稿ページが作成されます。

補足：ブロックエディターの場合

ブロックエディターを使っている場合は、手順はほぼ同じですが、本文は ブロック単位 で追加します。

「投稿」→「新規追加」をクリック
見出しや段落、画像などをブロックとして追加
カテゴリー・タグ・アイキャッチ画像を設定
公開ボタンで投稿完了

💡 ポイント
Classic EditorではHTMLを直接コピペして記事を作れるのに対し、ブロックエディターは直感的にレイアウトや見た目を整えやすいという特徴があります。

投稿ページの表示仕組み

WordPressで投稿ページを作成すると、管理画面で入力した内容が自動的にテーマの single.php を通じて表示されます。
ここでは投稿ページがどのように表示されるかを簡単に理解しておきましょう。

1. 投稿ページとテンプレート階層

WordPressには テンプレート階層 という仕組みがあります。
投稿ページは次の順番でテンプレートファイルが呼び出されます：

single-{post_type}.php （カスタム投稿タイプがある場合）
single.php
singular.php
index.php

つまり、テーマに single.php があれば、そこが投稿ページの表示に使われます。
なければ singular.php、それもなければ最終的に index.php が使われるという流れです。

2. 投稿ページで表示される内容

single.php 内では主に以下の関数で投稿内容を呼び出します：

the_title() … 投稿のタイトルを表示
the_content() … 投稿本文を表示
the_date() / the_time() … 投稿日を表示
the_category() / the_tags() … カテゴリーやタグを表示
the_post_thumbnail() … アイキャッチ画像を表示

これらを組み合わせて、管理画面で作成した投稿ページがブラウザ上に表示されます。

3. Classic Editorとブロックエディターの違い

Classic Editor
投稿本文のHTMLがそのまま出力されます。コーディングした内容を忠実に反映できます。
ブロックエディター
投稿本文はブロック単位で構造化され、the_content() でまとめて出力されます。
HTMLやCSSでカスタマイズするときも、基本的には同じ関数で呼び出せます。

💡 ポイント
管理画面で投稿ページを作る → single.php が呼ばれる → the_title() や the_content() で表示される、という一連の流れを理解しておくと、テーマのカスタマイズもスムーズになります。

single.php の基本構造とシンプルなコード例

1. 基本構造

single.php は大きく分けて以下の流れで構成されます：

ヘッダーを読み込む → get_header()
投稿ループ → if (have_posts()) : while (have_posts()) : the_post();
投稿タイトル・本文・アイキャッチなどを表示
フッターを読み込む → get_footer()

2. シンプルなコード例

<?php get_header(); ?>

<main class="post-single">
  <?php
    if (have_posts()) :
      while (have_posts()) : the_post();
  ?>
    <article>
      <!-- 投稿タイトル -->
      <h1><?php the_title(); ?></h1>

      <!-- 投稿日 -->
      <p class="post-date"><?php the_time('Y.m.d'); ?></p>

      <!-- カテゴリー -->
      <p class="post-category">
        カテゴリー: <?php the_category(', '); ?>
      </p>

      <!-- アイキャッチ画像 -->
      <?php if (has_post_thumbnail()) : ?>
        <div class="post-thumbnail">
          <?php the_post_thumbnail('large'); ?>
        </div>
      <?php endif; ?>

      <!-- 投稿本文 -->
      <div class="post-content">
        <?php the_content(); ?>
      </div>

      <!-- タグ -->
      <p class="post-tags">
        <?php the_tags('タグ: ', ', '); ?>
      </p>
    </article>
  <?php
      endwhile;
    endif;
  ?>
</main>

<?php get_footer(); ?>