個人的によく使うWPテンプレートタグ・関数まとめ

WordPress2020.03.31

ワードプレスを使ったサイトをテーマから作る場合、この記事で紹介するテンプレートタグを利用することが多いと思います。

誰かのテーマを使ってサイトを構築している場合も、サイトの調整が必要なときは操作する機会が多いと思われるテンプレートタグの使い方をまとめていきます。

テンプレートタグとは？

WPにおいて何かを表示させたり、何かを取得したりするときに使うPHPで作られたWP専用の関数のことを指します

使い方はPHPの開始タグと閉じタグの間に書き込むだけで、ほとんどのテンプレートタグの最後には（）が付き（）の中にはパラメータを入れて使います（パラメータは省略もできる）
※（）自体は省略できない

<?php テンプレートタグ名();?>
<?php テンプレートタグ名(パラメータ);?>

1 2	<?php テンプレートタグ名();?> <?php テンプレートタグ名(パラメータ);?>

インクルードタグ

インクルードタグはテンプレート内で、他のテンプレートを読み込むために使うテンプレートタグです。

もちろん、PHPの「require」や「include」も利用できますが、こちらのほうが簡単ですよとwpのcodexでは紹介されています。

get_header()

有効化されているテーマフォルダ直下にある「header.php」または、「header-{任意の名前}.php」を読み込むテンプレートタグ。

「header-{任意の名前}.php」を読み込みたい場合は任意の名前部分（{}は除く）をパラメータに文字列の形で入れて使う

テーマフォルダ直下に、このファイルがないときは、代わりに「wp-includes/theme-compat/header.php」が読み込まれます。

/*header.phpを読み込む*/
<?php get_header();?>

/*header-test.phpを読み込む*/
<?php get_header('test');?>

/*header.phpを読み込む*/

<?php get_header();?>

/*header-test.phpを読み込む*/

<?php get_header('test');?>

get_footer()

有効化されているテーマフォルダ直下にある「footer.php」または、「footer-{任意の名前}.php」を読み込むテンプレートタグ。

「footer-{任意の名前}.php」を読み込みたい場合は任意の名前部分（{}は除く）をパラメータに文字列の形で入れて使う

テーマフォルダ直下に、このファイルがないときは、代わりに「wp-includes/theme-compat/footer.php」が読み込まれます。

/*footer.phpを読み込む*/
<?php get_footer();?>

/*footer-test.phpを読み込む*/
<?php get_footer('test');?>

/*footer.phpを読み込む*/

<?php get_footer();?>

/*footer-test.phpを読み込む*/

<?php get_footer('test');?>

get_sidebar()

有効化されているテーマフォルダ直下にある「sidebar.php」または、「sidebar-{任意の名前}.php」を読み込むテンプレートタグ。

「sidebar-{任意の名前}.php」を読み込みたい場合は任意の名前部分（{}は除く）をパラメータに文字列の形で入れて使う

テーマフォルダ直下に、このファイルがないときは、代わりに「wp-includes/theme-compat/sidebar.php」が読み込まれます。

/*sidebar.phpを読み込む*/
<?php get_sidebar();?>

/*sidebar-test.phpを読み込む*/
<?php get_sidebar('test');?>

/*sidebar.phpを読み込む*/

<?php get_sidebar();?>

/*sidebar-test.phpを読み込む*/

<?php get_sidebar('test');?>

get_template_part()

有効化されているテーマフォルダ直下にあるheader・footer・sidebar以外のテンプレート（パーツテンプレート）を読み込むテンプレートタグ。

パラメータにテンプレートのファイル名（拡張子を除く）を文字列で入れて使う。

/*nav.phpを読み込む場合*/
<?php get_template_part('nav');?>

1 2	/nav.phpを読み込む場合/ <?php get_template_part('nav');?>

get_search_form()

有効化されているテーマフォルダ直下にある「serchform.php」を読み込むテンプレートタグ。

serchform.phpが無いときは、代わりに検索フォームが生成されます。

/*serchform.phpを読み込む*/
<?php get_search_form();?>

1 2	/serchform.phpを読み込む/ <?php get_search_form();?>

comments_template()

有効化されているテーマフォルダ直下にある「comments.php」を読み込むテンプレートタグ。

