WordPressでトップページに記事を表示する方法は、サイトの構成や目的に応じていくつかの方法があります。ここでは、最も一般的な方法をいくつか紹介します。
1. 管理画面の設定を使ってトップページに最新記事を表示する
WordPressの基本設定では、トップページに最新の投稿一覧を表示するようになっています。
手順:
- WordPress管理画面にログイン
- 左メニューから
設定 > 表示設定を選択 - 「ホームページの表示」で、「最新の投稿」 を選択すると、トップページに最新記事一覧が表示されます。
- 必要に応じて、「1ページに表示する最大投稿数」 を設定し、保存します。
2. 固定ページをトップページに設定し、投稿一覧ページを別途用意する方法
トップページを固定ページにして、サイトのメインデザインやカスタムコンテンツを表示しつつ、投稿一覧は別のページで表示する方法です。
手順:
- 固定ページの作成
「ホームページ」として使いたい固定ページを作成します。（例: 「トップ」など）
また、投稿一覧用の固定ページも作成します。（例: 「ブログ」または「最新記事」） - 管理画面で固定ページをトップページに設定
設定 > 表示設定に移動し、
「ホームページの表示」を 「固定ページ」 に変更。
「ホームページ」には先ほど作成した固定ページを、「投稿ページ」には投稿一覧用のページを選択し、設定を保存。 - 固定ページの内容に合わせたカスタマイズ
必要に応じて、固定ページにショートコードやカスタムブロックを使い、投稿一覧（例：「最新の投稿」ブロック）を表示できます。
3. テーマテンプレートをカスタマイズしてトップページに投稿一覧を表示する
テーマのテンプレートファイル（通常は index.php や front-page.php）を編集して、WordPressループを利用し、記事を動的に出力する方法です。
例:
<?php if ( have_posts() ) : ?>
<?php while ( have_posts() ) : the_post(); ?>
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<header class="entry-header">
<h2 class="entry-title">
<a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
</h2>
</header>
<div class="entry-content">
<?php
// 記事全文を表示する場合
the_content();
// 抜粋を表示する場合は the_excerpt(); を利用
?>
</div>
</article>
<?php endwhile; ?>
<?php else : ?>
<p>投稿が見つかりませんでした。</p>
<?php endif; ?>
ポイント:
- WordPressループ
if ( have_posts() )とwhile ( have_posts() ) : the_post();を使って、投稿がある場合に記事ごとにループ処理を行います。 - テンプレートタグ
the_title()：記事タイトルを表示the_permalink()：記事の個別ページへのURLを出力the_content()またはthe_excerpt()：記事本文または抜粋を表示 - HTML5のセマンティックタグ
<article>, <header>, <div> などを使って、記事を論理的に区分することでSEOやアクセシビリティの向上が期待できます。
4. プラグインを活用した方法
より手軽にカスタマイズした投稿一覧を表示したい場合、以下のようなプラグインを利用する方法もあります。
- Elementor などのページビルダー：ドラッグ＆ドロップで投稿一覧のレイアウトをデザインできる。
- WP Show Posts：ショートコードを利用して、投稿一覧を任意の固定ページに挿入可能。
まとめ
- シンプルに最新投稿を表示する場合
管理画面の設定 > 表示設定で「最新の投稿」を選択する方法が最も簡単です。 - 固定ページを利用してカスタムトップページを作成する場合
固定ページと投稿ページを分けて設定し、必要に応じて「最新の投稿」ブロックなどを利用します。 - テーマテンプレートをカスタマイズする場合
PHPのWordPressループを用いて、柔軟なレイアウトで投稿一覧を表示します。
ご自身のサイト運営スタイルやカスタマイズの必要性に応じて、最適な方法を選んでください。もし具体的なカスタマイズやトラブルシューティングについてさらに知りたい場合は、詳細を教えていただければ追加のアドバイスも可能です。
コメント