対象：Awesome Inc. テンプレート
記述時点で、このブログは Awesome Inc. テンプレートを使用しています。
そして、アドセンス が文末に表示されるように Awesome Inc. を改造してアクセス状況を観察しています。
次は、記事の文中に自動的にアドセンスを表示することを計画しています。
手動でアドセンスコードを追記するのは手間がかかりすぎるので、自動的にアドセンスコードを挿入するようにしたいと考えています。
近い将来の Awesome Inc. 修正に備えて、文中に自動的にアドセンスコードを挿入する方法をメモしています。
<!--more--> を利用する
<!--more-->
「本文を全て表示する >>」
<!--more--> を設定すると、トップページ （このブログでは https://kzstock.blogspot.com）を表示したときに、記事を全て読み込まずに ”本文を全て表示する >>” のリンクが表示されます。トップページの表示速度が早くなります。
<!--more--> は個別ページを表示した時には何もアクションを起こしません。
このブログは全ての記事に more を使用しているので、アドセンスコードを挿入する場所としては最適です。
スクリプトを追加する場所は２か所
Javascriptを追加します。追加する場所は２つ。
- <head> 直下
- <data:post.body/> 直下
1. <head>
Blogger > テーマ > HTMLの編集 と進んでテンプレート修正画面を開き <head> タグを探して、直後にスクリプトを挿入します。
<head>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js' />
<script type='text/javascript'>
$(document).ready(function(){ $('a[name="more"]').before($('#MBT-google-ad').html());
$('#MBT-google-ad').html(''); });
</script>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js' />
<script type='text/javascript'>
$(document).ready(function(){ $('a[name="more"]').before($('#MBT-google-ad').html());
$('#MBT-google-ad').html(''); });
</script>
2. <data:post.body/>
<data:post.body/>
<b:if cond='data:blog.pageType == "item"'>
<div style="display:none;">
<div id='MBT-google-ad'>
<div style='font-size:11px;'>スポンサーリンク</div><br/> アドセンスコードを転記 <br/>
</div>
</div></b:if>
<b:if cond='data:blog.pageType == "item"'>
<div style="display:none;">
<div id='MBT-google-ad'>
<div style='font-size:11px;'>スポンサーリンク</div><br/> アドセンスコードを転記 <br/>
</div>
</div></b:if>
注意事項
スクリプトが対応するアドセンスコードは「同期」コードのみです。「レスポンシブ」コードは動作しません。
関連記事
：SC2
このサイトを検索 | Search this site
ブロトピ：今日のブログ更新
0 コメント