comments.phpが無いときは、代わりに wp-includes/theme-compat/comments.php を読み込みます。

。

/*comments.phpを読み込む*/
<?php comments_template();?>

1 2	/comments.phpを読み込む/ <?php comments_template();?>

覚えておきたい関数

以下に紹介する関数は必須といっても過言ではないものになります

wp_head()

wp_head()はhead要素の最後に配置する関数で、wp_headアクションフックを起動させます。

テーマに依存しますが、最も重要なテーマのフックの1つで、テーマで必要なコードやプラグインに必要なコードをhead要素内に出力するなど、かなり広くサポートされています。

/*head要素の最後に記述する*/
<?php wp_head();?>

1 2	/head要素の最後に記述する/ <?php wp_head();?>

wp_footer()

wp_head()はbody要素の最後に配置する関数で、wp_footerアクションフックを起動させます。

wp_footerアクションフックはデフォルトでアドミンバーを出力知る役割を持っています。

プラグイン関係でも使われるので必ず入れておきたい関数です

/*body要素の最後に記述する*/
<?php wp_footer();?>

1 2	/body要素の最後に記述する/ <?php wp_footer();?>

覚えておきたいテンプレートタグ

個人的によく使うテンプレートタグを紹介しますが、ここで紹介しているもの以外でも同じようなことができるものもあるのでここに書いているものが必ず正しいと言ったわけではありません

メインループ

ループと呼ばれる設定を行うためのテンプレートタグ群で、メインクエリで取得したデータを正常に出力するために使う

記事の情報などを出力する場合はだいたいこの中に処理を書く

<?php/*ループの始まり*/
if(have_posts()):
while(have_posts()):
the_post();
?>

<?php/*ループの終わり*/
endwhile;
endif;
?>

<?php/*ループの始まり*/

if(have_posts()):

while(have_posts()):

the_post();

<?php/*ループの終わり*/

endwhile;

endif;

body_class()

body開始タグの中に入れるテンプレートタグで、ページやユーザーの状態に合ったクラスを出力してくれるのでページごとに装飾を変えたいときの足掛かりにな理とっても便利

パラメータに追加で出力したい文字列を入れることができる

<body <?php body_class();?>>

1	<body <?php body_class();?>>

bloginfo()

WPで構築したサイトの様々な情報を出力できるテンプレートタグで、出力内容はパラメータに文字列の形で指定できる

/*サイトのタイトルを出力*/
<?php bloginfo('name');?>

/*キャッチフレーズ・このサイトの簡単な説明を出力*/
<?php bloginfo('description');?>

/*サイトのタイトルを出力*/

<?php bloginfo('name');?>

/*キャッチフレーズ・このサイトの簡単な説明を出力*/

<?php bloginfo('description');?>

使えるパラメータと出力内容は下の表にまとめました。

パラメータ	出力内容
name	「設定」→「一般設定」サイトのタイトルを出力
description	「設定」→「一般設定」キャッチフレーズ・このサイトの簡単な説明を出力
admin_email	「設定」→「一般設定」メールアドレスを出力個人情報は出力したくない
url	「設定」→「一般設定」サイトアドレス (URL)を出力
wpurl	「設定」→「一般設定」WordPress アドレス (URL)を出力
stylesheet_directory	スタイルシートディレクトリのURLを出力
stylesheet_url	スタイルシートのURLを出力
template_directory	テンプレートファイルディレクトリのURLを出力
template_url	テンプレートのURLを出力
atom_url	AtomフィードのURLを出力
rss2_url	RSS2.0フィードのURLを出力
rss_url	RSS0.92フィードのURLを出力
pingback_url	ピンバックのURLを出力
rdf_url	RDF/RSS1.0フィードのURLを出力
comments_atom_url	コメントのAtomフィードのURLを出力
comments_rss2_url	コメントのRSS2.0フィードのURLを出力
charset	文字コードを出力
html_type	メディアタイプを出力
language	言語を出力（ja）
text_direction	設定されているテキストの向きを出力
version	WordPressのバージョンを出力

wp_title()

wp_title()は、表示しているページのタイトルを自動的に出力してくれるテンプレートタグで、bloginfo()と組み合わせてtitle要素内で使うと「記事のタイトル》サイトタイトル」という形に自動でtitleを出力できる

