タイトル・URLをコピー
記事タイトルWordPressで必須のテンプレートタグ53選(全サンプルコード付)
記事URLhttps://min-web.com/template-tag/
記事タイトルWordPressで必須のテンプレートタグ53選(全サンプルコード付)
記事URLhttps://min-web.com/template-tag/
POINTこの記事をざっくり言うと
サイトに部分的なシステムを導入することができる
この記事を読めば実務に活かせるスキルが身につく
テーマ作成をする上で必須の知識が身につく
こんにちは!エンジニアの高沢です!
今回はWordPressでのサイト制作で必須のテンプレートタグについて説明していきたいと思います。
テンプレートタグはWordPressでサイトを制作する方にとってはとても便利な技術であり、テンプレートタグを使わなければWordPressのメリットを実感できないと言っても過言ではありません。それだけ重要な技術を今回は一つひとつわかりやすくご説明したいと思います。
テンプレートタグとは
テンプレートタグとは、一言で言うならばWordPressで定義されたPHPの関数です。WordPressはPHPのテンプレートで作られていますが、テンプレート上でテンプレートタグを使うことによってシステムを呼び出し便利な機能を実現してくれます。
例えば、ブログサイトがあったとして、新しく投稿された順に記事をリスト形式で自動で表示させたり、ブログ内にあるカテゴリーやタグの一覧をサイドバーに表示させたり、いろいろなことを自動化してくれるのがテンプレートタグです。
WordPressは様々な機能を実装するための多くのテンプレートタグが用意されており、数えたら膨大な数になります。現時点で存在する全てのテンプレートタグを紹介すると記事がとんでもないページ数になってしまうため、
今回は現役エンジニアである私が実際に業務で使用したものを厳選し、無駄を削ぎ落とした必要最低限なテンプレートタグをご紹介していきます。
この記事を読み終える頃にはテーマ作成をする為の下準備が整っていることでしょう。
テンプレートタグの種類
テンプレートタグの種類は大きく分けて5つあります。
- コンテンツ系 データベースにあるデータを表示させるための関数
- ループ系 WordPressループを通してデータベースにあるデータを表示させるための関数
- インクルード系 他のテンプレートを呼び出すための関数
- 条件分岐系 ページの種類を判別するための関数
- タグ出力系 JSやウィジェットを表示させるための関数
それではそれぞれを解説していきます。
上記のカテゴリーごとにまとめましたのでどうぞご確認ください。
カテゴリーの概要を読んでテンプレートタグごとに大体どんな場所でどんな場面で使われるのかをイメージできるかと思います。
パラメータとは
また、テンプレートタグを使うには事前に知っておかなければならないことがあります。
それはパラメータの存在です。例えば、bloginfo()関数の「()」の中にシングルクウォート「’」でパラメータという様々な機能を呼び出すための文字列を挟む必要があります。
例えばこんな風にです→bloginfo(‘name’);
パラメータは関数に各種機能を呼び出す際に必要になる場合がしばしばあるので、これから説明するパラメータの数々をしっかり把握しておきましょう。
コンテンツ系
bloginfo();
項目 |
内容 |
説明 |
WordPressの管理画面で設定したサイト情報を表示させる関数です。
例えば、管理画面から「設定」→「一般」で入力されている「サイトのタイトル」をサイト上で表示させたり「キャッチフレーズ」を表示させたり、管理画面で入力した情報を簡単に表示させることができます。 |
パラメータ |
bloginfo($show);
$show 情報のキーワード 初期値:name
name:管理画面「設定」→「一般」の「サイトのタイトル」を表示
description:管理画面「設定」→「一般」の「キャッチフレーズ」を表示
url:管理画面「設定」→「一般」の「サイトのアドレス(URL)」を表示
admin_email:管理画面「設定」→「一般」の「管理者メールアドレス」を表示
charset:HTMLにUTF-8を設定します |
使い方 |
主にヘッダーで使います。
ヘッダー部分にサイトのタイトルを自動で表示させるとき→bloginfo(‘name’);
charsetをHTMLに効率的に自動で設定するとき→bloginfo(‘charset’);
など
|
|
/* ブログのタイトルを表示する場合 */ <h1><?php bloginfo(‘name’); ?></h1> /* ブログのキャッチフレーズを表示する場合 */ <p><?php bloginfo(‘description’); ?></p> /* HTMLの<html>に対してcharsetを設定する場合 */ <html <?php bloginfo(‘charset’); ?>> |
language_attributes();
項目 |
内容 |
説明 |
<html>タグにlang属性を自動で表示する関数です。
パラメータを含めずそのまま記述して使えます。日本語対応である「lang=”ja”」が自動で出力されます。
|
使い方 |
主にヘッダーで使います。
HTMLに効率的にlang属性を自動で設定するときに便利です。
|
|
/* <html>タグにlang属性を設定する場合 */ <html <?php language_attributes();?>> |
get_template_directory_uri();
項目 |
内容 |
説明 |
有効化しているテーマのディレクトリのURLを取得します。
ディレクトリとは、get_header.phpやget_footer.php、index.phpファイルなどが沢山格納されているファイルのディレクトリ階層のことを指します。
厳密には、親テーマのディレクトリのURLを取得します。これとは別に後述する子テーマのディレクトリのURLを取得するget_stylesheet_directory_uri();を使い分けてください。
|
使い方 |
主にCSSファイル読み込みや、サイト上に画像を表示させるときに使います。
筆者としてはかなり汎用性があり多用するため抑えるべき関数だと思います。
親テーマで使われるものであるため、子テーマでURLを読み込むときはget_stylesheet_directory_uri()関数を使いましょう。
|
|
/* ヘッダーの<link>タグでCSSを読み込む場合 */ <link rel=”stylesheet” href=”<?php echo get_template_directory_uri(); ?>/css/sample.css”> /* サイト上で画像ファイルを読み込む場合 */ <img src=”<?php echo get_template_directory_uri(); ?>/image/sample.png”> |
get_stylesheet_directory_uri();
項目 |
内容 |
説明 |
有効化しているテーマ・子テーマのディレクトリのURLを取得します。
|
使い方 |
主に子テーマにあるCSSファイル読み込みや、サイト上に子テーマ内にある画像を表示させるときに使います。
子テーマでサイトを構築する際に必要になる関数なので、抑えましょう。
|
|
/* ヘッダーで<link>タグで子テーマ内に設置されたCSSを読み込む場合 */ <link rel=”stylesheet” href=”<?php echo get_stylesheet_directory_uri(); ?>/css/sample.css”> /* サイト上で子テーマ内に設置された画像ファイルを読み込む場合 */ <img src=”<?php echo get_stylesheet_directory_uri(); ?>/image/sample.png”> |
get_the_category();
項目 |
内容 |
説明 |
カテゴリーのオブジェクトの配列を返します。取得するものは現在の各投稿ページごとに保持するカテゴリーのオブジェクトを指します。
パラメータとして投稿IDをいれることでループ外でも使えます。
|
パラメータ |
get_the_category($id);
$id 投稿ID 初期値:$post->ID(現在の投稿のID)
term_id (整数) カテゴリー ID
name (文字列) カテゴリー名
slug (文字列) カテゴリーのスラッグ
description (文字列) カテゴリーの説明
count (整数) カテゴリーに登録されている投稿の数
cat_ID (整数) カテゴリー ID (term_id にも同じ値が入る)
category_count (整数) カテゴリーに登録されている投稿の数(count にも同じ値が入る)category_description (文字列) カテゴリーの説明(description にも同じ値が入る)cat_name (文字列) カテゴリー名(name にも同じ値が入る)
category_nicename (文字列) カテゴリースラッグ名 – カテゴリー名から生成されたスラッグ(slug にも同じ値が入る)
|
使い方 |
新着順の記事一覧ごとのタイトル付近や記事ページに記事の付加情報として記事ごとに該当するカテゴリーを表示させるときに主に使います。
|
|
/* 現在の投稿ページのカテゴリを表示し、カテゴリー名にカテゴリーアーカイブページへのリンクを設定する場合 */ <?php $categories = get_the_category(); foreach($categories as $category): echo '<a href="' . get_category_link($category->term_id) . '">' . $category->name . '</a>'; endforeach; ?> |
get_category_link();
項目 |
内容 |
説明 |
指定したカテゴリーIDのカテゴリーアーカイブへのリンクをPHPの値として返します。
|
パラメータ |
get_category_link($category_id);
$category_id リンクを返すカテゴリーID 初期値:なし
|
戻り値 |
カテゴリーアーカイブページへのリンクのURL
|
使い方 |
※get_the_category();のサンプルコードを参照。
また、自作でパンくずリストを作成する時や、記事ごとに出力させたカテゴリーにカテゴリーアーカイブへのリンクを設定する時などに使います。get_the_category();よく使うので、必ず抑えましょう。
|
get_the_tags();
項目 |
内容 |
説明 |
投稿ページに設定されているタグをそれぞれ一つのオブジェクトにし、そのオブジェクトの配列を返します。
|
パラメータ |
get_the_tags($id);
$id 投稿ID 初期値:現在の投稿のID
term_id タグのID
name タグ名
slug タグのスラッグ
description タグの説明
count このタグの総使用回数
|
使い方 |
新着順の記事一覧ごとのタイトル付近や記事ページに記事情報として記事ごとに該当するタグを表示させるときに使います。
|
|
/* 現在の投稿ページのタグを表示し、タグ名にタグアーカイブページへのリンクを設定する場合 */ <?php $tags = get_the_tags(); foreach($tags as $tag): echo '<a href="' . get_tag_link($category->term_id) . '">' . $tag->name . '</a>'; endforeach; ?> |
get_tag_link();
項目 |
内容 |
説明 |
指定したタグIDのタグアーカイブページへのリンクをPHPの値として返します。
|
パラメータ |
get_tag_link($tag_id);
$tag_id リンクを返すタグのID 初期値:なし
|
戻り値 |
タグアーカイブページへのリンクのURL
|
使い方 |
※get_the_tags();のサンプルコードを参照。
出力したタグに対してタグアーカイブへのリンクを設定する時などに使います。
|
get_the_terms();
項目 |
内容 |
説明 |
投稿ページに割り当てられたタクソノミーのタームを取得します。
get_the_category()、get_the_tags()で扱えなかったカスタムタクソノミーも指定できます。
|
パラメータ |
get_the_terms($id,$taxonomy);
$id 投稿ID 初期値:0
$taxonomy タームを取得するタクソノミー名。例)category、post_tag、taxonomyのスラッグ
|
戻り値 |
タームのオブジェクトの配列を返します。指定されたタクソノミーにおいて、投稿ページにタームが割り当てられていなければ、論理値のfalseを返します。
|
使い方 |
現在の投稿ページのカスタムタクソノミーを表示させたりする場合に使います。
get_the_category()、get_the_tags()と違い、get_the_terms()はカスタムタクソノミーも指定できるため大変便利なテンプレートタグです。
|
|
/* カスタムタクソノミー(sample_taxonomy)を設定していて、そのカスタムタクソノミーのアーカイブリンクがついたタクソノミーを表示する場合に使います。 */ <?php $terms = get_the_terms($post->ID,’sample_taxonomy’); foreach($terms as $term): echo ‘<a href=”’ . get_term_link($term) . ‘“>’ . $term->name . ‘</a>’; endforeach; ?> |
get_term_link();
項目 |
内容 |
説明 |
タクソノミーのアーカイブページへのパーマリンクを返します。
|
パラメータ |
get_term_link($term,$taxonomy);
$term リンクを取得するタームのオブジェクト、ID、スラッグ 初期値:なし
$taxonomy タクソノミーのスラッグ。$termがオブジェクトの時はオプション。
|
戻り値 |
タームアーカイブページのURLを返します。タームが存在せずエラーであればWP_Errorオブジェクトを返します。
|
使い方 |
get_the_terms()のサンプルコードを参照。
|
項目 |
内容 |
説明 |
現投稿ページの前と次のページへリンクするページ番号と文字をセットを出力します。
主にindex.phpやアーカイブページであるtag.php、category.phpなどで使われます。
single.phpやpage.phpでは使えません。
|
パラメータ |
the_posts_pagination($args);
$args 配列 初期値:下記参照
mid_size 現在のページの左右にそれぞれ表示するページ番号の数。初期値:1
prev_text 投稿の前のセットへのリンクテキスト。初期値:「Previous」
next_text 投稿の次のセットへのリンクテキスト。初期値:「Next」
screen_reader_text スクリーンリーダー用テキスト。初期値:「Posts navigation」
|
使い方 |
カテゴリーアーカイブページやタグアーカイブページなどのページネーションを出力させる時に使います。
|
|
/* シンプルなUIのページネーションを作る場合 */ $args = array( ‘mid_size’ => 1, ‘prev_text’ => ‘<<前へ’, ‘next_text’ => ‘次へ>>’, ‘screen_reader_text’ => ‘ ‘, ); the_posts_pagination($args); |
previous_post_link();
項目 |
内容 |
説明 |
現在の投稿ページから見て日付順で一つ前の投稿ページへのリンクを表示します。
|
パラメータ |
previous_post_link($format,$link);
$format リンクした文字の前後に追加する文字を設定できます。初期値:’« %link’
パラメータ内に「%link」と文字列内にいれると「$link」に置き換えられます。
例)「’前のページへ %link’」とすると→「前のページへ
|
使い方 |
投稿ページで前のページ、次のページの導線であるページネーションを設置したい時に使います。
|
|
/* 前後の投稿タイトルを表示させるシンプルな導線のページネーション 次の投稿ページへのリンクは後述します */ <div class=”pagination”> <?php if(get_previous_post()): ?> <div class=”pagination__left”><?php previous_post_link(); ?></div> <?php endif; ?> <?php if(get_next_post()): ?> <div class=”pagination__right”><?php next_post_link(); ?></div> <?php endif; ?> </div> |
next_post_link();
項目 |
内容 |
説明 |
現在の投稿ページから見て日付順で一つ次の投稿ページへのリンクを表示します。
|
パラメータ |
next_post_link($format,$link);
$format リンクした文字の前後に追加する文字を設定できます。初期値:’%link »’
パラメータ内に「%link」と文字列内にいれると「$link」に置き換えられます。
例)「’%link’ 次のページへ」とすると→「<... 次のページへ」となります。HTMLタグをいれるとより柔軟にスタイルをつけられます。
|
使い方 |
※previous_post_link();のサンプルコード参照。
投稿ページで前のページ、次のページの導線であるページネーションを設置したい時に使います。
|
get_previous_post();
項目 |
内容 |
説明 |
現在の投稿ページの前後の投稿ページを取得します。
|
使い方 |
主に条件分岐をする時に使います。
previous_post_link()と合わせて使います。
※previous_post_link();のサンプルコード参照。
|
get_next_post();
項目 |
内容 |
説明 |
現在の投稿ページの前後の投稿ページを取得します。
|
使い方 |
主に条件分岐をする時に使います。
next_post_link()と合わせて使います。
※previous_post_link();のサンプルコード参照。
|
wp_tag_cloud();
項目 |
内容 |
説明 |
タグの一覧を表示します。
|
パラメータ |
wp_tag_cloud($args);
smallest 一番小さいタグを8ptで表示(件数が少ないタグ)
largest 一番大きいタグを22ptで表示(件数が多いタグ)
unit smallestとlargestのフォントサイズの単位として’pt’を使用
|
使い方 |
サイト上に割り当てられているタグの一覧を表示させる場合に使います。
|
|
/* サイト上に設定されている全てのタグの一覧を表示 */ <?php $args = array( ‘smallest’ => 10, ‘largest’ => 20, ‘unit’ => ‘px’, ); wp_tag_cloud($args); ?> |
項目 |
内容 |
説明 |
管理画面にウィジェットを設定している場合にそのウィジェットを表示します。
複数のウィジェットを設定している場合は、その表示するウィジェットの番号または名前をテンプレートタグに知らせる必要があります。
|
パラメータ |
dynamic_sidebar($number);
$number サイドバー(ウィジェット)の名前もしくはID 初期値:1
|
使い方 |
ウィジェットを表示したい箇所に記述すればその場でウィジェットを出力してくれます。
「…mic_sidebar()」のようにサイドバーと言う名前がついていますが、これは昔からの名残で使われており、あまり気にする必要はありません。
決してサイドバーのみに使用するものではないので、紛らわしいですがご注意ください。
|
項目 |
内容 |
説明 |
あるサイドバーが有効化されているかどうかを調べます。
ウィジェットが含まれたサイドバーは論理値のTRUEを、ウィジェットが含まれないサイドバーはFALSEを返します。
|
パラメータ |
is_active_sidebar($index);
$index サイドバー名、サイドバーID。 初期値:なし
|
戻り値 |
サイドバーが有効化されている場合はtrue、そうでない場合はfalse
|
使い方 |
主にdynamic_sidebar()と合わせて使います。
下記記述例はウィジェットが設定されている場合にはウィジェットを表示し、されていない場合には表示しないといった柔軟なウィジェット設定ができるコードです。
|
項目 |
内容 |
説明 |
サイドバーを一つ定義してIDを返します。
動作させるにはテーマ内のfunctions.phpに記述しなければなりません。
このテンプレートタグの記述がなければウィジェットを表示させることはできません。
|
パラメータ |
register_sidebar($args);
$args ’name’と’id’の値からサイドバーを作成。初期値:なし
name サイドバーの名前
id サイドバーのID
description サイドバーの説明テキスト
|
使い方 |
ウィジェットのサイドバーをWordPressに登録するために、functions.phpに記述する関数。
サイドバーの名前やIDを設定して登録します。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23
|
/* ★上記4つのテンプレートタグを使った例 ウィジェットを設定してサイト上に表示させるまでの流れ 1、最初にfunctions.phpに下記コードを挿入します。 <?php add_theme_support(‘widget’); ?> 2、続けてfunctions.phpに下記コードを挿入します。 */ <?php register_sidebar( ‘name’ => ‘サンプル1’, ‘id’ => ‘sample-1’, ‘description’ => ‘サンプル1のウィジェットです。’, ); ?> /* 3、sidebar.phpなどテンプレートファイルの表示させたい箇所に下記コードを挿入します。 */ <?php if(is_active_sidebar(‘sample-1’)): ?> <?php dynamic_sidebar(‘sample-1’); ?> <?php endif; ?> |
ループ系
have_posts();
項目 |
内容 |
説明 |
現在のページのWordPressループにおいてループできるデータがあるかどうかをチェックします。
|
パラメータ |
パラメータは指定できません。
|
戻り値 |
成功したら論理値のtrue、失敗したらfalseが返されます。
|
使い方 |
WordPressループで条件分岐させる際に使います。かなり使う頻度は多いので、抑えておきましょう。
|
the_post();
項目 |
内容 |
説明 |
WordPressループの処理で次のループへ進めます。次のループデータを取得して、それを現在の投稿としてセットアップします。※「現在の投稿」はループの中でthe_title()やthe_content()などが対象とする投稿です。
|
使い方 |
WordPressループを行う際に、次のループへ進めるために使います。
このテンプレートタグの記述がなければ、ループがうまくいきません。
have_posts()と同時に使うので、必ずセットで抑えておきましょう。
|
wp_reset_postdata();
項目 |
内容 |
説明 |
new WP_Queryを使ってWordPressのサブループを実行した後に、メインクエリの$postグローバル変数を復元するために使用します。つまり、$postがメインクエリの現在の投稿になります。
・メインループは、URLによるリクエストに基づいたクエリが、テンプレートが読み込まれる前に実行されます。
・サブループは、テーマのテンプレートやプラグインのファイルの中で実行されるクエリ(new WP_Queryを使う)です。
|
使い方 |
主にWordPressのサブループの時に使います。
サブループで使う理由は、もしwp_reset_postdata()を記述しなければ、ループで出力された最後のデータが、現在のページの表示やデータの扱いに反映されてしまい影響が出てしまうため、ループをリセットしてそれを改善する役割を果たします。
指定する場所は、サブループの下に記述します。
|
|
… else: <p>現在投稿データはございません。</p> endif; wp_reset_postdata(); ?> |
the_title();
項目 |
内容 |
説明 |
現在の投稿ページのタイトルを表示、または返します。必ずループの中で使用します。
|
パラメータ |
the_title($before,$after,$echo);
$before タイトルの前に挿入するテキスト 初期値:なし
$after タイトルの後に挿入するテキスト 初期値:なし
$echo タイトルを表示(TRUE)または返す(FALSE) 初期値:TRUE
|
使い方 |
WordPressループの中で使用します。
この記述だけで簡単に記事のタイトルを表示してくれるので大変便利なテンプレートタグです。
|
|
/* ループの中↓ */ <h1><?php the_title(); ?></h1> |
get_the_title();
項目 |
内容 |
説明 |
投稿IDを元にして投稿のタイトルを取得します。
ループの中でも外でも使えます。ループの外で使う場合は投稿IDが必要になります。
|
パラメータ |
get_the_title($id);
$id 投稿のID、またはタイトルを取得する投稿ページを特定するオブジェクト。初期値:null
|
戻り値 |
投稿のタイトル。
|
使い方 |
get_the_title()は投稿ページのタイトルを取得するだけなので、表示させたい時は「echo」を使いましょう。
|
|
/* ループ外でタイトル取得しサイト上に表示させる */ <h1><?php echo get_the_title(); ?></h1> |
the_content();
項目 |
内容 |
説明 |
現在の投稿ページの本文を出力します。このテンプレートタグはWordPressループの中で使わなければなりません。
|
使い方 |
single.phpなど個別の投稿記事ページで管理画面で入力した本文を表示させるために使います。使い方は、テンプレートファイル(single.phpなど)の表示させたい箇所でWordPressループさせて表示させます。
|
|
/* 管理画面で入力した投稿本文を表示するにはWordPressループさせて表示する */ <?php if(have_posts()): while(have_posts()):the_post(); the_content(); endwhile; endif; ?> |
the_excerpt();
項目 |
内容 |
説明 |
現在の投稿ページの本文の抜粋を、文末に[…]をつけて表示します。
投稿の管理画面にて「抜粋」文入力欄に記入してあればそれを、「抜粋」文入力欄に記入されていなければ本文の最初の110文字までを表示します。
|
使い方 |
使い所としては例えばループで出した記事のリストで抜粋文を表示させる場合などに利用します。
|
|
/* 管理画面で入力した投稿本文の抜粋を表示するにはWordPressループさせて表示する */ <?php if(have_posts()): while(have_posts()):the_post(); the_excerpt(); endwhile; endif; ?> |
the_category();
項目 |
内容 |
説明 |
現在の投稿ページのカテゴリーが関連したアーカイブリンクが設定されたカテゴリーを表示します。
|
パラメータ |
the_category($separator,$parents,$post_id);
$separator カテゴリーへのリンクを区切る文字列や記号 初期値:空の文字列
$parents 記事が子カテゴリーに属する時の表示の仕方
・multiple 親と子カテゴリーへのリンクを別々に表示し、見た目は「親/子」になります。
・single 子カテゴリーへのリンクのみを表示しますが、見た目は「親/子」になります。
初期値:空の文字列
$post_id カテゴリーを取得する投稿のID。 初期値:false 現在の投稿ページのカテゴリー
|
使い方 |
主にループでリスト表示する時や、個別の投稿ページで該当するカテゴリーを表示させる場合に使います。自動で該当するカテゴリーのアーカイブリンクが設定されるので大変便利です。
|
|
/* WordPressループの中でカテゴリーを出力 */ <p>Category:<?php the_category(); ?></p> |
the_time();
項目 |
内容 |
説明 |
現在の投稿ページの公開した時刻を表示します。ループの中で使用する必要があります。
|
パラメータ |
the_time($id);
$id 時刻を表示するフォーマット。
指定がなければWordPressの設定画面で定義されている時間のフォーマットが出力されます。 初期値:なし
|
使い方 |
ループで記事リストごとに公開時刻を表示させる場合や、個別の投稿ページで公開時刻を表示させる場合に使用します。
|
|
/* WordPressループの中で公開日を出力 */ <span>公開日:<?php the_time(‘Y年n月j日’); ?><span> |
get_option();
項目 |
内容 |
説明 |
データベースにあるwp_optionsテーブルからパラメータで指定してWordPressに設定してあるオプションの値を取得します。
|
パラメータ |
大変数が多いので、よく使うものを一部抜粋します。
get_option($option,$default)
$option 取得するオプションの名前。(小文字のみ)
date_format 日付のフォーマット
admin_email ブログ管理者のメールアドレス
home WordPressアドレス(URL)
siteurl サイトアドレス(URL)
※いずれも一般設定で設定します
$default データベースにオプションが存在せず値が返されない場合のデフォルト値。初期値:false
|
戻り値 |
指定されたオプションの現在の値を返します。そのオプションが存在しなければfalseを返します。
|
使い方 |
テンプレートタグのthe_time()と組み合わせて、管理画面で設定した時刻フォーマット形式で公開時刻を出力する場合。
|
|
/* WordPressループの中で公開日を出力 */ <span><?php the_time(get_option(‘date_format’)); ?></span> |
the_tags();
項目 |
内容 |
説明 |
現在の投稿ページに付けられたタグを表示します。各タグは、それぞれのタグアーカイブページへリンクします。タグが付けられていない場合は、何も表示しません。必ずループの中で使います。
|
パラメータ |
the_tags($before,$sep,$after);
$before タグ一覧の前に表示する文字列。初期値:Tags:
$sep 各タグリンクの間に表示する文字列や記号。初期値:,(コンマ)
$aftrer 最後のタグに続けて表示する文字列。初期値:なし
|
使い方 |
ループで記事リストごとにタグを表示させる場合や、個別の投稿ページでタグを表示させる場合に使用します。
|
|
/* WordPressループの中でタグを出力 */ <span><?php the_tags(); ?></span> |
the_permalink();
項目 |
内容 |
説明 |
ループで処理されている投稿ページのパーマリンクのURLを表示します。主に各投稿ページのパーマリンクを表示する時に使用されます。またこのテンプレートタグはWordPressループの中で使用しなければなりません。
|
パラメータ |
the_permalink($post);
$post 投稿、固定ページのID、または投稿オブジェクト 初期値:ループ内で使用した場合、表示中の投稿のID。
|
使い方 |
主にWordPressループで記事リストを表示した時、そのリストごとに記事ページへのリンクを設定する時に使います。
|
|
/* WordPressループの中で投稿リストごとにリンクをつける */ <?php if(have_posts()): while(have_posts()):the_post(); ?> <a href=”<?php the_permalink(); ?>”> ... </a> <?php endwhile; endif; ?> |
the_post_thumbnail();
項目 |
内容 |
説明 |
投稿ページの投稿編集画面で設定されたアイキャッチ画像を表示します。ループ内で使います。
|
パラメータ |
the_post_thumbnail($size);
$size 画像サイズ。
・thumbnail、medium、large、full
・add_image_size()で定義したカスタムサイズのキーワード
・配列array(40,40)※単位はpx
|
使い方 |
WordPressループで記事リストを表示する際に、そのリストごとにアイキャッチ画像を表示させる場合に使います。また個別の投稿ページごとにトップのメインビジュアル画像としてもよく使われます。
よくhas_post_thumbnail()と組み合わせて使われるので、サンプルコードはhas_post_thumbnail()の解説でご紹介します。
|
|
/* WordPressループの中でアイキャッチ画像を出力 */ ... while(have_posts()):the_post(); if(has_post_thumbnail()): the_post_thumbnail(); else: <img src="<?php echo get_template_directory_uri(); ?>/image/noimage.png"> endif; endwhile; ... |
has_post_thumbnail();
項目 |
内容 |
説明 |
投稿ページにアイキャッチ画像が設定されているかどうかをチェックする関数です。
|
パラメータ |
has_post_thumbnail($post_id);
$post_id 投稿ID 初期値:null – 現在の投稿
|
戻り値 |
アイキャッチ画像が設定されていれば論理値のtrue、されてなければfalse
|
使い方 |
※the_post_thumbnail()のサンプルコードを参照。
the_post_thumbnail()と組み合わせて、アイキャッチ画像が設定されていればそれを表示、されていなければノーイメージ画像を表示するといった場合に使います。
|
インクルード系
項目 |
内容 |
説明 |
現在のテーマディレクトリにあるheader.phpテンプレートファイルを読み込みます。
|
パラメータ |
get_header($name);
$name header-{$name}.phpを読み込む 初期値:なし
|
使い方 |
主にヘッダーを一つのテンプレートとして分けて読み込む場合に使用します。
使い方の手順は、
1、テーマディレクトリの階層にheader.phpテンプレートファイルを作成する
2、header.phpにヘッダーとしてコーディングする。
3、index.phpやsingle.php、page.phpなどテンプレートファイルの読み込みたい場所(大体上の方)にget_header()を記述し、header.phpを読み込む
|
|
/* ヘッダーテンプレートを読み込む */ <?php get_header(); ?> <main> <div class="container"> <h1><?php the_title(); ?></h1> … |
項目 |
内容 |
説明 |
現在のテーマディレクトリにあるsidebar.phpテンプレートファイルを読み込みます。
|
パラメータ |
get_sidebar($name);
$name sidebar-{$name}.phpを読み込む 初期値:なし
|
使い方 |
主にサイドバーを一つのテンプレートとして分けて読み込む場合に使用します。
使い方の手順は、
1、テーマディレクトリの階層にsidebar.phpテンプレートファイルを作成する
2、sidebar.phpにサイドバーとしてコーディングする。
3、index.phpやsingle.php、page.phpなどテンプレートファイルの読み込みたい場所(大体右か左の方)にget_sidebar()を記述し、sidebar.phpを読み込む
|
|
/* サイドバーのテンプレートを読み込む */ ... </div> <?php get_sidebar(); ?> <?php get_footer(); ?> … |
項目 |
内容 |
説明 |
現在のテーマディレクトリにあるfooter.phpテンプレートファイルを読み込みます。
|
パラメータ |
get_footer($name);
$name footer-{$name}.phpを読み込む 初期値:なし
|
使い方 |
主にフッターを一つのテンプレートとして分けて読み込む場合に使用します。
使い方の手順は、
1、テーマディレクトリの階層にfooter.phpテンプレートファイルを作成する
2、footer.phpにフッターとしてコーディングする。
3、index.phpやsingle.php、page.phpなどテンプレートファイルの読み込みたい場所(大体下の方)にget_footer()を記述し、footer.phpを読み込む
|
|
/* フッターのテンプレートを読みこむ */ ... </div> <?php get_sidebar(); ?> <?php get_footer(); ?> |
get_search_form();
項目 |
内容 |
説明 |
現在のテーマディレクトリにあるsearchform.phpテンプレートファイルを読み込みます。
|
パラメータ |
get_footer($name);
$name footer-{$name}.phpを読み込む 初期値:なし
|
使い方 |
主に検索フォームを一つのテンプレートとして分けて読み込む場合に使用します。
使い方の手順は、
1、テーマディレクトリの階層にsearchform.phpテンプレートファイルを作成する
2、searchform.phpに検索フォームとしてコーディングする。
3、header.phpやsidebar.phpなどテンプレートファイルの読み込みたい場所(大体上の方)にget_search_form()を記述し、footer.phpを読み込む
|
|
/* 検索フォームのテンプレートを読み込む */ ... <h1><a href="<?php echo esc_url(home_url('/')); ?>"></a></h1> <?php get_search_form(); ?> ... |
get_template_part();
項目 |
内容 |
説明 |
header.php、footer.php、sidebar.phpなどを除いたテンプレートファイルを読み込みます。
|
パラメータ |
get_template_part($slug);
get_template_part($slug,$name);
$slug テンプレートスラッグの名前
$name 特定テンプレートの名前
|
使い方 |
使い方は様々ですが、筆者の場合は主にサイト内検索結果の記事を一覧として表示させる際に必要な部品を作る場合などに使います。
例えばsearch-list.phpというオリジナルのテンプレートを表示させる場合の手順は、
1、テーマディレクトリの階層にsearch-list.phpテンプレートファイルを作成する
2、search-list.phpにヘッダーとしてコーディングする。
3、search.phpなどテンプレートファイルの読み込みたい場所にget_template_part(‘search’,’list’)を記述し、search.phpを読み込む
|
|
/* 検索結果の一覧をループを利用して出力する場合の例 */ ... if(have_posts()): while(have_posts()):the_post(); get_template_part('search','list'); endwhile; endif; ... |
タグ出力系
wp_head();
項目 |
内容 |
説明 |
wp_headアクションをスタートさせます。
テーマテンプレートファイル内の</head>タグの直前で使う。
|
パラメータ |
get_template_part($slug);
get_template_part($slug,$name);
$slug テンプレートスラッグの名前
$name 特定テンプレートの名前
|
使い方 |
</head>タグの直前に記述します。
このテンプレートタグがなければhead内に必要な情報が出力されません。
|
|
/* ヘッダーのheadアクションの読み込み */ ... <link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/css/main.css"> <?php wp_head(); ?> </head> <body> ... |
項目 |
内容 |
説明 |
wp_footerアクションフックをスタートさせます。
テーマテンプレートファイル内の</body>タグの直前で使う。
|
パラメータ |
get_template_part($slug);
get_template_part($slug,$name);
$slug テンプレートスラッグの名前
$name 特定テンプレートの名前
|
使い方 |
</body>タグの直前に記述します。
このテンプレートタグがなければ、ログイン中にサイト上部に管理バーが表示ず、またスクリプトがエラーになったりします。
|
|
/* フッターアクションを読み込む */ ... </div> <?php wp_footer(); ?> </body> </html> |
項目 |
内容 |
説明 |
管理画面で設定したナビゲーションメニューを表示します。
このテンプレートタグで出力されるメニューは「管理画面→外観→メニュー」で作成できます。
|
パラメータ |
wp_nav_menu($args);
$args パラメータを要素とする配列 初期値:空の配列
theme_location テーマの中で使われる位置。ユーザーが管理画面で選択できるようにfunctions.php内のregister_nav_menu()関数で指定されている必要があります。
menu_class メニューを構成する<ul>タグに適用するクラス名。初期値:’menu’
menu_id メニューを構成する<ul>タグに適用するID名。初期値:’{メニューのスラッグ}-{連番}’
container メニューを構成する<ul>タグにコンテナを囲むかどうか、また囲む場合は<div>タグか<nav>タグのどちらを使うか。コンテナをなしにする場合は論理値のfalseを指定する。初期値:div
container_class コンテナに適用されるクラス名
container_id コンテナに適用されるID名
before リンクテキストの前のテキスト
after リンクテキストの後のテキスト
link_before リンクの前のテキスト
link_after リンクの後のテキスト
depth 何階層まで表示するか。0は全階層。
|
使い方 |
主にサイトに欠かせないグローバルナビゲーションやフッターナビゲーションを表示させる場合などに使います。
ただ、使用する場合に、functions.phpにregister_nav_menu()の指定がなければ管理画面で設定してサイト上に表示させることができない場合があります。
なので、別に解説するregister_nav_menu()の使い方でサンプルコード等説明します。
|
|
/* 管理画面で設定したナビゲーションを表示する場合 */ ... </header> <nav> <?php wp_nav_menu('theme_location' => 'header-navi'); ?> </nav> |
body_class();
項目 |
内容 |
説明 |
<body>タグに設置することによって、ページの種類ごとに違ったクラスを追加してくれます。
|
パラメータ |
body_class($class);
$class デフォルトのクラス名の他に追加したいclass名。複数指定するときは半角スペースで区切って指定する。
初期値:null
|
使い方 |
ページの種類ごとにタグにクラス名を付けてCSSで便利にデザインできるようにする場合に使います。
|
|
/* bodyタグに挿入すればそれぞれのテンプレートごとにclass名が割り当てられる */ ... <body <?php body_class(); ?>> |
post_class();
項目 |
内容 |
説明 |
投稿データごとにクラス名を追加してくれます。WordPressループで表示させたリストのHTMLタグに例えば<div <?php post_class(): ?>>のように指定すれば、リストの投稿データごとにそれぞれ違うクラス名を追加してくれるため、CSSでデザインがしやすくなります。
|
パラメータ |
post_class($class);
$class クラス属性に追加するクラス名。文字列の場合は半角スペースで区切る。
初期値:空文字列
|
使い方 |
投稿データごとに指定したタグにクラス名を付けてCSSで便利にデザインできるようにする場合に使います。
|
|
/* ループ内で記事ごとにユニークなクラス名を出力させる場合 */ ... if(have_posts()): while(have_posts()):the_post(); ?> <div <?php post_class(); ?>> ... </div> .... |
条件分岐系
is_archive();
項目 |
内容 |
説明 |
アーカイブページが表示されているかどうかをチェックします。
|
戻り値 |
開いたページがアーカイブページであれば論理値のtrue、そうでなければfalse
|
使い方 |
アーカイブページを開いたらこういう機能を追加したり、デザインを変更したりといったif文での条件分岐などで使用します。
|
|
/* アーカイブページを開いた時のみリンクボタンを表示させる。 */ <?php if(is_archive()): ?> <a href=”#”>リンクボタン</a> <?php endif; |
is_home();
項目 |
内容 |
説明 |
ブログ投稿インデックスページを表示中かどうかをチェックします。
|
戻り値 |
ブログ投稿インデックスページであれば論理値のtrue、そうでなければfalse
※ブログ投稿インデックスページとは、home.php、index.php、front-page.php、「管理→設定→表示設定」の「ホームページ」が設定されている場合、「管理→設定→表示設定」の「投稿ページ」が設定されている場合、を言います。
|
使い方 |
トップページを開いたらこういう機能を追加したり、デザインを変更したりといったif文での条件分岐などで使用します。
|
|
/* トップページ以外のページを開いた時のみパンくずリストを表示にする場合。 */ <?php if(! is_home()): ?> <div class="breadcrumb"> <ul> <li> … </li> </ul> </div> <?php endif; ?> |
is_front_page();
項目 |
内容 |
説明 |
サイトのフロントページが表示中かどうかをチェックします。
|
戻り値 |
開いたページがアーカイブページであれば論理値のtrue、そうでなければfalse
|
使い方 |
|
is_paged();
項目 |
内容 |
説明 |
表示中のページが複数のページで構成され、開いている現在のページが2ページ目以降かどうかをチェックします。
|
戻り値 |
2ページ目以降であれば論理値のtrue、そうでなければfalse
|
使い方 |
2ページ目以降を開いたらこういう機能を追加したり、デザインを変更したりといったif文での条件分岐などで使用します。
|
|
/* 例 header.php)2ページ目以降を開いたら、見出しを非表示にする場合 */ <?php if(is_paged()): ?> <style> h1{ display:none; } </style> <?php endif; ?> |
is_single();
項目 |
内容 |
説明 |
表示中のページが添付ファイルや固定ページを除く個別の投稿ページを表示しているかどうかをチェックします。
|
パラメータ |
is_single($post);
$post 投稿ID、タイトル、スラッグ、またはそれらの配列 初期値:なし
|
戻り値 |
個別の投稿ページであれば論理値のtrue、そうでなければfalse
|
使い方 |
2ページ目以降を開いたらこういう機能を追加したり、デザインを変更したりといったif文での条件分岐などで使用します。
|
|
/* 例 single.php)個別の投稿ページを開いた時のみヘッダーにビジュアル画像を表示させる時 */ ... <?php if(is_single()): ?> <div class="header-single-image"> <img src="<?php echo get_template_directory_uri(); ?>/images/"> </div> <?php endif; ?> |
is_search()
項目 |
内容 |
説明 |
検索ページが表示されているかどうかをチェックします。
|
戻り値 |
検索ページであれば論理値のtrue、そうでなければfalse
|
is_404();
項目 |
内容 |
説明 |
404エラーページが表示されているかどうかをチェックします。
|
戻り値 |
404エラーページであれば論理値のtrue、そうでなければfalse
|
is_category();
項目 |
内容 |
説明 |
カテゴリーアーカイブページが表示されているかどうかをチェックします。
|
パラメータ |
is_category($category);
$category カテゴリーID、カテゴリーのタイトル、カテゴリーのスラッグ。またはこれらの配列。
初期値:なし
|
戻り値 |
カテゴリーアーカイブページであればtrue、そうでなければfalse
|
is_tag();
項目 |
内容 |
説明 |
付けられたタグアーカイブページが表示されているかどうかをチェックします。
|
パラメータ |
is_tag($tag);
$tag タグID、名前、スラッグ。またはこれらの配列。
|
戻り値 |
タグアーカイブページであれば論理値のtrue、そうでなければfalse
|
is_main_query();
項目 |
内容 |
説明 |
現在のクエリがメインクエリかどうかをチェックします。
|
戻り値 |
現在のクエリがメインクエリであれば論理値のtrue、そうでなければfalse
|
使い方 |
is_main_query()は、例えばfunctions.phpにメインクエリの検索条件をカスタマイズする際に使います。
|
|
/* functions.phpにてメインクエリを変更する場合 */ function custom_main_query($query){ if(is_admin() || ! $query->is_main_query()){ return; } if($query->is_home()){ $query->set('posts_per_page',3); } } add_action('pre_get_posts','custom_main_query'); |
まとめ
以上が実際に実務で使用したテンプレートタグ集になります。
テンプレートタグはまだまだ数え切れないほど存在していますが、今回の内容をまずはおさえていただければテーマ作成はある程度できますので、制作時にぜひ今回の記事をお役立てください。
また、テーマを自作で作る方法を解説した記事がありますので、そちらの記事と合わせて役立てて頂けるとテーマを自作する方法をより迅速にマスターできますので、よろしければご確認ください!
WordPressでバックアップをとる方法【タイミング/用途別で解説】
バックアップの必要性とWordPressでバックアップをおこなうやり方を紹介します。
【最短】WordPress(ワードプレス)で問合せフォームを設置する方法
お問い合わせフォームをWordPressで簡単に設定する方法やカスタマイズする方法を解説します。
【WordPressの基礎・始め方】半日でゼロからブログを立ち上げる方法
今までサイトを開設した事がない人でも簡単にできる、WordPressを活用したブログの立ち上げ方を紹介します。
最後までお読みいただきましてありがとうございます。ご意見・ご要望などございましたら、
以下のフォームよりお問い合わせを受けつけておりますので、よろしければご利用ください。
この記事がお役に立ちましたら、"いいね!"をお願いします
minwebの最新情報をお届けします
minweb編集部(株)セルリア
”共に考え、共に創るWebの成功戦略”というスローガンのもと、お客様と一からWeb戦略を考え、
企画し実装まで支援する伴走型Webコンサルティング会社です。
タイトル・URLをコピー
記事タイトルWordPressで必須のテンプレートタグ53選(全サンプルコード付)
記事URLhttps://min-web.com/template-tag/
記事タイトルWordPressで必須のテンプレートタグ53選(全サンプルコード付)
記事URLhttps://min-web.com/template-tag/
こちらの記事をお読みのかたにおすすめ!完全無料のダウンロード資料
Googleサーチコンソール使い倒し活用術 <AOHON>
Googleの検索エンジンに関する情報を幅広く確認できるツール「Googleサーチコンソール」の活用方法をまとめました。新サーチコンソールの機能を網羅的に紹介するだけでなく、Webサイトを最適化できる実践的な方法までわかりやすく解説します。
サーチコンソール初心者の方が知りたい導入方法から、上級者向けのコンテンツ改善の方法まで、押さえておきたい要素を1つに集めた、SEOに力を入れたいすべてのWeb担当者におすすめの一冊です。