WordPress

WordPressでよく使うテンプレートタグの覚え書き

Category

WordPress

今回の記事は、自分の覚え書き用にWordPressでよく使うテンプレートタグをまとめてみようと思います。「あのタグ何だったかな?」という時は、WordPressのCodexを見ていましたが、さっと確認できて便利そうですので書き残しておきます。

Keyword:WordPress,テンプレートタグ

WordPress テンプレートタグ

WordPressでよく使うテンプレートタグ

ページタイトル

// "サイト名|ページタトル"で表示
<?php bloginfo('name'); ?><?php wp_title('|'); ?>

// "ページタトル|サイト名"で表示
<?php wp_title('|', true, 'right'); ?><?php bloginfo('name'); ?>

説明

●(‘|’)…サイト名とページタイトルの間に区切り文字を挿入
●初期値では区切り文字は左側に表示される
●()…区切り文字を空にした場合、初期値の”»”が使われる
●true…タイトルを表示する
●false…PHP文字列として使えるようにタイトルの値を返す
●’right’…区切り文字を右側に表示させる

ディレクトリのパス

// サイトのアドレス(URL)で設定したディレクトリのパス
<?php bloginfo('url'); ?>

// テーマを格納しているディレクトリのパス
<?php bloginfo('template_directory'); ?>

// テーマのスタイルシート(style.css)のパス
<?php bloginfo('stylesheet_url'); ?>

// RSS2.0形式のメインフィードURLのパス
<?php bloginfo('rss2_url'); ?>

// Atom形式のメインフィードURLのパス
<?php bloginfo('atom_url'); ?>

// RSS2.0形式のコメントフィードURLのパス
<?php bloginfo('comments_rss2_url'); ?>

// 使用例
// サイトのアドレス(URL)で設定したディレクトリのパス
<a href="<?php bloginfo('url'); ?>">Webクリエイターネット</a>

// テーマを格納しているディレクトリのパス
<img src="<?php bloginfo('template_directory'); ?>/image/logo.jpg" alt="ロゴ" />

// テーマのスタイルシート(style.css)のパス
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" />

// RSS2.0形式のメインフィードURLのパス
<link rel="alternate" type="application/rss+xml" title="RSSフィード" href="<?php bloginfo('rss2_url'); ?>" />

// Atom形式のメインフィードURLのパス
<link rel="alternate" type="application/atom+xml" title="Atomフィード" href="<?php bloginfo('atom_url'); ?>" />

// RSS2.0形式のコメントフィードURLのパス
<a href="<?php bloginfo('comments_rss2_url'); ?>" title="RSSコメントフィード">コメントフィード</a>

インクルード

// ヘッダーテンプレートをインクルード
<?php get_header(); ?>

// サイドバーテンプレートをインクルード
<?php get_sidebar(); ?>

// サイドバーテンプレート"2"をインクルード
<?php get_sidebar('2'); ?>

// フッターテンプレートをインクルード
<?php get_footer(); ?>

// テーマディレクトリ内のinfo.phpをインクルード(バージョン3.0未満)
<?php include(TEMPLATEPATH.'/info.php'); ?>

// テーマディレクトリ内のinfo.phpをインクルード(バージョン3.0以降)
<?php get_template_part('info'); ?>

// テーマディレクトリ内のinfo-2.phpをインクルード(バージョン3.0以降)
<?php get_template_part('info', '2'); ?>

説明

●サイドバーテンプレート”2″をインクルード
sidebar-2.phpを用意しておき、別のサイドバーテンプレートを読み込みます。
WordPress2.5以上で使用できるパラメータです。
ヘッダーテンプレートも同様に、header-2.phpとしてインクルード可能です。

 ●テーマディレクトリ内のinfo.phpをインクルード(バージョン3.0未満)
“include”文とWordPressで定義されている定数”TEMPLATEPATH”を用いて、テーマディレクトリ内の任意のテンプレートファイルを読み込むことができます。
WordPress 3.0未満で使用

