2014-10-17

BloggerにGoogle AdSense導入④

前回記事


スマホ用記事ページにAdSense広告を設置する


Bloggerのスマホ用ページに広告を設置するにはPC用ページのようにガジェット追加にて対応していないようなので「テンプレート」から「HTML編集」をして広告タグを設置する必要があります。
いろいろなサイトで紹介されていることなので記事にするほどではありませんが、備忘録として残すこととします。



設置する箇所は、スマホホームのページ上部と下部、および各記事ページの上部と下部とします。

・上部への設置はホームと各記事で共通で1ヶ所設置
・下部への設置はそれぞれ設置
で計3箇所設置すればよさそうです。

・設置箇所の目印は id='mobile-main' で検索してその行の次行に共通上部を。
・その少し後方の </b:loop> と <b:else/> の間にホーム下部を。
・今度は class='post-header-line-1' で検索してその少し下にある
 <data:post.body/> の行の次行に各記事下部の広告タグを設置します。



なお、設置する広告タグですが、AdSenseが発行したタグをそのまま設置してはいけません。
HTML編集にて設置する場合は、広告タグ(javascriptタグ)を適切にエスケープしてあげる必要があります。

Google検索で 「 HTMLエスケープサービス 」とかで検索してもらえればエスケープしてくれるサイトがいくつもありますのでここではその手順は省きました。

これでスマホホームと各記事ページの上下に広告が設置されます。