デフォルトのまま使うと記事タイトルの右側に区切り文字として「》」が出てくるので変えたい場合はパラメータから調整する

<?php wp_title('区切り文字', true, 'left or right'); ?>

1	<?php wp_title('区切り文字', true, 'left or right'); ?>

1つ目のパラメータは区切り文字の指定
2つ目のパラメータはtrueかfalseで指定trueでタイトルを表示し、
falseでタイトルの値を返す
3つ目のパラメータは区切り文字をタイトルの左右どちらに出力するかを指定

get_stylesheet_uri()

get_stylesheet_uri()はテーマフォルダ直下にある「style.css」までの絶対パスを取得するテンプレートタグで、link要素内のhref属性の中に出力する形で使う

<link rel="stylesheet" href="<?php get_stylesheet_uri();?>">

1	<link rel="stylesheet" href="<?php get_stylesheet_uri();?>">

get_template_directory_uri()

get_template_directory_uri()は、テーマフォルダまでの絶対パスを取得するテンプレートタグで、style.css以外のCSSやJSファイル・imgファイルなどを読み込むときに使う

※あくまでもテーマフォルダまでなので、このテンプレートタグの後は「/」記号を付けて使う

//よくある間違い
//このような書き方だとうまく表示できない
<img src="<?php echo get_template_directory_uri();?>○○.jpg" alt="">
//ソースを見てみるとthemeフォルダにつながった状態でファイル名が出力されてしまう

//正しい書き方
//下記のようにテンプレートタグの直後に「/」を入れてフォルダ内に入ってあげましょう
<img src="<?php echo get_template_directory_uri();?>/○○.jpg" alt="">

//よくある間違い

//このような書き方だとうまく表示できない

//ソースを見てみるとthemeフォルダにつながった状態でファイル名が出力されてしまう

//正しい書き方

//下記のようにテンプレートタグの直後に「/」を入れてフォルダ内に入ってあげましょう

home_url()

トップページのURLを取得するテンプレートタグ

パラメータにトップからの相対パスを入れて、特定ページへのリンクを取得することもできる

<?php echo home_url();?>

1	<?php echo home_url();?>

get_permalink()

パラメータにIDを入れるとパーマリンクを取得できるテンプレートタグでループの外で使うことができます

get_page_by_titleを使って、タイトルからIDを取得することもできるので使い勝手は良いと思います

取得しかしてくれないので、出力しましょう

//ID：8の記事のパーマリンクを取得し出力
<?php echo get_permalink(8);?>

//タイトルが「サンプル」の記事のパーマリンクを取得し出力
<?php echo get_permalink(get_page_by_title('サンプル'));?>

//ID：8の記事のパーマリンクを取得し出力

<?php echo get_permalink(8);?>

//タイトルが「サンプル」の記事のパーマリンクを取得し出力

<?php echo get_permalink(get_page_by_title('サンプル'));?>

php post_class()

ループ内で記事全体を囲んだ要素に付けるテンプレートタグでページやユーザーの状態に合ったクラスを出力してくれます

パラメータに追加で出力したい文字列を入れることなんかもできる

<?php post_class();?>

1	<?php post_class();?>

the_title()

記事のタイトルを出力するテンプレートタグ

ループ内外で使えるので便利

<?php the_title();?>

1	<?php the_title();?>

the_content()

投稿や固定ページの本文を出力するテンプレートタグ

<?php the_content();?>

1	<?php the_content();?>

the_category()

記事が属するカテゴリーをリンク付きの箇条書きリストで出力するテンプレートタグで、リンクの移動先はカテゴリー別の一覧ページになってます

パラメータには区切り文字を指定できて、区切り文字を指定すると箇条書きリストは解除されて、ただのリンクになります

<?php the_category();?>

1	<?php the_category();?>

the_tags()

記事につけられたタグをリンク付きで出力

タグというラベルが自動で出力されカンマ区切りに出力される

<?php the_tags();?>

1	<?php the_tags();?>

get_the_date()

記事の投稿日を取得するテンプレートタグ

取得する形式はパラメータで指定でき、よく使うものは「(‘Y-m-d’)」

<?php get_the_date();?>

1	<?php get_the_date();?>

previous_post_link()

