WordPress4.4以降のtitleタグ「wp_get_document_title」使い方

投稿：2017年07月19日｜更新：2017年10月24日

従来WordPressではサイトのタイトルを表示するのに「wp_title」の関数を使用していました。しかし、WordPress4.4以降から非推奨になりました。

これに変わって、「wp_get_document_title」関数が登場することになります。この関数はテンプレート.phpに記述するのではなく、functions.phpに記述して呼び出すシステムに変わりました。新しい関数に変わり格段にタイトルの表示方法が便利になりました。

従来の「wp_title」はサイトタイトルや個別記事ページのタイトルを余分に書かなくてはなりませんでした。例えば、次のような書き方です。

<title>
<?php wp_title( '|', true, 'right'); ?>
<?php bloginfo( 'name' ); ?>
</title>

<title>

<?php wp_title( '|', true, 'right'); ?>

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

</title>

この方法では記事を分割したときのページ２やページ３などは表示されないので、同じ重複タイトルが増えることになります。

新しい「wp_get_document_title」関数は一行コードを記述するだけで、トップページタイトルから個別記事ページタイトル、ページ２やページ３など全てのタイトルが簡単に表示できるため、使用が推奨されます。

なお、「wp_title」は非推奨となりましたが、今後も問題なく使い続けることはできます。まだまだ、「wp_title」を使ったWordPressサイトが多いためです。

しかし、「wp_get_document_title」関数の方が便利で簡単なので使い方をご紹介します。

「wp_get_document_title」へのタイトル移行はコードのコピー＆ペーストで一分も掛かりません。是非導入してください。

1 タイトルの設定方法
2 タイトルのカスタマイズ
3 まとめ

タイトルの設定方法

WordPress4.4以降にタイトルを記述する場合は、functions.phpに次のコードを記述します。

//titleの設定
add_theme_support( 'title-tag' );

1 2	//titleの設定 add_theme_support( 'title-tag' );

一行だけのコードのため使い方や設定は単純です。

これで、トップページタイトルは「サイトタイトル – サイトディスクリプション」になります。トップページ以外は「ページタイトル – サイトタイトル」になります。

因みに、トップページの２ページ目は「サイトタイトル – ページ2」となります。個別記事ページを<!–nextpage–>で分割した場合の２ページ目は「ページタイトル – ページ2 – サイトタイトル」となります。

タイトルのカスタマイズ

デフォルトのままでも良いですが少しコードを加えると更にタイトルをカスタマイズできます。

document_title_separator

ページタイトルとサイトタイトルを区切っているセパレートを「-」から「|」に変更する方法です。
以下のコードをfunctions.phpに追加します。

function wp_document_title_separator( $separator ) {
  $separator = '|';
  return $separator;
}
add_filter( 'document_title_separator', 'wp_document_title_separator' );

function wp_document_title_separator( $separator ) {

$separator = '|';

return $separator;

}

add_filter( 'document_title_separator', 'wp_document_title_separator' );

最近のサイト傾向としては、サイト名の区切りに「|」が使われることが多いようです。

「-」は繋ぐという意味を表しますが、「|」は区切るという意味を表します。ページタイトルとサイトタイトル明確に分けるためにも「|」を使う方が良いかと思います。

document_title_parts

デフォルトのままで使用すると、トップページタイトルは「サイトタイトル – サイトディスクリプション」になります。

殆どのサイトではサイトディスクリプションは要らないと思いますので削除します。

次のコードをfunctions.phpに追加します。

function wp_document_title_parts ( $title ) {
  if ( is_home() || is_front_page() ) {
    unset( $title['tagline'] );
  }
  return $title;
}
add_filter( 'document_title_parts', 'wp_document_title_parts', 10, 1 );

function wp_document_title_parts ( $title ) {

if ( is_home() || is_front_page() ) {

unset( $title['tagline'] );

}

return $title;

}

add_filter( 'document_title_parts', 'wp_document_title_parts', 10, 1 );

「is_home() || is_front_page()」はサイトのトップページを意味します。unsetでサイトディスクリプションの削除を意味します。

つまり、サイトのトップページではサイトディスクリプションを削除するといった意味になります。

$title[‘title’]	ページタイトル
$title[‘page’]	ページ２やページ３などを表すページ数
$title[‘tagline’]	サイトのディスクリプション
$title[‘site’]	サイトタイトル

pre_get_document_title

$titleで出力されるタイトルを変更したい場合は、次のコードをfunctions.phpに追加します。

function wp_pre_get_document_title( $title ) {
  if ( is_category( 'web' ) ) {
    $title = '〇〇';
  }
  return $title;
}
add_filter( 'pre_get_document_title', 'wp_pre_get_document_title' );

function wp_pre_get_document_title( $title ) {

if ( is_category( 'web' ) ) {

$title = '〇〇';

}

return $title;

}

add_filter( 'pre_get_document_title', 'wp_pre_get_document_title' );

is_categoryはカテゴリーを意味します。()内のwebは個別のカテゴリーのスラッグです。〇〇には変更後のタイトルを記述します。

「pre_get_document_title」は余り使う機会はないと思いますがカテゴリーページやタグページのタイトルを変えたいときに使います。

まとめ

「wp_get_document_title」を使うようになり一番便利に感じたのは、ページ２などが自動で出力されるようになったことです。

今までは長い記事を途中でを使って分割すると２ページ目も同じタイトルになるので対策として、functions.phpに複雑なコードを記述することもありました。

「wp_get_document_title」を使うようになり、「ページタイトル – ページ2 – サイトタイトル」と出力されるので手間隙が掛からなくなりました。

さて、ここまでの内容をもう一度おさらいします。「wp_get_document_title」を使いつつ、区切りを「|」にして、トップページのタイトルにディスクリプションを表示しない場合は以下のまとめた書き方になります。

//titleの設定
add_theme_support( 'title-tag' );
function wp_document_title_separator( $separator ) {
  $separator = '|';
  return $separator;
}
add_filter( 'document_title_separator', 'wp_document_title_separator' );
function wp_document_title_parts ( $title ) {
  if ( is_home() || is_front_page() ) {
    unset( $title['tagline'] );
  }
  return $title;
}
add_filter( 'document_title_parts', 'wp_document_title_parts', 10, 1 );

//titleの設定

add_theme_support( 'title-tag' );

function wp_document_title_separator( $separator ) {

$separator = '|';

return $separator;

}

add_filter( 'document_title_separator', 'wp_document_title_separator' );

function wp_document_title_parts ( $title ) {

if ( is_home() || is_front_page() ) {

unset( $title['tagline'] );

}

return $title;

}

add_filter( 'document_title_parts', 'wp_document_title_parts', 10, 1 );

以上がWordPress4.4以降のタイトルの記述方法です。

この記事に出てくる「is_home() || is_front_page()」や「is_category」を詳しく知りたい場合は以下の記事に記載しています。