注目記事モジュールを記事下に設置

　はてなブログのスマートフォン表示ではフッタに注目記事が出力されるのですが、記事下に他の情報とあわせて設置したいです。注目記事モジュールはページ内に存在する特定のHTMLを置き換えるような仕組みになっているため、記事下などの任意の場所に以下のHTMLを書くだけで注目記事が表示されるようになります。

<div class="hatena-module hatena-module-entries-access-ranking"
     data-count="5"
     data-display_entry_category="0"
     data-display_entry_image="1"
     data-display_entry_image_size_width="115"
     data-display_entry_image_size_height="115"
     data-display_entry_body_length="0"
     data-display_entry_date="0"
     data-display_bookmark_count="1"
     data-source="total_bookmark"
>
  <div class="hatena-module-body">
  </div>
</div>

ブックマーク数ランキングも表示可能

　実態的にはサイドバーに注目記事モジュールを表示させるロジックを利用しているため、data-sourceの値を以下のように設定することで表示させるランキングを切り替える事ができます。

パラメータ	意味
recent-bookmark	はてなブックマーク新着
total-bookmark	はてなブックマーク数
access	最近のアクセス数

　その他の設定項目はデザイン画面で設定できる項目に準拠します。フッタに表示されるランキングが5つまでであるからか、data-countで5つ以上を表示させようとすると番号が出力されなくなります。ちなみに、以下のようなURLで注目記事内に表示されるHTMLが出力できます。

http://bulldra.hatenablog.com/entries_access_ranking_module?count=5&display_entry_category=0&display_entry_image=1&display_entry_image_size_width=115&display_entry_image_size_height=115&display_entry_body_length=0&display_entry_date=0&display_bookmark_count=1&source=access

まとめ

　以上の手順で、はてなブログのスマートフォン記事下に公式の注目記事モジュールを表示させることができました。ある意味では公式の「あわせて読みたい」にもなるかと思います。

　『はてなブログの記事下に関連記事を表示する「あわせて読みたいG」 - 太陽がまぶしかったから』はスマートフォンでも表示できるのですが、ブログカードだと画面幅が狭い時に見づらい事もあったり、表示速度が公式提供のものにはかなわないため、こちらの方法のがよいかもしれません。なお、設置サポートや表示スタイル／アルゴリズムのカスタマイズ等のご依頼がありましたらサポートライセンスの購入をお願いいたします。