AMP 用 schema.org をワードプレスで設定する方法

schema.org

schema.org とは検索エンジン（ここでは Google のクローラ）がページに書いてある情報正しく取得するために、ページ作成者側が記述するデータです。

schema.org 自体はブログやサイトを運営する場合必須というわけではありませんが、AMP に対応する場合は必要な項目です。schema.org の設定の仕方は数種類あるのですが、AMP では JSON-LD という記述方法で設定しなくてはならないようです。

JSON-LD には必須要素、推奨要素と色々あるのですが、必須要素中心の記述となります。一部自動化ができていない項目がありますので、コードが完成次第、追記・修正していこうと思います。

参考：Enabling Rich Snippets for Articles

また、記述する schema.org が上手く記述できているかの確認は Google が下記のツールを提供してくれています。

参考：Structured Data Testing Tool Structured Data Testing Tool

JSON-LD は AMP では head 内で読み込まなくてはいけません。body 下などの記述ではエラーが出ます。head.php 等に以下を記述します。

JSON-LD

<script type="application/ld+json">
{
    "@context": "http://schema.org",
    "@type": "BlogPosting", //NewsArticle もしくは BlogPosting
    "headline": "<?php the_title(); ?> ", //記事タイトル
    "image": {
        "@type": "ImageObject",
        "url": "<?php echo $ampimg; ?>", //アイキャッチ画像の URL
        "height": 430,
        "width": 770 //696px以上の画像
    },
    "datePublished": "<?php echo get_the_date('c'); ?>", //記事投稿時間
    "dateModified": "<?php echo get_the_modified_date('c'); ?>", //記事更新時間
    "author": {
        "@type": "Person",
        "name": "zz" //ライター名
    },
    "publisher": {
        "@type": "Organization",
        "name": "<?php bloginfo('name'); ?>", //サイト名
        "logo": {
            "@type": "ImageObject",
            "url": "https://example/logo.png", //ロゴ画像の URL
            "width": 67, //ロゴ画像横幅 600px以下
            "height": 60 //ロゴ画像縦幅 60px以下
        }
    },
<?php
//記事要約の取得
if(have_posts()): while(have_posts()): the_post();
    $ampdesc = mb_substr(get_the_excerpt(), 0, 100);
endwhile; endif;
?>
    "description": "<?php echo $ampdesc; ?>" //記事要約
}
</script>
以下解説。