こちらのカスタマイズは、AFFINGER5「WING」でも応用できます。
WordPressテーマ「AFFINGER4」のAMPページの最初の見出し（h2）の前にアドセンス広告を追加する方法をご紹介します。
見本ページhttps://kanamii.jp/1514/amp/
私にはPHPコードを解読したり作成するスキルがありませんので、トライしては諦め...またトライしては諦め...またトライして...
1カ月ほどコードと睨めっこして実現できたカスタマイズです。(笑)
参考にさせていただいたのは、こちらのページです。
ありがとうございます。
参考【アドセンス収益向上】簡単！プラグインやショートコード不要でWordPress記事中に広告を挿入する方法/寝ログ
スポンサーリンク
子テーマの作成
AMPページのカスタマイズでは「functions-amp.php」を編集します。
AFFINGERのアップデート時にカスタマイズ内容が消えてしまわないように、ご自身のパソコンにある親テーマ内の該当ファイルをFTPでお使いの子テーマ内にアップロードして子テーマを作成してください。
他のカスタマイズで既に作成済みの場合は、新たに作成する必要はありません。
-
-
WordPressのカスタマイズ ～子テーマ利用のメリットとデメリット・各テーマファイルの子テーマ作成方法～ - ゼロからのWordPress入門【18】
前ページでは、WordPressのファイルとデータベースのバックアップ方法をご紹介しました。 もしものトラブルに備えてバックアップ方法をマスターしたら、次のステップはテーマのカスタマイズです。 ご自身 ...
functions-amp.phpにコードを追加
WordPressダッシュボード→外観→テーマ→テーマの編集→「functions-amp.php」（子テーマ）を開きます。
最下部に下記コードを追加します。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
//見出し（h2）上アドセンス function add_ads_before_1st_h2($amp_the_content) { if (is_single()) { //広告（AdSense）タグを記入 $ads = <<< EOF [adsense] EOF; $h2 = '/<h2.*?>/i';//H2見出しのパターン if ( preg_match( $h2, $amp_the_content, $h2s )) {//H2見出しが本文中にあるかどうか $amp_the_content = preg_replace($h2, $ads.$h2s[0], $amp_the_content, 1);//最初のH2を置換 } } return $amp_the_content; } add_filter('amp_the_content','add_ads_before_1st_h2'); |
※参考サイト様からコピーさせていただいたコード内の「the_content」部分を「amp_the_content」に修正、アドセンスコードの部分はAFFINGER標準のショートコードを追加しました。
アドセンス広告を中央寄せにしてラベル表記を追加する場合
こちらのカスタマイズでは、WordPressダッシュボード→「AFFINGER管理」で設定した記事下のアドセンス広告が反映されます。
広告を中央寄せにしてラベル表記を追加する場合は、下記ページをご参照ください。
-
-
【AFFINGER4】AMPページのアドセンスの中央寄せと「スポンサーリンク」のラベル追加方法
こちらのカスタマイズは、AFFNGER5「WING」でも応用できます。 WordPressテーマ「AFFINGER4」のAMPページのアドセンス広告を中央寄せにする方法と「スポンサーリンク」のラベル表 ...
パソコンでのAMPページの表示確認方法を含めた、AFFINGER4のAMP化方法の全手順は下記ページで説明しています。
-
-
【AFFINGER4】AMP化方法の全手順をまとめました
WordPressテーマ「AFFINGER4」は、テーマ標準でAMP対応機能が準備されています。 これまで、いくつかの注意点や躓いたポイントなどを記事にしてきましたが、今回はAFFINGER4でのAM ...
以上、AFFINGER4のAMPページの最初の見出し（h2）の前にアドセンス広告を追加するカスタマイズ方法をご紹介しました。
やっとこさ表示することができたアドセンス...(笑)
参考にしていただけると大変嬉しく思います。
最後までお付き合いくださりありがとうございます。
関連記事
-
-
【AFFINGER4】AMPページの記事タイトルの上（アイキャッチ画像の下）にアドセンスを追加する方法
こちらのカスタマイズは、AFFINGER5「WING」でも応用できます。 WordPressテーマ「AFFINGER4」のAMPページの記事タイトル上（アイキャッチ画像の下）のファーストビューの位置に ...
-
-
【AFFINGER4】AMPページも自分色♪カスタマイズまとめ
当ページでご紹介しているカスタマイズは、AFFINGER5「WING」でも応用できます。 当ブログの開設当初に利用していたWordPressテーマは「STINGER PLUS」。 まだ1年の月日も経っ ...
