マルチサイトでパンくずリスト(構造化データBreadcrumb:マークアップ:data-vocabulary.org)

ワードプレスのマルチサイトで、googleなどの検索エンジンに認識されるパンくずリストのコード作成例です。個別投稿記事(single.php)、カテゴリーページ、子サイトトップページで表示されます。ただし、親サイトのトップページと固定ページ(page.php)では属するカテゴリーがないため、表示されません。当サイトでは現在、このコードで動いています。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
#breadcrumbs{
margin:0;
color:#777;
font-size:13px;
}
div#breadcrumbs div {
display: inline;
}
#breadcrumbs span.sp{
margin:0 7px;
color:#ff8000;
}
#breadcrumbs a{
text-decoration:none;
color: #777;
color:#0000ff;
}
8行目で「display: inline;」と記述して、横並びにしています。
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
// カテゴリからIDとタイトルを取得
$category = get_the_category();
$cat_id = $category[0]->cat_ID;
$cat_name = $category[0]->cat_name;
// リストで使う各タイトルとタグを設定
$home = 'ホーム';
$bloginfo_name = get_bloginfo('name');
$cat_title='<span class="sp">></span><a href="'.esc_url(get_category_link($cat_id)).'" itemprop="url"><span itemprop="title">'.$cat_name.'</span></a>';
$post_title='<span class="sp">></span><span>'.mb_substr(get_the_title(), 0, 10, 'utf-8').'・・・</span>';
$category_title='<span class="sp">></span>'.$cat_name;
// リストで使う各URLを設定
$category_url=(is_ssl() ? 'https://' : 'http://').$_SERVER["HTTP_HOST"].$_SERVER["REQUEST_URI"];
$network_url = network_home_url();
$home_url = esc_url(home_url( '/' ));
// 親サイトと子サイトを条件分岐
if(is_main_site()){
// 親サイトのトップページを除外
if(!is_home()){
$content = <<<EOT
<div id="breadcrumbs">
<div itemtype="http://data-vocabulary.org/Breadcrumb" itemscope="">
<a href="{$home_url}" itemprop="url"><span itemprop="title">{$home}</span></a>
</div>
EOT;
}
}else{ // ここから子サイトの処理
$content = <<<EOT
<div id="breadcrumbs">
<div itemtype="http://data-vocabulary.org/Breadcrumb" itemscope="">
<a href="{$network_url}" itemprop="url"><span itemprop="title">{$home}</span></a>
<span class="sp">></span>
</div>
<div itemtype="http://data-vocabulary.org/Breadcrumb" itemscope="">
<a href="{$home_url}" itemprop="url"><span itemprop="title">{$bloginfo_name}</span></a>
</div>
EOT;
}
// single pageの処理
if(is_single()){
echo $content;
echo <<<EOT
<div itemtype="http://data-vocabulary.org/Breadcrumb" itemscope="">{$cat_title}</div>
{$post_title}
</div>
<!-- #breadcrumb -->
EOT;
}
// categoryの処理
if(is_category()){
echo $content;
echo <<<EOT
<div itemtype="http://data-vocabulary.org/Breadcrumb" itemscope="">
<a href="{$category_url}" itemprop="url"><span itemprop="title">{$category_title}</span></a>
</div>
</div>
<!-- #breadcrumb -->
EOT;
}
// 親サイトのhome以外の子サイトのhomeの処理
if(is_home()&&!is_main_site()){
echo $content;
echo <<<EOT
</div>
<!-- #breadcrumb -->
EOT;
}
実行結果:<a href="/" style="color:#0000ff;">ホーム</a> > <a href="/c2/" style="color:#0000ff;">サンプルコード</a> > <a href="/c2/category/wordpress/" style="color:#0000ff;">WordPress</a> > マルチサイトでパンく・・・

ワードプレスのマルチサイトでのパンくずリスト

3行目から5行目にかけてはWordPressのテンプレート関数からカテゴリーの情報を引き出しています。4行目は投稿ID、5行目はカテゴリーのタイトルを取得しています。7行目から11行目にかけては、リストで横並びに「>」で区切られて表示される文字列の設定です。実際の投稿記事では「ホーム」「子サイトトップページ」「カテゴリ名」「投稿記事タイトル」の順番で表示され、カテゴリーページでは、「ホーム」「子サイトトップページ」「カテゴリ名」、子サイトのトップページでは「ホーム」「子サイトトップページ」という順番で表示されます。

10行目では、「mb_substr」関数を使って、個別記事タイトルの文字を10文字に制限し、その後方に「・・・」と付け加えています。「mb_substr」は、「mb_substr(文字列, 開始位置, 取得する最大文字数, 文字コード)」の書式で、半角も全角も一文字として処理されます。似たようなものでは、「substr」と「mb_strimwidth」という関数もあります。「substr」の書式は「substr(文字列, 開始位置, 取得する最大文字数)」、「mb_strimwidth」の書式は「mb_strimwidth(文字列, 開始位置, 取得する最大文字数, 追加文字, 文字コード)」です。いずれも半角は一文字、全角は二文字として処理されます。

13行目はif文を省略した三項演算子を使って、httpsかhttpかを見分けて代入しています。この演算子の書式は、「条件式 ? 値1 : 値2;」です。条件式からtrueが渡されると値1を返し、falseが渡されると値2を返します。そのため、条件式はtrueかfalseを返す式でないと動作しません。is_ssl()は、SLLであればturueを返し、そうでない場合はfalseが返されます。

また、「$category_url=(is_ssl() ? 'https://' : 'http://').$_SERVER["HTTP_HOST"].$_SERVER["REQUEST_URI"];」を使わなくても「$category_url=(empty($_SERVER["HTTPS"]) ? "http://" : "https://").$_SERVER["HTTP_HOST"].$_SERVER["REQUEST_URI"];」の書式で動作します。「empty()」は変数が空であるかどうかを検査する関数であり、空であれば「true」となり、「条件式 ? 値1 : 値2;」の内、値1を返します。この「empty($_SERVER["HTTPS"])」は、「 !isset($_SERVER["HTTPS"])」としても同じことを意味し、更に「($_SERVER["HTTPS"] == false)」としても同じ結果が得られます。

「$category_url」は、カテゴリーページのURLを取得するために使っており、ワードプレスで用意されている「get_permalink()」を使ってもカテゴリーページにおいてはループ中に最初に呼び出されたURLが返されます。そのため、上記のような書式で取得しています。

17行目の「is_main_site()」は、親サイトか子サイトかを調べるテンプレート関数です。この条件分岐の中で更に親サイトのトップページのみを「!is_home()」で除外しています。

40行目は、「is_single()」によって投稿記事のみに限定しています。50行目では、「is_category()」を使って、カテゴリーページのみに限定し、61行目では、各ブログの中で親サイトのみ除外し、その他の子サイトでは表示されるようにしています。つまり、各ブログのトップページは「is_home()」で許可し、「&&演算子」に続く否定の「!is_main_site()」によって親サイトは除外されています。