アドセンスを記事途中に配置する非公式プラグインH3ADをつくった

※記事内に商品プロモーションを含む場合があります

前回の記事ではH3MADと言う名前でしたが
デスクトップにも対応させようかと思っているのでMをとって
H3ADとしました。

このプラグインはアクセスがある度に実行されるプラグインであり
なるべく短いコードにしたいので設定画面を実装しないのと
公式プラグインディレクトリにも載せない予定です、たぶん(^^)
公式に載せるにはreadme.txtを書く必要があるので面倒です。

でも公式プラグインディレクトリって便利です！！
プラグインのtrunkフォルダにプラグインをアップロードすれば
すぐに、WordPress側でアップデートの通知が来ます。
まぁ作者にとっては、面倒なんですけどね！

まぁ、需要があれば考えますけど(@eaxjpまで)、
設定とアドセンスコードはプラグイン本体に格納して設定ファイルの読み出しなど
は行わない様にします。

H3MADではアドセンスコード入りで１１００byteほどだったので
３Kbyte以内にはしたいと思います。

H3AD

H3ADは殆どH3MADと同じです、ただデスクトップも表示出来る用に改造しただけです。
H3ADの仕様

記事の途中にアドセンスを表示すると記事と溶け込みすぎて誤クリックを招く恐れがあるので
通常はスポンサードリンクを表記する事が多いです。

しかし、他のブログの中には表記してないブログもあり
調べたら広告ユニットの上などに水平線（ｈｒタグ）や色を変えればスポンサードリンクを
入れなくても構わないと書いてあったので

モバイルの場合、広告ユニットの上と下に水平線をいれました。
よってスポンサードリンクは削除しました。

デスクトップの場合も
モバイルと表示条件は変えず、水平線を無くしてマージンなどで間隔を開けて
広告ユニットを配置しようかと思っています。

上のサンプルはH3MADの時の記事です。
H3ADはモバイル版アドセンスを挿入することをメインに考えた為、
記事始め、記事終わりから十分間隔があるh3タグ上しか表示しません。

これはiPhoneのバッテリの劣化を抑える３つポイントの記事。
最初のh3タグは記事始めから近いので２番目のh3タグにアドセンスが
表示されています。

400byteはh3MADからの設定で、
iPhone5Sで見ると画面半分に表示される文字数が１５０文字ぐらい。
最初は文字数でカウントしようかとも思いましたが、htmlタグの処理が面倒なのと
あまり処理を加えると処理が遅くなるので単純にバイト数でカウントする様にしました。

このプラグインは記事のコンテンツ本体を処理しているのでこのプラグインの
処理が遅くなるとページ読み込み速度も遅くなります。
よって、できるだけ軽く、余計な処理は入れない様に開発しました。

日本語は２バイト文字なので150文字は300byte。
とhtmlタグ分のマージンを取って400byteとしました。

テストしても、ちょうど良いのでそのままの設定にしています。
BLOGEの場合、記事タイトルが大きく表示されるので他のブログだと
再調整が必要かもしれません。

現在、BLOGEでは記事下にダブルレクタングルを設置してあり
広告ユニット３つすべて配置してあるので
デスクトップでの表示サンプルはありません。
モバイル版と同じ場所にデスクトップ版のコードが表示されます。

また、本体サイズもモバイル＆デスクトップ両方のアドセンスコードを入れても
2.3Kbyte程、アドセンスコードを入れないと1.7Kbyte程です。
処理本体だけだと、600byte程とコンパクトにまとまっています。

数か月前までぬるっとブログを書いていたので見出しタグを入れてなかったので
最近の記事しか記事内の広告ユニットは表示されません。

今後は400文字程度でもちゃんと見出しを入れてなるべく
見やすい記事を書く事を心がけ、アクセスの多いページは
見出しタグを入れることも考えています。

先日、アドセンスユニットをブログ名変更に合わせえて一新したので
ダブルレクタングルの内、左側の方が悪いのでもう少しデータを集めた上で
アドセンスの広告ユニットを変更しようかと思います。

追記 2017年11月7日

新バージョンを作りました。今回は公式ディレクトリに登録予定です。
WordPressでアドセンスを記事内に入れるプラグインAds into post 3