●テーマディレクトリ内のinfo.phpをインクルード(バージョン3.0以降)
WordPress 3.0以降では、”get_template_part”という関数が用意されていますので、そちらを使います。

●テーマディレクトリ内のinfo-2.phpをインクルード(バージョン3.0以降)
パラメータには、$slug(一般テンプレートのスラッグ名)と$name(特定テンプレートの名前)を指定することができます。

タイトル

// 投稿記事・固定ページのタイトルを表示
<?php the_title(); ?>

// title属性に記事のタイトルを付ける
<?php the_title_attribute(); ?>

// ページのタイトルを表示
<?php wp_title(''); ?>

// 使用例
<a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>"><?php the_title(); ?></a>

説明

●投稿記事・固定ページのタイトルを表示
投稿記事や固定ページ作成時に管理画面から入力したページタイトルを表示します。

●title属性に記事のタイトルを付ける(使用例参照)
title属性を付けることで、ブラウザ上でカーソルを合わせた際にツールチップを表示してくれます。また、テキスト要素を付加することができますので、背景を使ったボタン等にもおすすめです。

●ページのタイトルを表示
カテゴリーページ等で現在表示されているカテゴリーを表示したいような場合に使用します。もともとページタイトルを表示するためのテンプレートタグですので、<?php wp_title(); ?>と記述してしまうと初期値の”»”が左側に表示されてしまいます。これを回避するため、”(”)”とすることで左側には何も表示されなくなります。
“ページタイトル”の項目参照。

パーマリンク

// パーマリンクを表示
<?php the_permalink(); ?>

// 使用例
<a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>

本文・抜粋

// 本文を表示
<?php the_content(); ?>

// 抜粋を表示
<?php the_excerpt(); ?>

サムネイル画像(アイキャッチ画像)

// サムネイル画像を表示
<?php the_post_thumbnail(); ?>

↓ functions.phpに以下を追記 ↓

// 使用中のテーマでサムネイル画像(アイキャッチ画像)を有効にする
add_theme_support('post-thumbnails');

// 幅 100px、高さ 100px、切り抜きモードで表示
set_post_thumbnail_size(100, 100, true);

ループ

// ループ処理
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
/* ループする箇所のソースを入力 */
<?php endwhile; ?>
<?php else : ?>
現在、記事はありません
<?php endif; ?>

説明

<?php while (have_posts()) : the_post(); ?>~<?php endwhile; ?>の間をループして出力します。記事がない場合は<?php else : ?>以下の”現在、記事はありません”を出力します。

前後記事・一覧ページへのリンク

// 前後記事・一覧ページへのリンクを表示
<?php previous_post_link('%link', '前へ'); ?>
<a href="<?php bloginfo('url'); ?>/○○○○○/">一覧</a>
<?php next_post_link('%link', '次へ'); ?>

説明

●前の記事へのリンクを表示
<?php previous_post_link(‘%link’, ‘前へ’); ?>

●一覧ページへのリンクを表示
<a href=”<?php bloginfo(‘url’); ?>/○○○○○/”>一覧</a>
“○○○○○”には、サイトURL以降のパスを入れます。
例えば、カテゴリーAを全てのカテゴリーの一覧ページ、カテゴリーB~Lをそれぞれのカテゴリーの一覧ページとして出力している場合、”カテゴリーA=category-スラッグ名.php”といったテンプレートファイルを作成し、親カテゴリーとします。
そして、”カテゴリーB~L=category.php”といったテンプレートファイルを作成し、先程作成した親カテゴリーの子カテゴリーとします。
そうすると、”○○○○○”に”カテゴリーAのスラッグ名”を入れれば、一覧ページのリンク先は、全てのカテゴリー一覧のページがリンク先となります。

●次の記事へのリンクを表示
<?php next_post_link(‘%link’, ‘次へ’); ?>

