ちょっと息抜き

ちょっと息抜きのために活用しているブログです。たわいもないこととか、WordPressのことも少し、あとは占い関連のネタもちょこっと書きます。

はてなブログをカスタマイズしてみました

f:id:hukuhuku2:20170629083123j:plain

 

はてなブログをカスタマイズしてみました。今回は、デザインを変更・見出し装飾・Homeボタンをクリックすると記事一覧表示・スマホの記事一覧を5記事まで表示させるという方法。

 

 

デザインはMinimalism

 

 

 

Minimalismは、ことみずさんという方が作られたテーマですが、すっきりシンプルなテーマでレスポジシブ対応という部分がいいなぁと思い、使ってみました。

 

hitsuzi.hatenablog.com

 

  • メニューバーはアイコンが表示されています。可愛いです。
  • SNSボタンがシックなテイストです。目立つ感じでなかったため、一旦取りやめていたSNSボタンを復活させてみました。
  • サイドバーも綺麗です。

 

見出し装飾もカスタマイズ

 

ことみずさんのサイトで紹介されていた記事ですが、サルワカさんという方の記事を使ってみました。

 

 


saruwakakun.com

 

見出しデザインの種類が豊富なことと、見出しコードが探しやすい…親切な記事でありがたい!と思いました。

 

コードはh1になっていますが、はてなブログの記事見出しの場合、h3から始まります。大見出しがh3になっているため、CSSに張り付ける場合は、h3から用意するといいかなぁと思いました。

 

ちなみにh1もカスタマイズすると、タイトルが可愛く変更することができます。ただし、サイトタイトルもh1だったため、こちらも自動的にカスタマイズされてしまいました(;^_^A。

 

これはこれで可愛いため、このまま使用することに。

 

Homeボタンをクリックすると記事一覧

 

こちらは二つの方法がありました。伊藤さんという方が紹介しておられる設定方法を使ってみることにしました。

コピペでフッターに張り付ける方法でしたので、簡単に設定できました。

 

www.ito-tomohide.com

 

スマホのHome画面記事一覧を5記事に設定

 

さいごにHomeボタンをクリックすると、記事一覧が表示されるように設定したあと、今まで投稿した記事が全部表示されました。

 

おそらくみなさんの記事を読む限り、50記事まで表示されてしまうということです。

パソコンはこのままでいいにしても、スマホ表示はちょっと大変だ!と思い、いい方法がないか?探してみたところ WorldWorldWorldさんの紹介しておられるコードがいいのではないかと、さっそく使ってみました。

 

スマホ表示が5記事までになりました。

 

まとめ 

みなさま、ありがたく使わせていただきます(*‘ω‘ *)💛

 

気分転換できました。熱中症になりかけて頭がもうろうとしていましたが、カスタマイズが自分的に納得できる感じに仕上がったため、疲れが吹っ飛びました。

 

ほとんど、コピペで出来るので、この記事を読まれた方は、良かったら参考にしてみてくださいね~^^