読者です 読者をやめる 読者になる 読者になる

スマホ画面のサムネイル画像を丸くしてみました。


f:id:gtbb250:20150726143302j:image

はてなブログのサムネイル画像は、四角がデフォルトです。それを丸くするカスタマイズ記事を発見したので、早速チャレンジ。



▼TARA (id:tarapple)さんの記事です




まず、パソコンではてなブログのダッシュボードを開きます。
編集画面は、デザイン>スマホ>ヘッダー>タイトル下(スマートフォン用にHTMLを設定する)です。
そして、コードをコピペするだけです。簡単すぎる!







カスタマイズのカスタマイズ

  1. サイズを少し小さくした
  2. サムネイル画像の縁を消した

カスタマイズ後、スマホページを確認したときに画像の主張をすごく感じたので、サイズを少しだけ小さくし、画像の縁取りも消してみました。




<style type="text/css">
.list-entry-article .thumb-image 
 {
 width: 90px; /*サムネイル画像の横幅*/
height: 90px; /*サムネイルが画像の縦幅*/
border-radius: 4em; /*サムネイル画像の角の丸みをなくす*/
 }
</style>


カスタマイズ前

f:id:gtbb250:20150726141752j:image

カスタマイズ後

f:id:gtbb250:20150726142156j:image

可愛いと思いませんか…!
シェアボタンも丸いので、統一感が出た気もする。

▼丸いシェアボタン、フォローボタンを設置






このブログに対して、「ブックカフェ」みたいなイメージがあるって言ってもらえてとっても嬉しかったです。
私の拙い文章や、へっぽこカスタマイズでそう思ってもらえてるなら、どんどん磨いていきたいなと思うのです。

これからも、読み手にとって見やすいものにするという視点を忘れないようにしつつ、spice of a dayっぽいブログカスタマイズに取り組んでいきます。