●パラメータ
<?php previous_post_link(‘format’, ‘link’, in_same_cat, ‘excluded_categories’); ?>
○format
リンクの文字列
“%link”で”link”で指定したパラメータに置き換えられます。
初期値は”&laquo; %link”(&laquo;=»)。
○link
表示するリンクのテキスト
初期値は”%title”(前・次の記事のタイトル)。
○in_same_cat
表示中の記事と同じカテゴリーで、前・次の記事を表示するか
初期値は”FALSE”(TRUE=同じカテゴリーの記事だけを表示)。
※未入力:最新(最古)の記事を表示の際、次(前)の記事へのリンクは非表示。
○excluded_categories
非表示にする記事のカテゴリーのID
初期値はなし。複数指定する場合は”and”で区切ります。
例) ‘1 and 5 and 15′

カテゴリー・ターム

// カテゴリーのリンクを表示
<?php the_category(','); ?>

// タームのリンクを表示
<?php echo get_the_term_list($post->ID,'タクソノミー名'); ?>

説明

●カテゴリーのリンクを表示
(‘,’)でカテゴリーへのリンクをカンマ区切りで表示します。
(‘ ‘)とするとカテゴリーへのリンクを半角スペース区切りで表示します。

●タームのリンクを表示
カスタム投稿タイプでタクソノミーを作成し、そのタクソノミー名に属するタームのリンクを表示します。
他にも”$before”や”$sep”や”$after”といったパラメータが用意されています。
○$before…前の文字列
○$sep…区切り文字
○$after…後の文字列
記入例としては…
<?php echo get_the_term_list($id, ‘$taxonomy’, ‘$before’, ‘$sep’, ‘$after’); ?>といった形になり、例をあげると…
<?php echo get_the_term_list($post->ID, ‘タクソノミー名’, ‘カテゴリー:’, ‘,’, ”); ?>では…
“カテゴリー:”という文字列が前に表示され、区切り文字には”,(カンマ)”が出力されます。後ろの文字列は空ですので、何も出力されません。

タグ

// タグを表示
<?php the_tags('', '&bull'); ?>

説明

パラメータには”前に表示する文字列”や”区切り文字”や”後ろに表示する文字列”があり、記入例としては…
<?php the_tags(‘前に表示する文字列’, ‘区切り文字’, ‘後ろに表示する文字列’); ?>といった形になります。
○前に表示する文字列…初期値は”Tags:”
○区切り文字…初期値は”,(カンマ)”
○後ろに表示する文字列…初期値は何も出力しない
上記<?php the_tags(”, ‘&bull’); ?>では、前に表示する文字列は”なし”、区切り文字は”・(中点)”、後ろに表示する文字列は未入力ですので、初期値の”何も出力しない”といったようになります。

日程・年数

// 日程を表示
<?php the_time('Y/m/d'); ?>

// 年数を表示
<?php echo date('Y'); ?>

説明

●日程を表示
2012/01/15といった形で出力します。

●年数を表示
西暦で表示します。
コピーライトの表記等で使うと、自動で年数を変更してくれるので便利です。

サイト名・サイトURL

// サイト名を表示
<?php bloginfo('name'); ?>

// サイトURLを表示
<?php bloginfo('url'); ?>

ページ毎の条件分岐

// TOPページ
is_home()

// 投稿ページ
is_single()
is_single('ID')
is_single('スラッグ')
is_single(array(ID, ID))
is_single(array('スラッグ', 'スラッグ'))

// 投稿タイプ
get_post_type() == 'ポストタイプ名'

// 投稿タイプ別アーカイブページ
is_post_type_archive('ポストタイプ名')

// タクソノミー(カスタム分類)アーカイブページ
is_tax()

// 固定ページ
is_page()
is_page('ID')
is_page('スラッグ')
is_page(array(ID, ID))
is_page(array('スラッグ', 'スラッグ'))

// カテゴリーページ
is_category()
is_category('ID')
is_category('スラッグ')
in_category(array(ID, ID))
in_category(array('スラッグ', 'スラッグ'))

// アーカイブページ
is_archive()

// 検索ページ
is_search()

// 404ページ
is_404()

