前々からつくろうと思っていた自分のブログをようやく作り始めました。
今回はWordPressで構築することに。
WordPressでブログサイト構築をしていく中で、今まで自分が行ってきた方法とは違うものを少し取り入れていこうと考えています。その一環として、head内に記述するtitleタグを変更してみたいと思います。
titleタグとは
titleタグはhtmlタグの1つで、表示されているページのタイトルを表すものです。
記入する場所はhead内。その中でも、できるだけ上のほうが良いのかなと思っています。
ちなみに個人的にはhead内はこんな順番で並べていることが多いです。
<head>
<meta charaset="utf-8">
<title>ここにタイトルが入ります</title>
<link rel="stylesheet" href="cssファイルへのパス" type="text/css">
</head>
端折った項目もありますが、こんなかんじです。
従来の書き方
今までWordPressでサイト構築をするときはどこにtitleタグを書いていたのかと言うと、上記htmlコードと同じくhead内に書いていました。
そして、トップページを表示しているときは「サイトのタイトル」のみ表示。その他のページ(シングルページや固定ページ、カテゴリーページなど)を表示したときには、「ページタイトル|サイトタイトル」の形で表示をしていました。
ページタイトルとサイトタイトルを区切る記号はそれぞれですが、かなり多くのサイトで使っている表示方法ではないでしょうか。
これをWordPressのコードに直すとこんな感じ。
<head>
<title><?php wp_title('|', true, 'right'); ?><?php bloginfo('name'); ?></title>
</head>
bloginfo()でブログタイトルを呼び出し。
wp_title()でページタイトルを呼び出し。
wp_titleのパラメーターで、ブログタイトルとの区切り線の設定や、区切り線の表示位置なども決めています。詳しい内容は公式サイトを見ていただけたらと思います。
参考サイト:テンプレートタグ/bloginfo - WordPress Codex 日本語版
参考サイト:テンプレートタグ/wp title - WordPress Codex 日本語版
今回、採用した書き方
従来の書き方でも全く問題無いと思います。ですが今回は新しい試みということで、最新の公式テーマ「Twenty Fifteen」で使われているtitleタグの出し方を採用しました。
それは今までのようにhead内にtitleタグを書き、その中にテンプレートタグを書いていくということは行いません。
今回、どこで設定をするのかというと、functions.phpの中で設定を行います。
functions.phpの中に1行追加するだけ!
add_theme_support('title-tag');
この1行を追加するだけでOK!
ページを表示すると従来の書き方と同じように表示してくれました。
注意事項
この方法、functions.phpに1行追加するだけで使えてすごく便利です。
が、ひとつ注意事項があります。
それは、WordPressのバージョン。
バージョンが4.1と2015年3月5日現在で最新バージョン(ひとつまえ?)のwordpressでなければ使えません。
あまりアップデートをされずにWordPressを使っている方のところでは使えないこともあるので気をつけてください。