公開日:2020.06.18
更新日:
【WordPressテーマ作成】PHPの使い方をマスターしよう!(初心者向け)
この記事の目次(クリックで項目へジャンプします)
はじめまして!SFです。
SF映画は全くと言っていいほど見ませんが、SFと申します。
今回初めて記事を書きます!
では、早速本題に入りましょう。
HTMLとCSSで作った静的サイトをWordPressのテーマとして作成するときに
HTMLの一部記述をPHPに書き換える必要があります。
今回は、
「PHPとは何か」そして「どのように記述すれば良いのか」を
初心者の方向けにお話ししていこうと思います。
※尚、今回はWordPress用のPHPの書き方をお伝えしていきます。
HTMLやCSSは理解している前提で、「PHPってどんなもの?」くらいの知識の方に向けて書いていきますので、
WordPressのテーマ作成の手順やファイルの仕組みなど、
大枠を理解した上でお読みいただければ幸いです。
PHPとは?
HTMLの中に記述できる言語で、PHPを使うと動的なコンテンツを生成することが可能になります。
「動的なコンテンツ」がピンとこない方に簡単に説明すると、
【日付を表示したい時(2020年6月10日に生成した仮定)】
・HTMLの場合
<p>2020年6月10日</p>
HTMLだと、直接書いた日付がそのまま表示されます。
そのため、例えばお知らせの投稿など、投稿日を自動で表示させたい時に毎回HTMLの日付を記述を書き換えなくてはなりません。
・WordPress用のPHPに書き換えた場合
<p><?php echo get_the_date(); ?></p>
コード内の<? ~ ?>部分がPHPに書き換えた部分です。
PHPに書き換えることで、投稿日を自動で生成し、表示してくれます。
PHPの書き方
<?php
print 'Hello Word';
echo 'Hello Word';
?>
PHPは基本的にこの「<? ~ ?>」の囲みの中に処理を書いていきます。
上記で記述している、「echo」「print」とは、文字を出力する命令だと思ってください。
どんな時に書き換える?
上記でお話しした日付の他にも、様々な用途でPHPを活用することができます。
タイトル、お知らせ、商品説明、ブログなどの投稿部分など
活用方法は無限に存在します。
では、次から実際に使えるWordPressでのPHPの記述方法についてお話ししていきます!
条件分岐
条件によって処理を分けたい時に使用するのが「if文」です。
条件を満たす時と、満たさない時で分けて書きます。
書き方
<? php if (条件) : ?>
条件を満たす時の時の処理をここに記述
<?php else: ?>
条件に満たない時の処理をここに記述
<?php endif; ?> //endifはここで終了という意味
特定の条件以外では何もしないというときは「else」を省略しても書けます。
<? php if (条件) : ?>
条件を満たす時の時の処理をここに記述
<?php endif; ?>
複数の条件分岐の場合
3つ以上の条件分岐になる場合は、elseifを使います。
elseifは何度使ってもOKです。つまり4つ以上の条件分岐も可能です。
<? php if (is_single()) : ?>
記事ページで表示する処理をここに書く
<?php elseif (is_page()) : ?>
固定ページで表示する処理をここに書く
<?php else: ?>
上記のどちらにも当てはまらない時の処理をここに書く
<?php endif; ?>
「!」を条件の関数の前につけることで、「◯◯でない時」という意味に
<?php if (!is_single()) : ?>
記事ページ以外で表示するものをここに書く
<?php endif; ?>
上記の「is_single()」は条件分岐タグで、「個別投稿ページで」という意味です。
条件分岐タグは無数にあり、様々なページに置き換えて記述することができます。
よく使うものを下記にあげておきます。
is_home() //メインページ
is_page('ページID') //固定ページ
is_archive() //アーカイブページ
is_category() //カテゴリー別の記事一覧ページ
is_single('投稿ID'
) //個別投稿ページ(特定の記事ページ)
is_singular() //記事ページもしくは固定ページ
複数のページで処理したい時は、配列(array)を使います。
is_single(array('投稿ID','投稿ID'))
while文
while文は、ループ処理を行うためのPHP構文で、
条件を満たす時だけ処理の実行を繰り返すという文法です。
WordPressのデータから取り出した投稿・固定ページを1件ずつ表示させる時などに使います。
表示させる記事の件数をそれぞれの記事一覧ページで異なる設定をしたい場合や、特定のカテゴリーの記事だけを表示させたい場合にも活用します。
書き方
<?php
if(have_posts()): //記事があるかを確認する
while(have_posts()):the_post(); //記事があれば表示させループ処理を行う
<h1><?php the_title(); ?></h1> //タイトルを出力
<div><?php the_content(); ?></div> //divの中に投稿の本文を出力
endwhile;
endif;
?>
上記の「have_posts()」は「記事があるかを確認する」という意味です。
使用例
上の例を活用して、実際に
「news」カテゴリーの記事を「5件」ループ表示させるように記述してみましょう!
$args = array(
'posts_per_page' => 5, //1ページに表示する最大の投稿数を指定
'category_name' => 'news', //ここでカテゴリーのスラッグを指定
);
$the_query = new WP_Query( $args );
<?php if ( $the_query->have_post()) : ?>
<h2>「news」カテゴリーの新着</h2>
<?php while ( $the_query->have_post()) : $the_query->the_post(); ?>
<article>
<h1><?php the_title(); ?></h1> //ここにタイトル(h1)
<?php the_content(); ?> //ここに投稿の中身を表示
</article>
<?php endwhile; wp_reset_postdata(); ?> //←これ重要!
<?php endif; ?>
・「new WP_Query」は独自でカスタマイズしたループを生成し出力するための記述。
・「$the_query」や「$args」の名前は好きに決めることができます。
・「endwhile; 」の後の「wp_reset_postdate();」ですが、かなり重要!
→これはnew WP_Queryを使ったクエリを実行した後で、メインクエリに戻すために必要です。これが無いと、new WP_Queryを使ったクエリの影響が続いてしまいます。
いかがでしたでしょうか?
HTMLとCSSで静的サイトの構築はできるけど、
WordPressのテーマ作成はしたことがない!PHPにどう書き換えていいか分からない!
という方に向けて記事を書いてみました。
今回書いたものの他にもPHPを使用する場面は無限にあります。
テーマをどんどんカスタマイズしていきながら、地道に学んで身に付けていきましょう!
少しでも参考にしてもらえると嬉しいです。