4.WordPressで理想のURL構造にあったパンくずリストを作成する
理想のURL構造とパンくずリストの形
前回の更新で、理想のURL構造
- カスタム投稿名:book タクソノミー名:type
-
http://bookof.com/
http://bookof.com/book/
http://bookof.com/book/type_technical/
http://bookof.com/book/type_technical/pc/
http://bookof.com/book/type_technical/pc/web/
http://bookof.com/book/type_technical/pc/web/css/
http://bookof.com/book/type_technical/pc/web/css/page/2/
http://bookof.com/book/type_technical/pc/web/css/487311232X/
/カスタムタイプ名/タクソノミー名_親ターム名/子ターム名/孫ターム名/…/個別スラッグ/
でアクセスできるようになりました。
今回はこのURLにピッタリあったパンくずリストを作成するために「Breadcrumb NavXT」プラグインを使います。
上記のURLに対する理想のパンくずは下記のような形にります。
- http://bookof.com/book/type_technical/pc/web/css/
- ホーム > 本 > 参考書 > パソコン > ウェブ > css
- http://bookof.com/book/type_technical/pc/web/css/487311232X/
- ホーム > 本 > 参考書 > パソコン > ウェブ > css > 487311232X
の様な形。このように出来ればURLを直接いじってもパンくずリンクをクリックしても完全に同期できます。
「Breadcrumb NavXT」プラグインを入れる
ではまず「Breadcrumb NavXT」プラグインを入れて有効化してみましょう。
「Breadcrumb NavXT」プラグインはパンくずリストを作成してくれるプラグインですが、その投稿までの階層をカテゴリーベースにするか日付ベースにするかタグベースにするかなどが選択することが出来るのでとても助かります。
有効化すると、「設定」に「Breadcrumb NavXT」のメニューができるので、そこから設定の画面を開きます。
そうすると、「一般」「投稿タイプ」「タクソノミー」「その他」という4つのタブがあるので、そこから「投稿タイプ」を開く。
そこから、ページ・投稿・カスタム投稿等のパンくずリストの設定が出来ます。
その中から、今回の例場合は本(book)のカスタム投稿の設定を下記の様に変更します。
本テンプレート | パンくずリストのリンクありの場合のHTML |
---|---|
本テンプレート(リンクなし) | パンくずリストのリンクがない場合(該当のページが表示されている状態)のHTML |
本ルートページ | そのまま |
本アーカイブ表示 | チェック |
本階層表示 | チェック |
本階層 | 今回の場合はtypeにチェック |
上記の設定で、URLと同じくtypeのタクソノミーの親子関係をもったパンくずリストが出来たと思います。
しかし、このままではパンくずリンクをクリックした際に元のディレクトリが余っているURLに飛んでしまうので、そこを修正するためのカスタマイズも行いましょう
get_term_linkをカスタマイズ
パンくずリストは出来て、リンク構造とあった形には出来たものの、このままではパンくずリンクをクリックした時のURLが元のままです。
なのでそこを修正していきます。
「Breadcrumb NavXT」はプラグインの方でフックがあるので、特別な処理を行う場合はフックからカスタマイズ出来るのですが、「Breadcrumb NavXT」はどうやってパンくずリストの各リンクのURLを作っているのかなとプラグインを見てみると、
$breadcrumb->set_url(get_term_link($term, $term->taxonomy));
と、get_term_linkリンクで持ってきているらしい。
ということでここをget_term_linkで吐き出されるURLを変えればプラグインのリンクも変わるっぽい。
因みに管理画面から各タームを「表示」で確認する部分も同じくget_term_linkをカスタマイズすれば治ります。
get_term_linkには、term_linkというフィルターフックが用意されているので、そこに引っ掛けてURLを変更してしまえばよさそうです。
具体的なコードは下記の通り。
function GetTermParents($term, $parent = '') { //親タームがあるならURLに含める関数③ $parents = ''; if ( $term->parent == 0 ) { //親タームがなかったら(一番親だったら) $parents = $term->taxonomy . '_' . $term->slug . '/' . $parent; //タクソノミー名_ターム名の形を作る } else { //親があったら $parentterm = get_term_by('id', $term->parent, $term->taxonomy); //親タームを持ってくる $parent = $term->slug . '/' . $parent; //URLに足して $parents = GetTermParents($parentterm, $parent); //もっかい確認する } return $parents; //出来上がったURLを返す } function MyTermLink($termlink, $term, $taxonomy) { //引数:タームのURL,タームオブジェクト,タクソノミー名② $parents = GetTermParents($term); //該当タームまでの間の親ターム等を持ってくる $newlink = home_url('/') . get_taxonomy($taxonomy)->object_type[0] . '/' .$parents; //URL作成 return $newlink; } add_filter('term_link','MyTermLink', 10, 3); //term_linkにMyTermLink関数を引っ掛ける①
簡単に説明すると、①でterm_link
フックに新しいURLに変更する関数を引っ掛けて、②で新しいURLを作成、途中の
/タクソノミー名_親ターム名/子ターム名/孫ターム名/
の部分は③の関数で再帰的に親を探してくっつけていく。
これで今回の目的であったURL構造とパンくずリストは完成しました。
- http://bookof.com/
- ホーム
- http://bookof.com/book/
- ホーム > 本
- http://bookof.com/book/type_technical/
- ホーム > 本 > 参考書
- http://bookof.com/book/type_technical/pc/
- ホーム > 本 > 参考書 > パソコン
- http://bookof.com/book/type_technical/pc/web/
- ホーム > 本 > 参考書 > パソコン > ウェブ
- http://bookof.com/book/type_technical/pc/web/css/
- ホーム > 本 > 参考書 > パソコン > ウェブ > css
- http://bookof.com/book/type_technical/pc/web/css/487311232X/
- ホーム > 本 > 参考書 > パソコン > ウェブ > css > 487311232X
昔のバージョンのは忘れましたが、今の「Breadcrumb NavXT」プラグインはデフォルトの設定で構造化マークアップが入っているみたいなので、マークアップを消しちゃわないようにうまい具合にやってください。
まとめ・注意・問題点
以上で一応は「GOOGLE検索エンジン最適化スターターガイド」に書いてあるURLの構造をWordPressで実現することが出来ました。
しかし、ここまでやる必要はあるのだろうか?と思ってしまうのも事実!
そこまで効果があるか解らないが効果があるかもしれない事をコツコツとやっていくことが今のSEO対策だとは思います。
構造化マークアップやhttpsや画像の読み込み方やディレクトリ構造等、やることがいっぱいありますが、一つ一つは小さな影響しかなさそうです。
今回のディレクトリ構造とURL構造とパンくずリストの形はその中でも大きなものとは思いますが、WordPressの基本のルールを曲げて、余計なプログラムを回してまでやるのはどうなのかなとも思ったりもします。
今回はページ読み込み速度などの問題は気にしないでやってみましたが、負荷とかもどんなもんなんでしょうか。
- 実現したい事と
- 実現した場合のメリットと
- 実現した場合のデメリットを
ちゃんと考えてからやらないとだめですねーと思いました。