Google推奨JSON-LDで構造化マークアップし検索流入を増やす【WordPress対応】

20171010_構造化データ テストツール

構造化データにおいてGoogleやBingの検索サービスがサポートしている各構造を表す語彙を定義している仕様には、
主にData-Vocabulary.orgとschema.orgの2つが存在しています。
今回はそのうちのschema.orgを利用します。

schema.orgの記述方法(シンタックス)には、「Microdata」「RDFa」「JSON-LD」の3つがあります。

Googleはこれまでmicrodataでの記述を推奨していましたが、現在では「JSON-LD」を推奨しています。

JSON-LDとはなんぞや?

JSON-LD は、Google などの検索エンジンに対してサイト上のコンテンツを記述する構造化データの実装に使用できる JSON ベースのデータ形式です。
Google ウェブマスター向け公式ブログ: Web Components と JSON-LD でウェブサイト開発がより簡単に

JSON-LDは軽量のデータ形式であり、人間でも読み書きしやすいのが特徴です。

JSON-LDで記述するメリット

HTMLと構造化データを切り離せる

例えば

普段からJSONに慣れてる

今回は主に投稿ページの構造化マークアップを行なってまいります。


<?php
/*
** 記事ページにだけ構造化データ(json-ld)をフックで表示させる。
*/
function add_structured_data() {
    if ( is_single() ) :
        // ローカルメソッド外から記事情報を取得
        global $post;
        // 投稿IDからアイキャッチ画像を取得
        $thumbnail_id = get_post_thumbnail_id($post);  
        $imageobject = wp_get_attachment_image_src( $thumbnail_id, 'full' );
?>
        <script type="application/ld+json">
        {
            "@context": "http://schema.org",
            "@type": "BlogPosting",
            "mainEntityOfPage": {
                "@type": "WebPage",
                "@id": "<?= get_the_permalink(); ?>"
            },
            "headline": "<?= is_front_page() ? bloginfo('name') : get_the_title(); ?>",
            "image": {
                "@type": "ImageObject",
                "url": "<?= esc_url($imageobject[0]) ?>",
                "height": "<?= esc_attr($imageobject[1]) ?>",
                "width": "<?= esc_attr($imageobject[2]) ?>"
            },
            "datePublished": "<?= esc_attr( get_the_date( 'c' ) );?>",
            "dateModified": "<?= esc_attr( get_the_date( 'c' ) );?>",
            "author": {
                "@type": "Person",
                "name": "<?php bloginfo('name'); ?>"
            },
            "publisher": {
                "@type": "Organization",
                "name": "<?php bloginfo('name'); ?>",
                "logo": {
                    "@type": "ImageObject",
                    "url": "<?= esc_url($imageobject[0]) ?>",
                    "height": "<?= esc_attr($imageobject[1]) ?>",
                    "width": "<?= esc_attr($imageobject[2]) ?>"
                }
            },
            "description": "<?= $aioseo_desc ? $aioseo_desc : get_the_excerpt(); ?>"
        }
        </script>

    <?php endif;
}
add_action( 'wp_head', 'add_structured_data', $priority=10 );

?>