add_theme_supportでタイトルを任意に書き換える

ワードプレス標準のテーマtwentynineteenなどのheader.phpを見るとタイトルタグの記述がないことに気がつきます。これはワードプレス4.1から利用可能になったadd_theme_support('title-tag')を使用していることが理由です。wp_titleに代わるこの組み込み関数を使ったタイトルの書き換え方法を確認していきます。

2019年2月26日

add_theme_supportの有効化

まずは完成形の確認です。当サイトを例に解説していきますが最終的に下記のようにタイトルを書き換えたいと思います。

トップページ・・・株式会社リンジー
記事ページ・・・【ワードプレス】記事タイトル | わりとよくあるワードプレスのカスタマイズ
上記以外・・・ページタイトル | 株式会社リンジー

まずはfunctions.phpに下記の記述を追加しadd_theme_supportを有効化します。

■functions.php

add_theme_support('title-tag');

これによってタイトルがどう表記されるか一旦確認してみます。

トップページ・・・株式会社リンジー - ディスクリプション
記事ページ・・・記事タイトル - 株式会社リンジー
上記以外・・・ページタイトル - 株式会社リンジー

トップページのタイトル書き換え

トップページのタイトルにディスクリプションが表記されてしまいますのでこれを削除してサイト名だけにしてみたいと思います。コーデックスを見てみると$titleのtaglineプロパティがディスクリプションであると書かれていますので、このプロパティの値を空白（空文字）に書き換えればディスクリプションがなくなるはずです（下記3行目）。document_title_partsというフィルターフックを使用して書き換えます。
・document_title_parts | Hook | WordPress Developer Resources

■functions.php

function rewrite_title($title) {
  if (is_home()) {
      $title['tagline'] = '';
    }
  return $title;
  }
add_filter('document_title_parts', 'rewrite_title');

記事ページのタイトル書き換え

次に記事ページのタイトルを書き換えます。同じくコーデックスによると記事ページのタイトルは$titleのtitleプロパティで、サイト名はトップページ以外ではsiteプロパティであると書かれていますので、これを踏まえて書き換えてみます。当サイトでは記事ページはカスタム投稿のwordpress_customizeとなっていますので下記のような記述になります。

■functions.php

function rewrite_title($title) {
  if (is_singular('wordpress_customize')) {
      $title['title'] = '【ワードプレス】' . $title['title'];
      $title['site'] = 'わりとよくあるワードプレスのカスタマイズ';
    }
  return $title;
  }
add_filter('document_title_parts', 'rewrite_title');

トップページと記事ページのタイトルの書き換えを合わせて書くと以下のようになります。

■functions.php

function rewrite_title($title) {
	if (is_home()) {
		$title['tagline'] = '';
	} else if (is_singular('wordpress_customize')) {
		$title['title'] = '【ワードプレス】' . $title['title'];
		$title['site'] = 'わりとよくあるワードプレスのカスタマイズ';
	}
	return $title;
	}
add_filter('document_title_parts', 'rewrite_title');

これで下記のようなほぼ完成形になりました。

トップページ・・・株式会社リンジー
記事ページ・・・【ワードプレス】記事タイトル - わりとよくあるワードプレスのカスタマイズ
上記以外・・・ページタイトル - 株式会社リンジー

区切り文字の書き換え

仕上げに区切り文字を「-」から「|」に変えてみます。フィルターフックdocument_title_separatorを使用します。
・document_title_separator | Hook | WordPress Developer Resources

■functions.php

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

トップページ・・・株式会社リンジー
記事ページ・・・【ワードプレス】記事タイトル | わりとよくあるワードプレスのカスタマイズ
上記以外・・・ページタイトル | 株式会社リンジー

これで想定通りのタイトルになりました。プラグインAll In One SEO Packなどでもタイトルの書き換えは可能ですが、こうしたfunctions.phpを使用した書き換えも覚えておくとなにかと便利でしょう。ちなみに上記と同じことをwp_titleを使って記述する場合は以下のようになります。ご参考ください。

■header.php

<title><?php
if (is_singular('wordpress_customize')) {
		echo '【ワードプレス】'; wp_title('|',true,'right'); echo 'わりとよくあるワードプレスのカスタマイズ';
	} else if (is_home()) {
		bloginfo('name');
	} else {
		wp_title('|',true,'right'); bloginfo('name');
	}
?></title>

以上で「add_theme_supportでタイトルを任意に書き換える」の解説を終わります。