WordPressテーマ「Luxeritas」で、トップページや記事一覧内にAdsense広告をモバイル・PC・AMP別に載せる（or モバイル/PC/AMP別の広告を出し分けするショートコードを作る）

2017年12月11日WordpressカスタマイズWordpress

本サイトでは「Luxeritas」というWordpressテーマを使用している。Adsenseを簡単に載せることが出来るのだが、今回はトップページがカテゴリページなどで、PC・モバイル・AMPとそれぞれ別々に広告を掲載する方法を紹介する。

同じ方法で、モバイル/PC/AMP別の広告を出し分けすることも可能

また、このテーマを使用していなくても、この方法を応用すれば自由自在に広告を掲出することが出来るため、そのような使い方も出来るだろう。

全体のやり方としては、ユニークなショートコードを作れるようにPHPコードを修正し、そのショートコードをウィジェットに貼り付けてあげる方法で対応する。もしこのテーマを使っていないのであれば、おなじショートコードを好きな場所に貼れば同じ事が出来るはずだ。

なお、今回はPHPファイルをいろいろと操作するので、操作するたびにウェブサイトがきちんと表示されることを確認しながら進めて欲しい。

目的は、PCはインフィード広告、モバイルは通常のレスポンシブ広告、AMPでは広告を表示しないこと

今回の目的は下記の通りだ。

PCでのアクセスでは、インフィード広告を利用
モバイルでのアクセスは、通常のレスポンシブ広告を表示
AMPでは広告を表示しない

ただし、AMPでも広告を表示したいというニーズに合わせ、そのようなことも出来るようにしている。

ショートコードの有効化

「Luxeritas」の「子テーマの編集」にある「function.php」に以下を追加する。

add_filter('widget_text', 'do_shortcode');

ショートコード用のPHPをインクルード出来るようにする

同じく「functions.php」に、以下を追加する。

functionInclude_my_php($params = array()){
 extract(shortcode_atts(array(
 'file' => 'default'
 ), $params));
 ob_start();
 include(STYLESHEETPATH . "/shortcode/$file.php"); 
 return ob_get_clean();
} 
add_shortcode('myphp', 'Include_my_php');

これで、子テーマの入っているディレクトリの下に./shortcode/ディレクトリを作っておこう。
配下に配置したPHPファイルが自動的にincludeされるようになる。

アドセンス用ショートコードを作成する

インフィード広告のコードは適当に取得しておいてください。最近はモバイルとPC、それぞれページを分析して勝手にコードを生成してくれます。

下記のうち、必要な部分を埋めよう。

<?php

$ads_pc = <<< EOF
 【PC用のコード】
EOF;

$ads_mobile = <<< EOF
 【モバイル用のコード】
EOF;

$ads_amp = <<< EOF
 【AMP用のコード】
EOF;

if( isset( $luxe['amp'] ) ) {
  echo $ads_amp;
} elseif ( wp_is_mobile() ) {
  echo $ads_mobile;
} else {
  echo $ads_pc;
}

?>

上記のPHPコードを、先ほど作成したディレクトリの中に「adsense.php」という名前で保存しよう。

WordPressのウィジェットで編集する

編集の際は、ウィジェットのうち下記の「テキスト」という部分を使用する。

今回はインフィードとして使うので、「記事一覧中央ウィジェット」にもっていく。
そして、次のように入力する。

これで、インフィードの広告がPC/モバイル/AMP別に表示される。

WordPress「Luxeritas」テーマでの、PC/モバイル/AMP別記事一覧ページでの広告表示

今回は、PCの場合はインフィード広告を、モバイルでは通常の広告を、AMPでは広告を表示しないようにした。といっても、トップページやカテゴリページはAMPに対応していないので、現時点では必要ない。

PC

こんな感じ。

モバイル

PC/モバイル/AMPの出し分けWordpress用プラグイン完成！

これで、ショートコードを用いてウィジェットにおくもよし、index.phpなどに直接挿入するもよしな方法が完成した。

Luxeritasを使っているのであれば、ウィジェットから操作するだけで簡単に記事一覧内に広告を掲出することが出来る。この機能と上記のスクリプトを合わせて使えば、端末に合わせてベストな広告を出すことが可能だ。

カテゴリ
Wordpressカスタマイズ

タグ
Wordpress12

Posted by webnetforce