デイトラでプログラミング始めました

デイトラweb制作コース上級　WordPress編　index.php を作る

SHARE

この記事では、デイトラのWEB制作コースを受講した現在の状況と、その間にどのような勉強をしてきたかを詳しくまとめています。

私はプログラミング未経験で、デイトラを始める前はプログラミングに関する知識は全くありませんでした。このコースを受講することで、本当にプログラミングができるようになるのかを自分自身で検証し、その過程を発信しています。

読んで欲しい読者
  • 未経験でもできるの？と疑問の人
  • 他の人がどんな風に勉強しているのか知りたい人
  • デイトラに興味がある人

デイトラのWEB制作コースを通じて、未経験からどのようにしてプログラミングができるようになったのか、その具体的な道のりを詳細にお伝えします。

現在デイトラWeb制作コースで月に５万円稼ぐためにプログラミングを勉強中です。

この記事を書いたのはこんな人
  • IT業界未経験でプログラミング初めてみた
  • プログラミングスクールに入って稼げるか試してみた
  • ブラック企業の社畜奴隷

目次 非表示

WordPressテーマを作成する際、記事一覧を表示する機能とページネーション（ページ送り）を実装することは重要なポイントです。この記事では、index.phpファイルで記事の一覧を表示する方法と、ページネーションを実装する手順を紹介します。

記事を取得するためのループ処理

WordPressでは、記事を表示するためにループ処理（The Loop）を使用します。ループ処理を使うことで、データベースから取得した記事を順に出力することができます。

The Loop（ループ処理）

ループ処理では、have_posts() と the_post() 関数を使用します。

  • have_posts(): ループ内で次の記事が存在するかをチェックする関数。次の記事が存在する場合は true を返します。
  • the_post(): 現在の投稿データをセットアップし、グローバル変数 $post を更新する関数。

以下は、index.phpファイルでメインクエリを使用して記事一覧を表示する例です。

<!-- index.php の例 -->
<?php get_header(); ?>

<div id="content">
    <?php if (have_posts()) : ?>
        <?php while (have_posts()) : the_post(); ?>
            <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
                <h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
                <div class="entry">
                    <?php the_excerpt(); ?>
                </div>
            </article>
        <?php endwhile; ?>
    <?php else : ?>
        <p>記事が見つかりませんでした。</p>
    <?php endif; ?>
</div>

<?php get_sidebar(); ?>
<?php get_footer(); ?>

ページネーションの実装

記事一覧が複数ページにわたる場合、ページネーション（ページ送り）を実装することで、ユーザーが次のページへ移動できるようにします。WordPressでは、paginate_links() 関数や the_posts_pagination() 関数を使用してページネーションを実装できます。

paginate_links() を使用したページネーション

<!-- index.php のページネーション例 -->
<?php get_header(); ?>

<div id="content">
    <?php if (have_posts()) : ?>
        <?php while (have_posts()) : the_post(); ?>
            <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
                <h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
                <div class="entry">
                    <?php the_excerpt(); ?>
                </div>
            </article>
        <?php endwhile; ?>
        
        <div class="pagination">
            <?php
            echo paginate_links(array(
                'total' => $wp_query->max_num_pages,
                'prev_text' => __('« Previous'),
                'next_text' => __('Next »'),
            ));
            ?>
        </div>
    <?php else : ?>
        <p>記事が見つかりませんでした。</p>
    <?php endif; ?>
</div>

<?php get_sidebar(); ?>
<?php get_footer(); ?>

the_posts_pagination() を使用したページネーション

<!-- index.php のページネーション例 -->
<?php get_header(); ?>

<div id="content">
    <?php if (have_posts()) : ?>
        <?php while (have_posts()) : the_post(); ?>
            <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
                <h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
                <div class="entry">
                    <?php the_excerpt(); ?>
                </div>
            </article>
        <?php endwhile; ?>
        
        <div class="pagination">
            <?php
            the_posts_pagination(array(
                'mid_size' => 2,
                'prev_text' => __('« Previous'),
                'next_text' => __('Next »'),
            ));
            ?>
        </div>
    <?php else : ?>
        <p>記事が見つかりませんでした。</p>
    <?php endif; ?>
</div>

<?php get_sidebar(); ?>
<?php get_footer(); ?>

WordPressテーマ開発において、記事一覧の表示とページネーションの実装は非常に重要な部分です。メインクエリを使用して記事を取得し、ループ処理で一覧を表示します。さらに、ページネーションを追加することで、ユーザーが複数ページにわたる記事を簡単に閲覧できるようになります。

前の記事

デイトラweb制作コース上級編の概要

次の記事

デイトラweb制作コース上級　archive.phpを作成