記事タイトル:
新デザインスキンに読者登録ボタンを設置する
テーマ:記事エリア前後のカスタマイズ

こんにちは。
『やさしいブログの作り方』の松田です。

新デザインスキンには記事エリア前後にあった読者登録ボタンがありません。

一方、旧デザインスキンには記事エリア前後に読者登録ボタンがあり、ここから読者登録する人は結構いるように思います。

なぜわかるかというと、今私のサイドバーには読者一覧がないので。(笑)


ですので、新デザインスキンを使っている方も記事エリア前後に読者登録ボタンがある方が便利だと思いますので、設置できるカスタマイズをご紹介します。

フリープラグインに以下の記述を貼り付けます。

<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">google.load('jquery', '1.6.2');</script>
<script type="text/javascript">(_JQ162_=jQuery)(function(){$=jQuery=_JQ162_;});</script>
<script type="text/javascript">
$(function(){
var r = $('<div style="background:#ffeeee; padding:10px;border:2px solid #ff0000; display:block; font-weight:bold; font-size:1.2em; text-align:center;"><a href="http://blog.ameba.jp/reader.do?bnm=amecafe2011">このブログの読者になる(チェック)</a></div>');
$('.pagingArea:first').before($(r).clone());
$('.pagingArea:last').after($(r).clone());
});
</script>

まず上記の中の background:#ffeeee; padding:10px;border:2px solid #ff0000; は以前こちらの記事でご紹介した囲み枠の作り方と同じ内容ですので、枠の線や色などは自由に変えることができます。

またamecafe2011の部分にはご自身のアメブロIDを入れてください。

このまま使うと私の読者が増えてしまいます。(笑)


もちろん画像を使ったりすればもっと目立つ読者登録ボタンを置くことも可能ですが、上記のボタンを設置するだけでも十分効果はあると思います。

なお、上記のカスタマイズの記述を参考にさせていただいたのはこちらの記事です。