はてなブログの人気記事を画像サムネイル付きでおしゃれに表示させる方法【サイドバーに画像付きの人気記事・最新記事を表示させる編】
はてなブログのカスタマイズ【サイドバーに画像付きの人気記事・最新記事を表示させる編】
以前、はてなブログの関連記事に関するカスタマイズ方法をご紹介させていただきましたが、今回はそのデザインに近い形で人気記事・最新記事を表示できるようにしましたので、参考までに。
ちなみに以前導入した関連記事はこちら▼ 現在も設置しています。
どんなデザインですか?
こんな感じです。2つ目の記事のアイキャッチ画像が拾えていないのは申し訳ないですが、基本は正常に動いています。
雑誌っぽい見た目と、オンマウス時のアクションが気に入ってます。
ブログパーツ設置の参考記事
画像サムネイル付きのおしゃれなブログパーツの設置にあたり、参考にさせていただいたのはこちらの記事です▼
2013年の記事のようですが、丁寧に説明されていて、カスタマイズも簡単でしたね。
「ちろる」さん、ありがとうございます。
カスタマイズ時の注意点
デザインテーマ次第で、人気記事のパーツを設置するときに横幅の調整が必要になると思います。
その際は、こちらのwidthの値を90%にしてみたり、110%にしてみたりと調整をかけてください。
.htbl_popular_entries { height: 100%; width: 100%; }
ちなみに、このサイトではアドセンスと同じサイズにしたかったので、110%にしてあります。