グーグルアドセンスのアカウントを取得したので意気揚々とブログにアドセンス広告を張ろうとしたのですが、解説サイトを見ても全然できなくて焦りました。
原因は旧デザインシステムでの貼り方を解説しているサイトを見ながらやっていたから。
新デザインシステムでの貼り方を解説しているサイトが
情報の古いサイトに埋もれていたんですね・・・
今回は新デザインシステムでのアドセンス広告の貼り方や
トップページの全文表示化といったブログ設定についてです。
設定すると
・トップページ記事は全文表示
・アドセンス広告はサイドバー、記事中、記事直下
という構成になります。
Contents
シーサーブログの広告を消し方
早速アドセンス広告を張る前に、まずはシーサーブログの広告を全て消しましょう。
シーサーブログの設定画面に行き……
デザイン＞コンテンツ：ボックス広告、バナー広告、商品紹介をｘで消す→保存
設定＞ 詳細設定＞ ブログ設定 ：共通ヘッダー→「表示しない」にチェック→保存
設定＞ 詳細設定＞ 記事設定 ：広告の表示→「無効」にチェック→保存
設定＞ 詳細設定＞ 広告設定：「広告を表示しない」にチェック→保存
Google Adsenseの広告配置設定(右サイドバー)
続いて右サイドバーにアドセンス広告を張っていきます。
ブログ記事にコードを半角で記載するとうまく表示されないので半角の<を全角の＜にしています。
そのため、ブログ記事のコードをコピペしてもうまくいきません。
記事と同じコードを全て半角で記載したtxtファイルを上げておくので、コピペする場合は↓からどうぞ。
ブログにアドセンス広告を貼るコードとトップページを全文表示にするコード.txt
ブログ設定画面に行き……
デザイン＞コンテンツ→ブログパーツの自由形式を右サイドバーへ
→自由形式の歯車マーク
名前は何でもいいです。
中身(自由形式の欄)に下のコードを入力
＜p style=”text-align: center;”>スポンサーリンク＜br/>
自分のアドセンスコードをコピペ
＜/p>
Google Adsenseの広告配置設定(記事中)
記事の本文中にアドセンスコードをコピペします。
＜p style=”text-align: center;”>スポンサーリンク＜br/>
自分のアドセンスコードをコピペ
＜/p>
このままだと表示がおかしくなるので、記事編集画面の下の方にある「改行HTMLタグ変換」の「改行を＜br/>タグに変換しない 」にチェック。
すると今度は通常の改行が反映されなくなるので、改行している箇所全てに＜Br/>をコピペ。もちろん半角で。
力技ですがこれでうまく表示されるはずです。
Google Adsenseの広告配置設定(記事直下)
ブログ設定画面に行き……
デザイン＞デザイン設定＞デザインタイトルをクリック＞HTML編集
96行目くらいにある
＜% if:blog.bookmark_service -%>
を探して、その上に下のコードを入力
＜% if:page_name eq ‘article’ -%>
＜div class=”adsense”>
＜p>スポンサーリンク
＜br />
自分のアドセンスコードをコピペ
＜/div>
＜% /if -%>
プレビューで確認して問題なかったら保存して下さい。
これで広告の設定は終わりです。
次はブログトップページの設定です。
トップページの記事を全文表示にして1記事だけ見せる設定
ブログ設定ページに行き……
設定＞ブログ設定＞トップページ表示件数：1に設定
デザイン＞デザイン設定＞デザインタイトルをクリック＞HTML編集
153行目くらいにある下のコードの上に①のコードを、下に②のコードを追加する
＜% if:article.first_image -%>
＜p class=”entry__thumbnail”>
＜a href=”＜% article.page_url -%>”>＜img src=”＜% article.first_image.page_url -%>” alt=”” />＜/a>
＜/p>
＜% /if -%>
＜% article.body | tag_strip | cshorten(200) -%>
＜p class=”read-more”>＜a href=”＜% article.page_url -%>”>続きを読む＜/a>＜/p>
＜/div>
①上に追加するコード
＜% if:page_name eq ‘index’ -%>
＜% article.entire_body | bodyfilter(article_info,blog) | mark_raw -%>
＜% /if -%>
＜% unless:page_name eq ‘index’ %>
②下に追加するコード
＜% /unless %>
最終的にはこうなります。
＜% if:page_name eq ‘index’ -%>
＜% article.entire_body | bodyfilter(article_info,blog) | mark_raw -%>
＜% /if -%>
＜% unless:page_name eq ‘index’ %>
＜% if:article.first_image -%>
＜p class=”entry__thumbnail”>
＜a href=”＜% article.page_url -%>”>＜img src=”＜% article.first_image.page_url -%>” alt=”” />＜/a>
＜/p>
＜% /if -%>
＜% article.body | tag_strip | cshorten(200) -%>
＜p class=”read-more”>＜a href=”＜% article.page_url -%>”>続きを読む＜/a>＜/p>
＜/div>
＜% /unless %>
広告設定は位置などもっといろいろ設定できるっぽいのですが、私はもうこれで満足です。
詳細は「シーサーブログ 新システム アドセンス」で検索すると
すごくわかりやすいサイトが出てくるのでそちらをご参照ください。
最後に自分のブログにだけ自分のアドセンスコードを有効にします。
これをやらないと悪意のある他人にアドセンスコードを悪用され、
アドセンス停止に追い込まれる可能性があるらしいです。
Google Adsenseの設定(自分のブログにだけアドセンスを有効にする)
Google Adsenseトップページ＞広告の設定＞右上の歯車マーク＞設定＞アクセスと認証
→自分のアカウントで特定のサイトの広告表示のみを許可するにチェック
→自分のブログアドレスを最初のhttp://と最後の/を省いて入力
(例えばpracticerecord.seesaa.net)
→保存
以上です。
ブログの設定って疲れますよね。
こんだけ苦労しても結構不自由な感じでしか設定できないので、早いところシーサーブログからWordPressに引っ越した方が色々楽ですよ。
記事が増えるほど引っ越し作業も大変になりますから。。
【関連記事】