今回はWordPressのオハコである、投稿機能を中心に、ループについて説明していきます。
- メインループを使用して投稿を表示する方法
案件が取れなくて悩んでいるあなたへ
プログラミング案件獲得のために必要なスキルは、単に技術力だけではありません。営業力、コミュニケーション力、人脈などの幅広いスキルや要素が求められてきます。
営業からライティング、SEOまで学べるフリーランス特化型プログラミングスクールZeroPlusで、フリーランスエンジニアに必要なすべてを手に入れませんか?
- またゼロからやり直さないといけないの?
- 本当にフリーランスになれるの?
といった不安にも、超フレンドリーな相談員が親切に相談にのります。スクール以外のご質問もOK!
\お申し込みは30秒で終わります。/
新しい一歩を、今踏み出してみませんか?
投稿を表示する仕組み
投稿機能とは
まずは、投稿機能を考えていきます。
投稿機能は、次のように、管理画面から記事やお知らせを作成することができます。
管理画面から項目を入力する。
サイトに反映される。
また、記事ページも自動で作られる。
投稿機能で行いたいこととしては、
- 管理画面から入力された内容が反映される
- 投稿の数だけ、同じスタイルのついた要素を繰り返す
この2つです。
例えば、新しく投稿を行うと、タイトルや本文などのスタイルが同じ状態のものが、入力した中身を変えて繰り返されます。
この、「スタイルが同じ状態のものが、入力した中身を変えて繰り返される」仕様を「ループ」という処理によって行います。
メインループとサブループの違い
今出てきたループですが、「メインループ」と「サブループ」という2種類に分けられます。
メインループ
メインループは、投稿機能を一番標準的な形で実行するループとなります。
こちらは、一つのページにつき使用できるメインループは一度で、投稿の細かい挙動を管理画面から設定 or できないものとなっています。
例えば、メインループで1ページに表示させる投稿の数などを管理画面で設定することができます。
サブループ
対してサブループは、それ以外のループです。
こちらは、一つのページの中で何度でも使用することが可能です。
メインループとの明確な差として、投稿の数や並べる順番を指定したり、標準の投稿以外の投稿(カスタム投稿と言います)を使用する際に使われます。
メインループとサブループの厳密な違い
イメージとしては、上記の内容をつかんでいただければ問題ないです。
こちらはあくまで補足ですが、処理の上でのメインループとサブループも解説します。
その違いに、クエリと言うものが大きく関わっています。
ワードプレスにおけるクエリとは、「データベースに投稿データ取得の要求を行うこと」です。
データベースについては、こちらで軽く触れていますが、管理画面から入力した内容を置いておく引き出しだと思ってください。投稿で入力した内容も、データベースに保管されるのですが、表示する際に、「この投稿の情報をちょうだい」と言う感じで要求が実行されます。
このクエリが、「メインクエリ」と「サブクエリ」の二つに分けられます。
メインクエリの特徴として、
- メインクエリはワードプレス によって自動的に作成 / 発行される
- メインクエリは URL に基づいて作成される
- メインクエリはワードプレス起動直後に発行される
の3つが挙げられます。
逆に、このメインクエリ以外のクエリをサブクエリと呼びます。クエリに関してより詳しい内容は、次の記事を参考にしてください。
そして、メインクエリを使っているのがメインループ、サブクエリを使っているのがサブループと言うのが厳密な違いです。
繰り返しますが、クエリに関する説明は、理解するよりも、聞き馴染みを持ってもらうくらいの感覚で捉えていただければ問題ありません。
メインループを書く
メインループを作成するコードの説明をしていきます。
書き方と解説
メインループは次のような記述をしていきます。
<?php
if (have_posts()) : // 投稿があれば処理に入る
while (have_posts()) : // 投稿の数だけ繰り返す
the_post(); // 回数に応じた投稿の情報を取得
?>
<!-- ループさせる投稿の型 -->
<?php
endwhile;
else:
?>
<!-- 投稿がない時に表示させるもの -->
<?php endif; ?>
それぞれ詳しくみていきます。
前述したように、投稿で行いたい機能と照らし合わせてみましょう。
投稿機能で行いたいこと
- 管理画面から入力された内容が反映される
- 投稿の数だけ、同じスタイルのついた要素を繰り返す
if (have_posts()) :
まずは、if (have_posts()) :
で投稿があるかどうかを確認します。なければelse:
とendif;
の間の処理に進みます。投稿があれば、次の処理に進みます。
while (have_posts()) :
while (have_posts()) :
からendwhile;
を使って投稿を繰り返しています。while文は条件式にあるhave_posts()
は、投稿がある限り、true
を返します。
つまり、ここのwhile文で、「投稿機能で行いたいこと」の「投稿の数だけ、同じスタイルのついた要素を繰り返す」の処理を実行しています。
the_post();
さらに、the_post();
がとても重要で、回数に応じて、投稿のデータを取得しています。
例えば、一回目のループでは一つ目の記事のデータを、二回目のループでは二つ目の記事のデータを、と言うように、繰り返す中で自動的に表示する投稿の番号ごとにデータをセットし直してくれる関数です。
メインループは基本的にこの記述を使って投稿を表示させます。
ループ内で使用できる関数
ループでは次の関数を使用することができます。
the_permalink();
その投稿の記事本体のURLを表示します。次のように、href属性内に記述することが多いです。
<a href="<?php the_permalink(); ?>"></a>
the_post_thumbnail();
その投稿に設定された「アイキャッチ画像」を表示します。画像へのパスではなく、imgタグごと生成されます。
引数を設定することで、生成されるimgタグにclass属性などを付与することができます。
the_time();
その投稿の公開された時間を表示します。
引数を設定することで、表示される時間の形式を選択することができます。
the_title();
その投稿のタイトルの表示をします。
これらはthe_post();
でセットされたデータを使用しているので、これらの関数を使う場合は、the_post();
を書く必要があります。
ちなみに、このようなWordPress専用の関数をテンプレートタグと呼びます。
まとめ
今回はループとループの中で使えるテンプレートタグについて扱ってきました。
WordPressの醍醐味とも言える投稿機能ですが、記事を読むだけではしっくりこない部分もあると思うので、後の演習で触れていきましょう。