WordPressでSEOに強い(title/description)の設定コード紹介
WordPressでSEOに強いtitleとdescriptionの設定コードをご紹介致します。サーチコンソールでエラーを出さないことを心がけた弊社が普段よく使っている形式のコードになります。
以下のコードをheader.phpの<head></head>内に記載します。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 |
<!--(1)トップページ--> <?php if(is_home()): ?> <title>株式会社サンプル | 食品サンプル開発製作</title> <meta name="description" content="食品サンプル制作・開発会社、株式会社サンプルのホームページです。◯◯事業や◯◯事業を行い……120文字程度に" /> <!--(2)single.php--> <?php elseif(is_single()): ?> <?php if(get_field("title")): ?> <title><?php echo the_field('title'); ?></title> <?php else: ?> <title><?php the_title(); ?> | 食品サンプルの株式会社サンプル</title> <?php endif; ?> <?php if(get_field("description")): ?> <meta name="description" content="<?php echo the_field('description'); ?>" /> <?php else: ?> <meta name="description" content="<?php if(have_posts()): ?><?php while(have_posts()): the_post(); ?><?php $des = get_the_content(); $des = strip_tags($des); $des = str_replace(array("\r\n"," "), '', $des); $desp = mb_substr($des, 0, 120, "UTF-8"); echo $desp; ?><?php endwhile; ?><?php endif; ?>" /> <?php endif; ?> <!--(3)category.php--> <?php elseif(is_category()): ?> <?php if(!is_paged()): ?> <?php $cat_id = get_queried_object()->cat_ID; $post_id = 'category_'.$cat_id; ?> <title><?php single_cat_title( '', true ); ?> | 食品サンプルの株式会社サンプル</title> <meta name="description" content="<?php $cat_id = get_queried_object()->cat_ID; $post_id = 'category_'.$cat_id; $text = category_description(); $text = strip_tags($text); $text = mb_substr($text, 0, 120, "UTF-8"); echo $text; ?>" /> <?php else: ?> <title><?php show_page_number(''); ?>ページ目 <?php single_cat_title( '', true ); ?> | 食品サンプルの株式会社サンプル</title> <?php endif; ?> <!--(4)固定ページ--> <?php elseif(is_page()): ?> <?php if(get_field("title")): ?> <title><?php echo the_field('title'); ?></title> <?php else: ?> <title><?php the_title(); ?> | 食品サンプルの株式会社サンプル</title> <?php endif; ?> <?php if(get_field("description")): ?> <meta name="description" content="<?php echo the_field('description'); ?>" /> <?php else: ?> <meta name="description" content="食品サンプル制作・開発会社、株式会社サンプルの<?php the_title(); ?>ページです。" /> <?php endif; ?> <!--(5)検索結果ページ--> <?php elseif(is_search()): ?> <title>検索結果 | 食品サンプルの株式会社サンプル</title> <!--(6)404ページ--> <?php elseif(is_404()): ?> <title>お探しのページはございません | 食品サンプルの株式会社サンプル</title> <!--(7)その他--> <?php else: ?> <title><?php the_title(); ?> | 食品サンプルの株式会社サンプル</title> <meta name="description" content="食品サンプル制作・開発会社、株式会社サンプルの<?php the_title(); ?>ページです。" /> <?php endif; ?> |
01_上記コードを動かす為に必要な設定
Advanced custom Fieldsのインストール&有効化
まずひとつ目が以下のAdvanced Custom Fieldsのプラグインをインストールして有効化する必要があります。8行目、9行目辺りで使っている、「the_field」が以下のプラグイン固有のコードの為です。何故このプラグインを使っているかは後ほど説明致します。
SEO豆知識:Advanced custom fieldsについて
WordPressがデフォルトで持っているカスタムフィールドの機能を非常に使いやすくしているプラグインで、カスタムフィード系のプラグインの中では最も普及しています。カスタムフィールドなので、通常のカスタムフィールドの出力も有効になり、
1 |
<?php echo the_field('title'); ?> |
こちらのコードは
1 |
<?php echo get_post_meta($post->ID , 'title' ,true); ?> |
この様に置き換えることができます。
function.phpに以下のコードを追加
1 2 3 4 5 6 7 8 |
//現在のページ数の取得 function show_page_number() { global $wp_query; $paged = (get_query_var('paged')) ? get_query_var('paged') : 1; $max_page = $wp_query->max_num_pages; echo $paged; } |
こちらは42行目にあるshow_page_numberを動かす為に必要な関数です。
02_(1)〜(7)の各項目について解説
最上部にあるtitle/descriptionの制御コードについてそれぞれ説明を行います。
(1)トップページについて
1 2 3 4 |
<!--(1)トップページ--> <?php if(is_home()): ?> <title>株式会社サンプル | 食品サンプル開発製作</title> <meta name="description" content="食品サンプル制作・開発会社、株式会社サンプルのホームページです。◯◯事業や◯◯事業を行い……120文字程度に" /> |
こちらはトップページの場合のtitleとdescriptionになります。「<php if(is_home()) ;?>」とありますが、これは「もしトップページだったら」という条件を宣言するphpの構文になります。
(2)single.phpについて
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
<!--(2)single.php--> <?php elseif(is_single()): ?> <?php if(get_field("title")): ?> <title><?php echo the_field('title'); ?></title> <?php else: ?> <title><?php the_title(); ?> | 食品サンプルの株式会社サンプル</title> <?php endif; ?> <?php if(get_field("description")): ?> <meta name="description" content="<?php echo the_field('description'); ?>" /> <?php else: ?> <meta name="description" content="<?php if(have_posts()): ?><?php while(have_posts()): the_post(); ?><?php $des = get_the_content(); $des = strip_tags($des); $des = str_replace(array("\r\n"," "), '', $des); $desp = mb_substr($des, 0, 120, "UTF-8"); echo $desp; ?><?php endwhile; ?><?php endif; ?>" /> <?php endif; ?> |
こちらは個別の記事ページの場合のtitleとdescriptionの制御コードです。
titleについて
1 |
<?php if(get_field("title")): ?> |
こちらがはもしこの記事ページが「カスタムフィールド:titleの値を持っている場合(※A)」という条件分岐になり、存在する場合は、以下コードでカスタムフィールドの値を出力
1 |
<title><?php echo the_field('title'); ?></title> |
存在しない場合は、
1 |
<title><?php the_title(); ?> | 食品サンプルの株式会社サンプル</title> |
投稿のタイトルが自動で反映され” | “以降は決まり文句が入る、という設定になっています。
(※A)値を持っている場合
Advanced custom fieldsで、「title」「description」という名前のフォームを制作します。上図の様に各投稿ページに入力フォームが出てきますので、そちらに内容を記載して更新しましょう。上図だと、titleは空で、descriptionは値があるということになります。
descriptionについて
同じく、もしこの記事ページが「カスタムフィールド:descriptionの値を持っている場合」は、以下コードでカスタムフィールドの値を出力
1 |
<meta name="description" content="<?php echo the_field('description'); ?>" /> |
存在しない場合は、本文最初の120文字を抜粋してdescriptionに設定しています。以下にコードの解説を載せています。
1 |
$des = get_the_content(); |
本文の内容を取得して、
1 |
$des = strip_tags($des); |
htmlのタグなどを削除して、
1 |
$des = str_replace(array("\r\n"," "), '', $des); |
空白や改行をなくし、
1 |
$desp = mb_substr($des, 0, 120, "UTF-8"); |
最初の120文字(日本語対応)を取得。
最後に、取得した情報を出力しています。
(3)category.phpについて
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
<!--(3)category.php--> <?php elseif(is_category()): ?> <?php if(!is_paged()): ?> <?php $cat_id = get_queried_object()->cat_ID; $post_id = 'category_'.$cat_id; ?> <title><?php single_cat_title( '', true ); ?> | 食品サンプルの株式会社サンプル</title> <meta name="description" content="<?php $cat_id = get_queried_object()->cat_ID; $post_id = 'category_'.$cat_id; $text = category_description(); $text = strip_tags($text); $text = mb_substr($text, 0, 120, "UTF-8"); echo $text; ?>" /> <?php else: ?> <title><?php show_page_number(''); ?>ページ目 <?php single_cat_title( '', true ); ?> | 食品サンプルの株式会社サンプル</title> <?php endif; ?> |
こちらは前記事:カテゴリーページのSEOを強化する方法にそったコードになっています。「!is_paged()」は1ページ目の場合という条件分岐で、1ページ目はのタイトルは、
1 |
<title><?php single_cat_title( '', true ); ?> | 食品サンプルの株式会社サンプル</title> |
当該カテゴリー名の後に定型文が入る様になっています。そしてdescriptionは、
1 |
category_description(); |
カテゴリーの[説明]の内容を出力しています。2ページ目以降は前記事の考え方で言うと、titleもdescriptionも不要ですが、ページが存在している以上論理的にtitleは必要になります。そこで、
1 |
<title><?php show_page_number(''); ?>ページ目 <?php single_cat_title( '', true ); ?> | 食品サンプルの株式会社サンプル</title> |
上記コードで「○ページ目[カテゴリー名][定型文]」を出力してtitleの重複を防ぎます。
(4)固定ページについて
1 2 3 4 5 6 7 8 9 10 11 12 |
<!--(4)固定ページ--> <?php elseif(is_page()): ?> <?php if(get_field("title")): ?> <title><?php echo the_field('title'); ?></title> <?php else: ?> <title><?php the_title(); ?> | 食品サンプルの株式会社サンプル</title> <?php endif; ?> <?php if(get_field("description")): ?> <meta name="description" content="<?php echo the_field('description'); ?>" /> <?php else: ?> <meta name="description" content="食品サンプル制作・開発会社、株式会社サンプルの<?php the_title(); ?>ページです。" /> <?php endif; ?> |
こちらはsingle.phpの場合と同じです。カスタムフィールドのtitleに内容があればそちらが優先されなければタイトルが自動でtitleに反映されます。descriptionも同様です。
(5)検索結果ページについて
1 2 3 4 |
<!--(5)検索結果ページ--> <?php elseif(is_search()): ?> <title>検索結果 | 食品サンプルの株式会社サンプル</title> |
特定の検索結果ページをインデックスさせたい場合は、より細かく制御し、検索結果ページをサイトマップに追加したりしますが、通常のホームページ運用においてはこちらのコードで十分です。
(6)404ページについて
1 2 3 |
<!--(6)404ページ--> <?php elseif(is_404()): ?> <title>お探しのページはございません | 食品サンプルの株式会社サンプル</title> |
こちらは404ページの制御です。基本的にこの箇所のtitleはSEOに関わりません。その為descriptionの記載もありません。
(7)その他について
1 2 3 4 |
<!--(7)その他--> <?php else: ?> <title><?php the_title(); ?> | 食品サンプルの株式会社サンプル</title> <meta name="description" content="食品サンプル制作・開発会社、株式会社サンプルの<?php the_title(); ?>ページです。" /> |
基本的にはこのコードは使われない想定です。想定外のページが出現した場合にtitleやdescriptionが空にならないような対処になっています。想定外のページについては、別途条件分岐をして都度正しいtitleとdescriptionの設定を行います。
03_この他にも作者別、月別アーカイブの設定をする場合があります
上記のコードで全てではなく、アーカイブのページの種類などによってもコードの量は変わってきます。あくまで最低限の内容が網羅されていると理解を頂ければ幸いです。ただし個々の記事ページや、カテゴリーページ(アーカイブページ)に関する基本的な考え方は同じです。