1. TOP
  2. Blog
  3. パンくずリストの構造化データをアクションフックで作成

パンくずリストの構造化データをアクションフックで作成

公開日:2020年12月2日 最終更新日:2020年12月2日

皆さんはパンくずリストを構造化データにしていますか?この記事では、パンくずリストの構造化データをアクションフックで作成する方法を書いています。

はじめに

先日、パンくずリストをプラグインで付けようとした所、AMPプラグインと競合して上手く働きませんでした。残念…。

仕方がないので、パンくずリストをアクションフックで自作する事にしました。なお、パンくずリストは構造化データにしておいた方が良さそうです。

ちなみに、記事自体も構造化データにしておいた方が良いそうです。googleの構造化データをアクションフックで作成

パンくずリストの構造化データをアクションフックで作成

ネットで色々見たところ、ウィンドミル様のページが一番参考になりました(ウィンドミル様のコードページ)。構造化データにするため、一部変更してアクションフックで作成しました。

下記は完成したコードです。このコードを子テーマのfunctionsに書いてみて下さい。


<?php
function breadcrumb(){
    global $post;
    $str ='';
    if(!is_home()&&!is_admin()){
        $str.= '<div itemscope itemtype="http://schema.org/BreadcrumbList">';
        $str.= '<div itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem" >';
        $str.= '<meta itemprop="position" content="1">';
        $str.= '<a itemprop="item" href="'. home_url() .'"><span itemprop="name">HOME</span></a> &gt;&#160;</div>';	
            if(is_page()){
                if($post -> post_parent != 0 ){
                    $ancestors = array_reverse(get_post_ancestors( $post->ID ));
                    foreach($ancestors as $ancestor){
                        $str.= '<div itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem" >';
	                    $str.= '<meta itemprop="position" content="2">';
                        $str.= '<a href="'. get_permalink($ancestor).'" itemprop="item"><span itemprop="name">'. get_the_title($ancestor) .'</span></a> &gt;&#160;</div>';
                    }
                }	
            } elseif(is_single()){
                $categories = get_the_category($post->ID);
                $cat = $categories[0];
                if($cat -> parent != 0){
                    $ancestors = array_reverse(get_ancestors( $cat -> cat_ID, 'category' ));
                    foreach($ancestors as $ancestor){
		                $str.= '<div itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem" >';
		                $str.= '<meta itemprop="position" content="2">';
		                $str.= '<a href="'. get_category_link($ancestor).'" itemprop="item"><span itemprop="name">'. get_cat_name($ancestor). '</span></a>→</div>';
                    }
                }
            $str.= '<div itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem" >';
            $str.= '<meta itemprop="position" content="2">';
            $str.= '<a href="'. get_category_link($cat -> term_id). '" itemprop="item"><span itemprop="name">'. $cat-> cat_name . '</span></a> &gt;&#160;</div>';		
            }
        $str.='<div>'. wp_title('', false) .'</div>';
    }
    echo $str;
}
?>

functionsに記入後、下のコードをパンくずリストを表示させたいページに書きます。AdInserterというプラグインを使えば、blockに書き写すだけで動きます。


<?php breadcrumb(); ?>

終わりに

アクションフックを使う事で、無事パンくずリスト及び構造化データを作成出来ました。他プラグインとパンくずリストのプラグインが競合して使えない方におすすめです。

以上、参考にしてみて下さい。