ショートコードは、追加機能を単に表示するためのWordpress用の記述です。
プラグインなどもショートコードが提供されているものは、ショートコードを使って好きな場所に表示することができます。
人気投稿を表示するプラグインのwp popular postもショートコードを使って表示することができます。
ショートコード書き方
ショートコードの基本のフォーマットは、カッコで囲んだ中に指定のショートコードを書きます。
※プラグインのショートコードがあるかは、調査が必要。
[ショートコード名]
ショートコードを書く場所
ショートコードは、テンプレートのPHPファイルに書かなくても利用できます。
主な利用場所として
・エディターの編集画面
Wordpress5.x前のエディターであれば、編集画面にショートコードを記述すれば、それが自動変換されて表示されます。
※ブロックエディターでは表示されません。
・ウィジェットのカスタムHTML
ウィジェットのカスタムHTMLの中にショートコードを書くと自動変換されて表示されます。
PHPファイルで書く場合
テンプレートのPHPファイルにもショートコードを記述することができます。
do_shotcodeを使って記述します。
<?php
echo do_shortcode('[short_code_name]');
?>
ショートコードを自作する場合
自分でプログラムを書いて、ショートコードに登録すると、自作ショートコードや機能を好きな場所に追加することができます。
add_shortcodeでのポイントは、returnで返されたものを表示するという部分です。
※function内でechoしても意味がありません。
function aiueo_function() {
return "aiueo";
}
add_shortcode('aiueo' ,'aiueo_function');
echo do_shortcode('[aiueo]');
//aiueoと表示されます。
wordpress popular postのショートコード
wordpress popular postのショートコードのサンプルです。
ショートコードにパラメータをもたせて、その値を読み込んでいます。
ショートコード内で、
・テキストは、ダブルコーテーションで囲む
・数字はそのまま
パラメータには、HTMLも含まれており、タグに対するclass指定する時のダブルコーテーションは、エスケープされて「"」となっています。
※長いので分かりやすいように、改行しています。
[wpp
range="custom"
time_quantity=3
time_unit="day"
stats_views=0
order_by="views"
stats_date=1
stats_date_format="Y年m月d日"
thumbnail_width=300
thumbnail_height=100
title_length=25
header="人気記事"
header_start="<h2 class="wpp_hdttl"><span>"
header_end="</span></h2>"
limit=12
post_html="<div class="wpp_pop"><div class="wpp_thumb">{thumb}</div><div class="wpp_metainfo"><span class="wpp_metainfocat">{category}</span><span class="wpp_metainfodate"> - {date}</span></div><div class="wpp_metattl"><h3 class="wpp_metattlh3"><a href="{url}">{text_title}</a></h3></div></div>"]