としっぴーず

旅行やミュージカル、Wordpress等のITネタ中心のブログ

WordPressのAMPプラグインを入れたら「logoフィールドの値は必須です」となったので対応した

      2017/01/25

スマホでGoogle検索してみると、「AMP対応」のサイトが上位表示されることが目立ってきました。こりゃそろそろ対応しなきゃ、ってこと対応してみます。

どの方法で行くか

プラグインを使うか、自力で作るかどちらです。

自力で作る方法は本家GoogleさんのAMP Projectを参考にしてください。

https://www.ampproject.org/docs/reference/components

自力で作るのは大変そう。っていうかそもそもコーディング一切してないし、という方はプラグインを使うことになります。

WordPressの管理コンソールでAMPプラグインを検索してみると、

ampプラグイン検索結果

ampプラグイン検索結果

 

235件ヒットしました。

一番使われている「AMP」を使ってみます。

AMPプラグインインストール

プラグイン検索結果ページの「今すぐインストール」を押すだけです。

インストール後、「有効化」ボタンが表示されるので、それもクリックします。

確認

URLの末尾に/ampをつければamp対応ページが表示されるはずです。

amp対応したこのページ

amp対応したこのページ

 

無事表示対応できました。

ソースも確認してみます。

linkタグが挿入されています。これでGoogleがampページを検出できるってわけですね。

テストツールで確認

Googleが提供しているテストツールにかけてみます。

https://search.google.com/search-console/amp

有効なAMPページだと表示されましたが、構造化データの項目で警告が出ています。

「構造化データをテスト」をクリック。

あ、「logoフィールドの値は必須です。」とエラーが出ました。

このブログはSTINGER7というテーマを使っていて、ロゴ画像も設定してあるのですが、それでもダメみたいですね。。

私の持っているもう一つのブログでは、Simplicity1.7.8を使っているのですが、そちらでも同じエラーが出ました。

 

Functionに関数を追加

しょうがないので、function.phpのに関数を追加します。

ampプラグインには「amp_post_template_metadata」や「amp_post_template_data」というフィルターが用意されていて、これらでデータを変更できます。

下記のように関数を追加しました。

画像のurlはフルパスにしないといけないみたいです。

もう一度テストツールで確認

functions.phpを編集したので、もう一度テストツールで確認します。

 

指定したロゴ画像が読めているみたいです。無事にエラーも消えました。

以上、おわたー!

と思ったらAMPプラグインではAnalyticsやAdSenseにも別途対応する必要がありますね。

Analyticsの対応はこちら

AdSenseの対応はこちら

 - CMS, WordPress