前の記事へのリンク文字列を出力するテンプレートタグ

一つ目のパラメータは固定

二つ目のパラメータは表示したい形式にする。この時[%title]がリンク文字列に置き換わる

<?php previous_post_link('%link', '表示したい形 ＋ %title'); ?>

1	<?php previous_post_link('%link', '表示したい形＋ %title'); ?>

php next_post_link()

次の記事へのリンク文字列を出力する

一つ目のパラメータは固定

二つ目のパラメータは表示したい形式にする。この時[%title]がリンク文字列に置き換わる

<?php next_post_link('%link', '表示したい形 ＋ %title'); ?>

1	<?php next_post_link('%link', '表示したい形＋ %title'); ?>

dynamic_sidebar()

functions.phpに「register_sidebar()」でウィジェット機能を有効にしている場合に使える、登録したウィジェットを出力するテンプレートタグ

各項目は出力の際、li要素に囲まれた状態で出力されるのでテンプレートタグはulタグで囲んでおく

<ul>
<?php dynamic_sidebar();?>
</ul>

<ul>

<?php dynamic_sidebar();?>

</ul>

ウィジェットを使わずカテゴリー一覧のリンクを出したいとき

<?php
// パラメータを指定どちらかのパラメータを入れてね
$args = array(
'orderby' => 'count',// 記事数順で指定ならこのパラメータ
'order' => 'DSC'// 降順で指定ならこのパラメータ
);

//カテゴリー情報を取得して配列にしまう
$categories = get_categories( $args );
?>
<?php foreach( $categories as $category ):?>
<li><a href="<?=get_category_link( $category->term_id );?>"> <?=$category->name;?>  </li>
<?php endforeach;?>

<?php

// パラメータを指定どちらかのパラメータを入れてね

$args = array(

'orderby' => 'count',// 記事数順で指定ならこのパラメータ

'order' => 'DSC'// 降順で指定ならこのパラメータ

);

//カテゴリー情報を取得して配列にしまう

$categories = get_categories( $args );

<?php foreach( $categories as $category ):?>

<?php endforeach;?>

get_post_meta()

カスタムフィールドの内容を取得するテンプレートタグ

<?php get_post_meta(post->ID,フィールド名,true);?>

1	<?php get_post_meta(post->ID,フィールド名,true);?>

the_post_thumbnail()

アイキャッチ画像を出力するテンプレートタグで、サイズはパラメータで指定する

パラメータ	画像サイズ
thumbnail	サムネイルサイズ
medium	中サイズ
large	大サイズ
full	フルサイズ

<?php the_post_thumbnail();?>

1	<?php the_post_thumbnail();?>

single_cat_title()

ループの外で使うカテゴリーページでカテゴリー名を出力するテンプレートタグで、カテゴリーページ以外では何も出力しない。

<?php single_cat_title();?>

1	<?php single_cat_title();?>

the_excerpt()

投稿の抜粋を表示するテンプレートタグでループ内で強制的に抜粋を表示するときに使用します。

WP Multibyte Patchのプラグインが有効になっていればデフォルトで１１０文字まで（フィルターフックで変更可能）の抜粋文が表示される

カスタマイズはfunctions.phpで

<?php the_excerpt();?>

1	<?php the_excerpt();?>

if($wp_query->max_num_pages>1):endif;

記事などをリストアップするとき、１ページに収まらないときに使う条件分岐で、ページャーを出したりするときに便利

<?php if($wp_query->max_num_pages>1):?>
//１ページに収まらないときの処理
<?php endif;?>

<?php if($wp_query->max_num_pages>1):?>

//１ページに収まらないときの処理

<?php endif;?>

next_posts_link()

ループの外で使う、記事一覧が設定した数より多い場合に使うページャーで、古い記事一覧ページへのリンクを出力する

<?php next_posts_link();?>

1	<?php next_posts_link();?>

previous_posts_link()

ループの外で使う、記事一覧が設定した数より多い場合に使うページャーで、新しい記事一覧ページへのリンクを出力する

<?php previous_posts_link();?>

1	<?php previous_posts_link();?>

the_posts_pagination()

ペーシャーを出力するテンプレートタグで豊富なオプションが用意されています。

あまり情報がないのでいろいろ試してもらうしかないですのですが一応使えそうなものを載せておきます。

