みなさん、こんにちは!
タカハシ(@ntakahashi0505)です。
WordPressのショートコードを使って、数件の新着記事をアイキャッチ画像つきで表示する機能の実装を目指して、WordPressの仕組みそしてPHPプログラミングについて研究をしています。
前回はこちらの記事。
WordPressで引数を指定したショートコードの作り方についてお伝えしました。
さて、数件の新着記事のリストをショートコードで表示するということは、何らかの方法で数件の投稿されている記事のタイトルを取り出して、その一つ一つについて表示するという処理になりますので、いわゆるループ(繰り返し)の処理が必要になります。
PHPではいくつか繰り返しの構文がありますが、今回は配列内の要素ひとつひとつについて繰り返し処理を行うforeach文について使用をしてみましょう。
ということで、今回の記事ではWordPressのショートコードでforeach文の繰り返しを使って複数のテキストを表示する方法についてお伝えします。
ショートコードの位置で配列内のテキストを一行ずつ表示したい
まずこんな配列を用意します。
$arr = array('じゃがいも','ニンジン','玉ねぎ','ブロッコリー');
この配列内のテキストを、WordPressの投稿内に一行ずつ順番に表示する方法を考えてみます。
つまり、ショートコードを記載した位置に
というHTMLを出力できればOKということになります。
PHPでのforeach文の使い方
配列内の全ての要素について繰り返しをしたい場合、PHPではforeach文を使います。
書き方としては
//処理
endforeach;
とします。
繰り返しの度に、配列の中の要素が順番に「配列値の変数」に格納されます。
配列内のテキストを表示するショートコード
では配列内のテキストを一行ずつ表示するショートコードを作ってみましょう。
こちらのPHPプログラムになります。
//配列内のテキストを出力するprint_text
function print_text($atts){
$arr = array('じゃがいも','ニンジン','玉ねぎ','ブロッコリー');
$retHTML='';
foreach($arr as $text):
$retHTML.=$text."
";
endforeach;
return $retHTML;
}
add_shortcode('text','print_text');
出力するHTML文を格納する変数を$retHTMLとします。
5~7行目のforeach文で、配列$arr内の要素が繰り返しのたびに順番に$textに格納されます。
foreach文の中の処理である6行目ですが、ここは
$retHTML=$retHTML.$text."
";
と同じ意味です。PHPではピリオドは文字列の結合ですから、文字列$retHTMLに、$textの値と<br />を連結するという処理になります。
ですから一回目の繰り返しでは
二回目の繰り返しでは
…といったように文字列が連結されていきます。
11行目add_shortcodeで[[text]]というショートコードで、関数print_text()を呼び出せるようにしています。
実行結果
これをfunction.phpに追記して更新します。任意のページでショートコード[[text]]を記載してプレビューをしますと、
と、配列内の値が一行ずつ出力されました。
まとめ
WordPressのショートコードでforeach文の繰り返しを使って配列内のテキストを表示する方法についてお伝えしました。
例えば、配列$arrとして投稿記事の配列、そして出力するHTMLに連結する文字列にその記事タイトルを使っていけば、WordPressショートコードで記事タイトルのリストを表示することができそうですよね。
ということで、次回は記事のタイトルを取得する方法についてお伝えしていきたいと思います。
どうぞお楽しみに!
連載目次:WordPressのショートコードで新着記事を表示する
初心者でもWordPressショートコードを自作することを目標にして、数件の新着記事をアイキャッチ画像つきで表示する機能を題材として連載形式でショートコードの作り方をお伝えしていきます。- WordPressショートコードとは何か、自作する際に注意すべき3つの事
- WordPressで最も簡単なショートコードの作り方を初心者向けにとっても丁寧に説明します
- WordPressで引数ありのショートコードを作成する方法をとっても丁寧に説明します
- WordPressのショートコードでforeach文で配列内のテキストを全て表示する方法
- WordPressショートコードで複数の記事タイトルを表示する方法
- WordPressショートコードで記事のパーマリンクと投稿日を取得する方法
- WordPressのショートコードで記事の抜粋・リンクつきの投稿の作成者も表示する
- WordPressのショートコードでアイキャッチ画像を表示する方法