WordpressでページネーションSEOのrel prev/next とcanonicalを実装する
2017-09-12 2017-09-13
Google様は検索ロボットがページ構成をちゃんと理解できるよう、ページネーションを伴ったページ遷移に対しては、「link rel=”prev”」「link rel=”next”」タグを使えとおっしゃられています。
ところが、これの設定がかなりめんどくさい。特にWordpressは凄くめんどくさい。pathを取得する関数が大量にある割に、本当に取りたいpathが中々取れなくて本当にめんどくさい。
ということで、canonical出力も合わせて一つの関数にまとめてみました。
コピペで使えるようにしてあるので、参考にしてください。
rel=”prev”、rel=”next”の意味
その前に、最低限の意味だけ説明しておきます。
|
1 |
<link rel="next" href="http://suzumenote.com/page/3"> |
「rel=”next”」は、「このページの次のページのURLはこれです」という意思表示のようなものです。上の例だと、「/page/3」が次のページということになっているので、今表示されているページは「/page/2」です。
ページネーションを利用した一覧画面において、今表示しているページの次のページのURLを指定するのが「rel=”next”」ということです。
|
1 |
<link rel="prev" href="http://suzumenote.com/page/2"> |
「rel=”prev”」は「このページの前のページのURLはこれです」という意思表示のようなものです。上の例だと「/page/2」が前のページということになっているので、今表示されているページは「/page/3」です。
ページネーションを利用した一覧画面において、今表示しているページの前のページのURLを指定するのが「rel=”next”」ということです。
めんどくさい部分
WordPressに限らず、「rel prev/next」の設定にはめんどくさい点があります。
一つ目は、最初のページ、最後のページにおいて、prevかnextどちらかが必要なくなるという点です。
ページネーションの最初のページでは、前のページが無いため「rel=”prev”」のタグが必要ありません。逆に、ページネーションの最後のページでは、次のページが無いため「rel=”next”」のタグが必要なくなります。今表示しているページはページネーションの最初のページなのか、最後のページなのか、どちらでもないのか、判定を入れる必要があります。
二つ目は、1ページ目の存在です。
例えばこのサイトのTOPページのURLは「http://suzumenote.com」ですが、ページ下部にあるページネーションから2ページ目に飛ぶと、そのページのURLは「http://suzumenote.com/page/2」になっていることが確認出来ます。
単純にプログラムを組むと、prevのURLは「http://suzumenote.com/page/1」になってしまいますが、そこは「http://suzumenote.com」にしたいと思うのが人情です。
また、Wordpressのページネーションでは、1ページ目を「/page/1」と表示してしまいます。「http://suzumenote.com」が表示されている時と、「http://suzumenote.com/page/1」が表示されている時、両方を考慮する必要があります。めんどくさい。
コピペで利用できるソース(※注意点有り)
function.php
|
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 |
/* * canonical/rel="prev"/rel="next"を生成して出力する */ function canonical_prev_next() { if( is_home() || is_front_page() ) { // TOPページのURL生成 $base_url = home_url(); } elseif ( is_category() ) { // カテゴリ一覧ページのURL生成 $base_url = get_category_link( get_query_var('cat') ); } elseif ( is_tag() ) { // タグ一覧ページのURL生成 $tag = get_term_by( 'name', urldecode( get_query_var('tag') ), 'post_tag' ); $base_url = get_tag_link( $tag->term_id ); } elseif ( is_search() ) { // 検索一覧ページのURL生成 $base_url = get_search_link(); } elseif ( is_page() || is_single() ) { // 個別記事ページのURL生成 $base_url = get_permalink(); } if($base_url) { // グローバル変数を使う global $wp_query; // 現在表示されているのページ番号を取得 $page = get_query_var('paged'); // ページネーションの最終ページ番号を取得 $max_num = $wp_query->max_num_pages; // canonical生成 $canonical_href = $base_url; if($page > 1) { // 2ページ目以降の場合 $canonical_href .= '/page/'.$page; } // canonical echo '<link rel="canonical" href="'.$canonical_href.'">'.PHP_EOL; if( is_home() || is_front_page() || is_archive()) { // TOPページにページネーションが無い場合は、このif文はis_archiveのみ if($page == 2) { // 現在表示されているページが2ページ目の場合 echo '<link rel="prev" href="'.$base_url.'">'.PHP_EOL; } elseif($page > 2) { // 現在表示されているページが3ページ目以降の場合 $prev_count = $page - 1; echo '<link rel="prev" href="'.$base_url.'/page/'.$prev_count.'">'.PHP_EOL; } if($max_num > $page) { // まだ先のページがある場合 if($page == 0) { // 現在表示されているページがパラメータの無い1ページ目の場合 echo '<link rel="next" href="'.$base_url.'/page/2">'.PHP_EOL; } else { $next_count = $page + 1; echo '<link rel="next" href="'.$base_url.'/page/'.$next_count.'">'.PHP_EOL; } } } } } |
|
1 |
<?php canonical_prev_next(); ?> |
functions.phpにcanonical_prev_nextの関数を追加して、header.phpのhead部に上の関数を1行入れれば動きます。
「関数名とか変数名がダサい」
「if文がスマートじゃない」
など色々言いたいことはあるかと思いますが、良いんだよWordpressなんてこんなもんで。
TOPページにページネーションがある前提になっているので、無い方はコメント読んで調整してください。if文1行変えるだけです。
