
Google様には逆らえないので、推奨するとおり、AMP対応のページを準備しました。
実際には、Wordpressの有料テーマ【THE THOR】というのを使用しているので、ちょっとした設定をするだけで、AMPのページを生成できるようになっているようです。
しかし、GoogleSearchConsole(通称サチコ)からAMPエラーの表示があり、調べてみると大量のエラーが発生という流れです。
アフィリエイトリンクは手作業
過去にも、アマゾンや楽天のアフィリエイトリンクをページに貼った事で、エラーが出たことがあり対応しました。
AMPページにしたら、アマゾンアフィリエイトで「タグの属性で指定されたレイアウトが無効」になる対処方法
いちいち手編集でやらなければならない
ので、本当にメンドクサイです。
現時点も直してないアフィリエイトリンクが大量に存在します。
convert.phpを修正すれば簡単?
他のWordpressテーマではやってないのでわかりませんが、THE THORでは、
covert.phpにコード追加でエラーが消えた!
追加したコードは、自分のエラーだけを対応した事ですが消えたので良しとしました。
管理パネルから、
外観 > テーマの編集 > THE THOR > inc > amp > convert.php
と進んで、convert.phpに下記のコードを追加しました。
ちなみに、THE THORは、子テーマと親テーマがありますが、親テーマの方に、convert.phpがあります。
このconvert.phpというのが、AMPページを生成するコードになっているポイントのようですね。
//「marginheight」はタグ「amp-iframe」で使用できません対策 $pattern = '/marginwidth="0"/i'; $append = ''; $the_content = preg_replace($pattern, $append, $the_content); $pattern = '/marginheight="0"/i'; $append = ''; $the_content = preg_replace($pattern, $append, $the_content); $pattern = '/security="restricted"/i'; $append = ''; $the_content = preg_replace($pattern, $append, $the_content); //border属性を除去する $the_content = preg_replace('/ +border=["][^"]*?["]/i', '', $the_content); $the_content = preg_replace('/ +border=[\'][^\']*?[\']/i', '', $the_content); //画像タグをAMP用に置換 $the_content = preg_replace('/<img (.*?)>/i', '<amp-img layout="responsive" $1></amp-img>', $the_content); $the_content = preg_replace('/<img (.*?) \/>/i', '<amp-img layout="responsive" $1></amp-img>', $the_content); //画像タグをAMP用に置換 $the_content = preg_replace('/<img (.*?)>/i', '<amp-img layout="responsive" $1></amp-img>', $the_content); $the_content = preg_replace('/<img (.*?) \/>/i', '<amp-img layout="responsive" $1></amp-img>', $the_content);
そして、現時点のconvert.phpの全コードが下記のようになります。
<?php //////////////////////////////////////////////////////// //AMP専用投稿コンテンツをAMPページ用にコンバート //////////////////////////////////////////////////////// function convert_content_amp($the_content){ // 通常ページではコンテンツを置換しない if (isset($_GET["type"]) && $_GET['type'] == 'AMP' && is_single() && get_option('fit_ampFunction_switch') == 'on' && get_post_meta(get_the_ID(), 'amp_hide', true) != '1') { // Twitterをamp-twitterに置換する $pattern = '/<blockquote class="twitter-tweet".*?>.+?<a href="https:\/\/twitter\.com\/.*?\/status\/(.*?)">.+?<\/blockquote>/is'; $append = '<p><amp-twitter width=486 height=657 layout="responsive" data-tweetid="$1"></amp-twitter></p>'; $the_content = preg_replace($pattern, $append, $the_content); // Instagramをamp-instagramに置換する $pattern = '/<blockquote class="instagram-media".+?"https:\/\/www\.instagram\.com\/p\/(.+?)\/".+?<\/blockquote>/is'; $append = '<amp-instagram layout="responsive" data-shortcode="$1" width="400" height="400" ></amp-instagram>'; $the_content = preg_replace($pattern, $append, $the_content); // YouTubeをamp-youtubeに置換する $pattern = '/<iframe[^>]+?src="https:\/\/www\.youtube\.com\/embed\/(.+?)(\?feature=oembed)?".*?><\/iframe>/is'; $append = '<amp-youtube layout="responsive" data-videoid="$1" width="480" height="270"></amp-youtube>'; $the_content = preg_replace($pattern, $append, $the_content); // iframeをamp-iframeに置換する $pattern = '/<iframe/i'; $append = '<amp-iframe layout="responsive" sandbox="allow-scripts allow-same-origin allow-popups"'; $the_content = preg_replace($pattern, $append, $the_content); $pattern = '/<\/iframe>/i'; $append = '</amp-iframe>'; $the_content = preg_replace($pattern, $append, $the_content); //C2A0文字コード(半角スペース)を通常の半角スペースに置換 $the_content = str_replace('\xc2\xa0', ' ', $the_content); //style属性を取り除く $the_content = preg_replace('/ +style=["][^"]*?["]/i', '', $the_content); $the_content = preg_replace('/ +style=[\'][^\']*?[\']/i', '', $the_content); //onclick属性を取り除く $the_content = preg_replace('/ +onclick=["][^"]*?["]/i', '', $the_content); $the_content = preg_replace('/ +onclick=[\'][^\']*?[\']/i', '', $the_content); //fontタグを取り除く $the_content = preg_replace('/<font[^>]+?>/i', '', $the_content); $the_content = preg_replace('/<\/font>/i', '', $the_content); //imgタグにwidthとheightを追加 ここから先を追記 $img_pattern = '/<img [^>]*?src="(https?:\/\/[^"]+?)"[^>]*?>/iu'; preg_match_all($img_pattern, $the_content, $rep_imgs); foreach ( $rep_imgs[0] as $i => $rep_img ) { if ( false !== strpos( $rep_img, 'width=' ) && false !== strpos( $rep_img, 'height=' ) ) { continue; } $rep_img_url = $rep_imgs[1][$i]; // 画像url $rep_img_size = @getimagesize( $rep_img_url ); // 画像サイズを取得 if ( false === $rep_img_size ) { continue; } $replaced_img = str_replace( '<img ', '<img ' . $rep_img_size[3] . ' ', $rep_imgs[0][$i] ); $the_content = str_replace( $rep_img, $replaced_img, $the_content ); } //「marginheight」はタグ「amp-iframe」で使用できません対策 $pattern = '/marginwidth="0"/i'; $append = ''; $the_content = preg_replace($pattern, $append, $the_content); $pattern = '/marginheight="0"/i'; $append = ''; $the_content = preg_replace($pattern, $append, $the_content); $pattern = '/security="restricted"/i'; $append = ''; $the_content = preg_replace($pattern, $append, $the_content); //border属性を除去する $the_content = preg_replace('/ +border=["][^"]*?["]/i', '', $the_content); $the_content = preg_replace('/ +border=[\'][^\']*?[\']/i', '', $the_content); //画像タグをAMP用に置換 $the_content = preg_replace('/<img (.*?)>/i', '<amp-img layout="responsive" $1></amp-img>', $the_content); $the_content = preg_replace('/<img (.*?) \/>/i', '<amp-img layout="responsive" $1></amp-img>', $the_content); //画像タグをAMP用に置換 $the_content = preg_replace('/<img (.*?)>/i', '<amp-img layout="responsive" $1></amp-img>', $the_content); $the_content = preg_replace('/<img (.*?) \/>/i', '<amp-img layout="responsive" $1></amp-img>', $the_content); //スクリプトを除去する $pattern = '/<script.+?<\/script>/is'; $append = ''; $the_content = preg_replace($pattern, $append, $the_content); return $the_content; }else { return $the_content; } } add_filter('the_content','convert_content_amp', 999999999);
アフィリエイトリンク無ければ有効

現時点で、アフィリエイトのリンクが無いページであれば
有効なAMPページです
となるようです。
画像なども、更新したり、画像高さや幅の設定などをやらなくても大丈夫になりました。
アフィリエイトがある場合は、こつこつと手作業で修正するしかないようなので、対象のページを更新することがあれば修正するし、それ以外は放置ですね。
ちなみに、楽天アフィリエイトでは、AMP対応のコードなどが生成できるようですが、自分が試すと、画像が出なかったり、デザインを崩すような入り方をしたので使えませんでした。
※楽天アフィリエイトのAMP対応コードは、AMPページに直接埋め込むコードであり、今回のようなテーマから自動生成したAMPページでは使えないかもしれません。
もっと簡単にアフィリエイトリンクが貼れるようなAMP対応になってほしいものです。
天下のGoogle様が推奨しているAMPですから、検索順位を下げられてしまうのも困るのでやるしかないですね。