TL;DR
WordPress テーマを作る時に使用頻度の高いテンプレートタグをまとめておきます。
テンプレートタグとは
CMS では、html 等の骨組みにデータを流し込んで出力します。
WordPress のテンプレートタグとは、タイトルや画像・サイト URL の絶対パスなどを読み込み出力させるためのものです。テンプレートタグは自動で絶対パスやサイトの設定等を読み込むので、サイトを移行させた時も URL やパスなどを書き換える必要がなくなり便利です。WordPress テーマ作成をする時に必ず使う機能の一つなので是非覚えておきましょう。
トップページ URL 出力
bloginfo('home や template_directory')などは廃止されています。URL は以下のタグを使います。管理画面>設定>サイトアドレスの部分を出力。
<?php echo home_url(); ?>
// 例
<?php echo home_url('/foo/contact'); ?>
ページタイトルだけを出力する新しい方法
※2018/01/28 追記。wp_title は WordPress4.4 以降から非推奨になったので、「wp_get_document_title」関数を使いましょう。
// functions.phpに以下を記述してページタイトルだけを呼び出せるように設定
add_theme_support( 'title-tag' );
function nohead_document_title($title){
if(!doing_action('wp_head')){
//doing_actionで、wp_headから呼ばれていない場合を判別
unset( $title['site'] ); //サイトタイトルを削除しページタイトルだけを残す
}
return $title;
}
add_filter('document_title_parts','nohead_document_title');
// body内の出力したい場所にこれを書く
<?php echo wp_get_document_title(); ?>
URL 無害化
URL として無効・危険な文字を防ぎたい場合は esc_url をつけても OK。
<?php echo esc_url( home_url() ); ?>
body にクラス付与
body 要素に class 属性をつけます。
<body <?php body_class( $class ); ?>>
img パス
画像のパスは使用頻度高し。
<?php echo get_template_directory_uri(); ?>
// 例
### style.cssのパス
bloginfo('stylesheet_url')は非推奨。get_stylesheet_uri()は、スタイルシートの URI を返します。
<?php echo get_stylesheet_uri(); ?>
// 例
<link rel="stylesheet" type="text/css" href="<?php echo get_stylesheet_uri(); ?>">
テンプレートパーツ組み込み
ページ内にあるバナーなど共通のコードを読み込む。
<?php get_template_part();?>
// 例 include/banner.php ファイルを読み込む
<?php get_template_part('include/banner');?>
グローバルナビゲーション
グローバルナビゲーションなどの中身は管理画面で変更できるように、カスタムメニューに登録します。以下はナビ名を gnav にして、コード内の div を消して ul をつけた例。後はフッターも同じ要領で追加しておく。
<?php
wp_nav_menu(
array(
'menu' => 'gnav',
'container' => '',
'items_wrap' => '<ul class="foo">%3$s</ul>'
)
);
?>
アーカイブ リスト
日付のアーカイブを出力。以下はカスタムポスト「news」のアーカイブ数を 12 ヶ月で表示させた場合。
<?php
$my_archives = array(
'type' => 'monthly',
'limit' => '12',//アーカイブ数を12ヶ月
'format' => 'html',
'before' => '',
'after' => '',
'show_post_count' => false,//投稿件数
'echo' => 1,
'order' => 'DESC',
'post_type' => 'news'
);
wp_get_archives( $my_archives );
?>
条件分岐
html / php を入れ込める if 文。
<?php if() : ?>
<?php elseif () :?>
<?php else : ?>
<?php endif; ?>
// 例
<?php if(is_page('profile')) : ?>
profileページの時、出力
<?php elseif (is_page('lp')) :?>
lpページの時、出力
<?php else : ?>
その他
<?php endif; ?>
ブラウザ判別
ブラウザ判別用の条件分岐。
<?php
global $is_IE;
if ( $is_IE ) {
// IE
}
?>
グローバル変数一覧
$is_iphone / iPhone Safari
$is_chrome / Chrome
$is_safari / Safari
$is_opera / Opera
$is_macIE / Mac IE
$is_winIE / Windows IE
$is_gecko / FireFox
$is_IE / IE
【WordPress】各ブラウザごとに条件分岐できるグローバル変数 - ONZE
グローバル変数 - WordPress Codex 日本語版
モバイル判別
モバイルの時だけ広告を表示したい時など。
<?php if ( wp_is_mobile() ) : ?>
<?php else: ?>
<?php endif; ?>
functions.php に関しては、WordPress の functions.php に書いておくと捗ることに書きました。合わせて読むと WordPress コーディングが捗ると思います。
以上、基本的ですが WordPress テーマ作成の時に知っておくと便利なテンプレートタグや条件分岐でした。