<?php
the_posts_pagination(
(array(
'mid_size'=>2,
'prev_text'=>('Prev'),
'next_text'=>('Next'),
'screen_reader_text'=>(' ')
)
));
?>

//使えるオプション
<?php
the_posts_pagination(
array(
'base'               => '%_%', // ちょっと良く分からない
'format'             => '?page=%#%', // ページネーションのパーマリンク構造
'total'              => '1', // 総ページ数
'current'            => '0', // 現在のページ番号
'show_all'           => 'false', // 全てのページを表示する。falseの場合は以下end_size, mid_sizeで指定
'end_size'           => '1', // ページ番号リストの両端に表示するページ数
'mid_size'           => '1', // 現在のページの両端に表示するページ数
'prev_next'          => true, // リスト内に「前へ」「後へ」のリンクを表示するかどうか。表示する場合はprev_text, next_textで指定
'prev_text'          => __( 'previous page', 'textdmain' ), // 前のページへ送るリンクテキスト
'next_text'          => __( 'next page', 'textdmain' ), // 後のページへ送るリンクテキスト
'type'               => 'plain', // 戻り値の指定 plain or list
'add_args'           => false, // 追加のクエリ引数の配列
'add_fragment'       => false, // リンクに付け加えるテキスト
'before_page_number' => '', // 各ページ番号の前に入れるテキスト
'after_page_number'  => '', // 各ページ番号の後に入れるテキスト
'screen_reader_text' => __( 'Post Navigation', 'textdmain' ), // スクリーンリーダー用のテキスト
)
);
?>

<?php

the_posts_pagination(

(array(

'mid_size'=>2,

'prev_text'=>('Prev'),

'next_text'=>('Next'),

'screen_reader_text'=>(' ')

)

));

//使えるオプション

<?php

the_posts_pagination(

array(

'base' => '%_%', // ちょっと良く分からない

'format' => '?page=%#%', // ページネーションのパーマリンク構造

'total' => '1', // 総ページ数

'current' => '0', // 現在のページ番号

'show_all' => 'false', // 全てのページを表示する。falseの場合は以下end_size, mid_sizeで指定

'end_size' => '1', // ページ番号リストの両端に表示するページ数

'mid_size' => '1', // 現在のページの両端に表示するページ数

'prev_next' => true, // リスト内に「前へ」「後へ」のリンクを表示するかどうか。表示する場合はprev_text, next_textで指定

'prev_text' => __( 'previous page', 'textdmain' ), // 前のページへ送るリンクテキスト

'next_text' => __( 'next page', 'textdmain' ), // 後のページへ送るリンクテキスト

'type' => 'plain', // 戻り値の指定 plain or list

'add_args' => false, // 追加のクエリ引数の配列

'add_fragment' => false, // リンクに付け加えるテキスト

'before_page_number' => '', // 各ページ番号の前に入れるテキスト

'after_page_number' => '', // 各ページ番号の後に入れるテキスト

'screen_reader_text' => __( 'Post Navigation', 'textdmain' ), // スクリーンリーダー用のテキスト

)

);

テンプレートタグとは？

インクルードタグ

get_header()

get_footer()

get_sidebar()

get_template_part()

get_search_form()

comments_template()

覚えておきたい関数

wp_head()

wp_footer()

覚えておきたいテンプレートタグ

メインループ

body_class()

bloginfo()

wp_title()

get_stylesheet_uri()

get_template_directory_uri()

home_url()

get_permalink()

php post_class()

the_title()

the_content()

the_category()

the_tags()

get_the_date()

previous_post_link()

php next_post_link()

dynamic_sidebar()

get_post_meta()

the_post_thumbnail()

single_cat_title()

the_excerpt()

if($wp_query->max_num_pages>1):endif;

next_posts_link()

previous_posts_link()

the_posts_pagination()

『slick』の基本的な使い方（オプションなど）を細かくまとめていく

CSSだけでスライドショー

swiper.js（8.1.4）を使ってゆっくり等速で流れる無限ループスライダーを作ってみました

IEにはそろそろ別れを告げたいのでIEのユーザーだけリダイレクトしてみた

最近よく使うcssを使ったアンダーラインが出た後に文字がニョキッと出てくるアニメーション