// 使用例
<?php if(is_single()) : ?>
<h1 class="single_title"><?php the_title(); ?></h1> 
<?php elseif(is_category('1')) : ?>
<h1 class="category1_title"><?php the_title(); ?></h1>
<?php elseif(in_category(array(2, 3, 4))) : ?>
<h1 class="category2-4_title"><?php the_title(); ?></h1>
<?php elseif(is_page()) : ?>
<h1 class="page_title"><?php the_title(); ?></h1>
<?php elseif(is_page(array('company', 'outline'))) : ?>
<h1 class="company_outline_title"><?php the_title(); ?></h1>
<?php else : ?>
<h1 class="common_title"><?php the_title(); ?></h1> 
<?php endif; ?>

説明

●書き方
“is(in)_○○○○○~”の○の箇所を適応させたいページ毎に変更します。
複数指定したい場合は”array”を使い”,(カンマ)”で区切ります。
“is”と”in”の違いは、”in”は投稿に直接割り当てられているカテゴリー(管理画面でチェックしたカテゴリー)のみを考慮し、そのカテゴリーの親は考慮しません。
また、”is(in)”の前に”!”を付けることで除外することもできます。

投稿タイプ”get_post_type() == ‘ポストタイプ名’ “は、投稿タイプを区別します。
カスタム投稿タイプを使用している場合によく使います。 

投稿タイプ別アーカイブページ “is_post_type_archive(‘ポストタイプ名’)”は、カスタム投稿タイプのアーカイブページを使用している場合によく使います。

タクソノミー(カスタム分類)アーカイブページ”is_tax()”は、カスタム投稿タイプで作成したタクソノミー(カスタム分類)のアーカイブページを使用している場合によく使います。

●使用例
上記使用例では、投稿ページの場合は”h1タグのクラスにsingle_titleを適応”、カテゴリーページのIDが1の場合は”h1タグのクラスにcategory1_titleを適応”、カテゴリーページのIDが2~4の場合は”h1タグのクラスにcategory2-4_titleを適応”、固定ページの場合は”h1タグのクラスにpage_titleを適応”、ただし固定ページのスラッグがcompanyとoutlineの場合は”h1タグのクラスにcompany_outline_titleを適応”、それら以外のページには”h1タグのクラスにcommon_titleを適応”するといった意味になります。

[注意事項]
ソースをコピー&ペーストする場合は、行番号の振られているSyntaxhighlighter上にカーソルを合わせると表示される”ソースを表示”よりご使用ください。
Syntaxhighlighterでの表示以外の箇所よりソースをコピー&ペーストすると、シングルクォーテーションやダブルクォーテーションが全角に置き換わってしまいます。

List

関連記事(※当記事と関連性が高いと思われる記事)

WordPressのアイキャッチ画像

2012/04/12
WordPressのアイキャッチ画像
スコア:20 ※スコアの数値が大きいほど、関連性の高い記事です。 以下の内容で紹介していきます。※テキストリンクをクリックするとその箇所までページがスクロールします。 アイキャッチ画像の基本的な使い方 アイキャッチ画像の切り替え(指定... 続きを読む...

WordPressの検索表示をカスタマイズする

2012/03/11
WordPressの検索表示をカスタマイズ
スコア:20 ※スコアの数値が大きいほど、関連性の高い記事です。 以下の手順で紹介していきます。※テキストリンクをクリックすると、その箇所までページがスクロールします。 検索フォームを変更する 検索結果に「入力した検索ワード」と「該当... 続きを読む...

WordPressのFacebook用OGP出力テンプレート

2012/06/02
WordPressのFacebook用OGP出力テンプレート
スコア:18 ※スコアの数値が大きいほど、関連性の高い記事です。 2012.6.2現在でのFacebookの仕様で作成しています。※新たな仕様変更が発生することもありますので、その点ご了承ください。 以下の手順で説明していきます。※テ... 続きを読む...

おすすめ書籍・商品(※当記事と関連性が高いと思われる書籍・商品)

ページの先頭へ