はじめに
最近ありがたい事に少しづつですが、PVが伸びて一日に、1000PVを超える事ができるようになってきました。Googleアナリティクスなどの見方も少しづつですが勉強してます。
その中で、ずっと気になっていたのですが、訪れてくれた人がこのブログを平均して何ページみてくれているかの指標である、pageview/visitと言う数値が1.2から1.3くらいなのです。
これが高いのか低いのか良くわかりませんが、自分が他の方のブログをみる時を思い出すと大抵検索して、興味のある記事を開いてそして閉じる。
基本的に１ページだけ閲覧タイプですね。
おそらく大抵の方がそんな感じじゃないでしょうか。
ただ、一方で記事を読み終わったあと、それをさらに解決出来そうなタイトルがついた記事や、前から気になっていた事について書かれていそうな記事が「こちらもどうぞ」のような形で提示されていると、思わず時間を忘れて見てしまわないでしょうか。
今回は、このように関係しそうな記事を提示するために、Bloggerのラベルから関連する記事を自動で表示できるようにしてみましたので、その方法をご紹介します。
やり方
今回の対応をするのに、こちらの記事が大変参考になりました。
申し訳ないくらいにそのままなのですが、僕の環境ではひとつだけ注意してやらないと上手く反映されませんでしたので、その内容を記載しておきます。
BloggerのHTML編集画面を開く
まず、テンプレートからHTML編集をクリックします。
ラベルから関連記事を表示するためのjqueryを設置
ラベルから関連記事を表示するためのjqueryを設置します。<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js'></script> <script type='text/javascript' src='http://blogger-related-posts.googlecode.com/files/jquery.related-posts-widget-2.0.min.js'></script>
ここでの注意点は、個別記事だけにしないで、全体にかかるようにすることです。
何故か僕の環境だと、個別記事だけにかかるように、設定するとうまくいきませんでした。
ブログの投稿ウィジェットを開く
ブログの投稿ウィジェットを開きます。
ID="post"を開きます。
<data:post.body/>の下に、以下のコードを設置します。
<div class='related-posts-widget'>
<!--{blog_url:'http://fccreator.blogspot.jp/',max_posts:12,max_tags:10,posts_per_tag:6,related_title:'関連する記事',recent_title:'最近の記事',thumbs:0,post_page_only:1} -->loading..
</div>
各コードの意味は、元記事を参照してみてください。
URLなどご自身の環境にあわせて変更してください。
これで、関連する記事を表示できるようになります。
CSSで表示を調整する。
ここは、ご自身の見た目にあわせて変えていただければ思いますが、参考までに、僕は以下のようなCSSにしました。
.related-posts-widget{
font-size:.7em;
margin:55px 0px;
}
.related-posts-widget h2{color:#333;}
.rpw{
color:#333;
line-height:1.5em;
}
.rpw li{margin:8px 0px;}
.rpw li a:link strong{color:#2A5F74;}
.rpw li a:visited strong{color: #666;}
.rpw li a:active strong{color:#2A5F74;}
最後に
これでどこまで、訪れた人に複数のページを見ていただけるように改善できるかわかりませんが、他のページも見ていただけるきっかけになればいいな、と思います。２日、３日経過観測している限りでは、1.3後半から、1.4くらいに改善しているようですが、こういうものは短期だけ見ても意味はないので、しばらく経過観測したいとおもいます。
以上です。
