WordPressで構造化データ(schema.org用)のJSON-LDを<head>内に出力する関数です。function.phpに追記してください。
ネットで調べてみると似たようなコードはいくつかありましたが、複数の添付画像・複数のカテゴリーに対応したものが無かったので自作しました。
function insert_json_ld_for_schema_org()
{
if( !is_single() || !have_posts() ) {
return;
}
//あなたのサイトのロゴ画像をここで設定してください
$logo = array(
'@type' => 'ImageObject',
'url' => 'http://*****/****.jpg',
'width' => '240',
'height' => '80'
);
while (have_posts()) {
the_post();
$category_info = get_the_category();
if( count($category_info) > 1 ) {
$articleSection = array();
foreach( $category_info as $ct )
{
$articleSection[] = $ct->name;
}
} else {
$articleSection = $category_info[0]->name;
}
//添付画像を取得
$attachments = get_children( array( 'post_parent' => get_the_ID(), 'post_type' => 'attachment', 'post_mime_type' => 'image') );
$images = array();
foreach($attachments as $image) {
$src = wp_get_attachment_image_src( $image->ID, 'medium' );
$images[] = array(
'@type' => 'ImageObject',
'url' => $src[0],
'width' => strval($src[1]),
'height' => strval($src[2])
);
}
//添付画像が無い場合はアイキャッチ画像を取得
if( !count($images) ) {
if( has_post_thumbnail() ) {
$thumbnail_id = get_post_thumbnail_id();
$src = wp_get_attachment_image_src( $thumbnail_id , 'medium' );
$images = array(
'@type' => 'ImageObject',
'url' => $src[0],
'width' => strval($src[1]),
'height' => strval($src[2])
);
} else {
//それも無い場合はロゴ画像をセット
$images = $logo;
}
}
$data = array(
'@context' => 'http://schema.org',
'@type' => 'Article',
'headline' => get_the_title(),
'author' => array(
'@type' => 'Person',
'name' => get_the_author(),
),
'datePublished' => get_the_date('Y-m-d'),
'dateModified' => get_the_modified_time( 'Y-m-d' ),
'articleSection' => $articleSection,
'url' => get_permalink(),
'mainEntityOfPage' => array(
'@type' => 'WebPage',
'@id' => get_permalink()
),
'publisher' => array(
'@type' => 'Organization',
'name' => get_bloginfo('name'),
'logo' => $logo,
),
'image' => $images,
);
//php5.4以前のバージョンではオプション引数(JSON_UNESCAPED〜)を削除すれば大丈夫だと思います。
echo '<script type="application/ld+json">'
.json_encode($data, JSON_UNESCAPED_SLASHES|JSON_UNESCAPED_UNICODE|JSON_PRETTY_PRINT)
.'</script>'.PHP_EOL;
}
rewind_posts();
}
add_action('wp_head','insert_json_ld_for_schema_org');
出力サンプル。
<script type="application/ld+json">{
"@context": "http://schema.org",
"@type": "Article",
"headline": "[Photo] 幌見峠のラベンダー園",
"author": {
"@type": "Person",
"name": "tomoya"
},
"datePublished": "2017-04-08",
"dateModified": "2017-04-08",
"articleSection": "Photo",
"url": "https://planet-green.com/horomitouge-lavender/1501",
"mainEntityOfPage": {
"@type": "WebPage",
"@id": "https://planet-green.com/horomitouge-lavender/1501"
},
"publisher": {
"@type": "Organization",
"name": "planet-green.com",
"logo": {
"@type": "ImageObject",
"url": "https://planet-green.com/wp-content/uploads/2017/03/Twenty-Seventeen-capture-2017-03-28-.jpg",
"width": "640",
"height": "573"
}
},
"image": [
{
"@type": "ImageObject",
"url": "https://planet-green.com/wp-content/uploads/2017/04/horomitouge-7399.jpg",
"width": "720",
"height": "480"
},
{
"@type": "ImageObject",
"url": "https://planet-green.com/wp-content/uploads/2017/04/horomitouge-7418.jpg",
"width": "720",
"height": "480"
},
(略)
]
}</script>
そのSchema.orgなんですが、仕様についてネット上の情報が錯綜している上に、公式サイトの説明も曖昧で、いまいちよくわからない部分が多いのですよね。
例えば、記事タイトルはnameプロパティで指定すると書いてあるサイトもあれば、headlineプロパティで指定すると書いてあるサイトもあります。
Schema.org公式サイトでは簡素にnameはname、headlineはheadlineと書いてありますが言葉の定義についての説明が無いのです。
しかもgoogleまで錯綜していて、Search Console(webmasterツール)の 〔その他のリソース〕 にある 〔構造化データ マークアップ支援ツール〕 を使って画像タグのマークアップをしても、〔構造化データ テスト ツール〕を使ってチェックするとエラーになるという状態です。
そこで上記のPHP関数は、私が調べた範囲において最大公約数的な解釈をして実装しました。
間違いがありましたらコメントでご指摘していただけると幸いです。
この記事を読んだ人は次の記事も読んでいます
[開発/備忘録] WordPress + Custom Fields に複雑な検索機能を実装する
[備忘録] WordPressのテーマをTwenty Seventeenに変更
[開発/備忘録] WordPressのテーブルを手動でutf8mb4に一括変換する
正規表現でユーザーエージェントからSafariを判別する方法
[開発/備忘録] さくらのレンタルサーバーにAPCをインストール
[開発/備忘録] さくらのレンタルサーバーにPHPカレンダー関数をインストール
[開発/備忘録][PHP] 複数の画像を結合した1枚のサムネイル画像を自動作成する
[備忘録] EC-CUBE4をnginx上で動かす