くうかんしんぷるライフ

賃貸2LDKのおうちでも快適に、シンプルに暮らしたい

- Pickup -

エコ洗剤活用術
メゾネットのメリットデメリット
2LDK
スプレッドシート

はてなブログのテーマ『Minimalism』で行ったカスタマイズ総まとめ

こんにちは、くうかです!
当ブログははてなブログのテーマ『Minimalism』を利用して10か月経過しました。
そろそろカスタマイズも終えたこととして、私が今まで行ってきたMinimalismのカスタマイズをまとめて記事にしておきたいと思います。

 

 

はてなブログのテーマ『Minimalism』で行ったカスタマイズ総まとめ

f:id:ku-kahan:20190123142113p:plain

 

『Minimalism』のスマホ版で太字が表示されない問題を解決

Minimalismをお使いの方で、スマホで太字が表示されていないことにお悩みの方はぜひ参考にしてもらえたら嬉しいです!
ほんの3行で直ります。

www.kurasitotonoe.com

Minimalismのみの問題であると思いますが、ブログの閲覧ユーザーはほとんどモバイル端末からですので、直しておいた方が良いです!
太字のない文章は、単調になり読みづらい気がします。

 

『Minimalism』のフォントの大きさと種類をカスタマイズ

はてなブログはフォントが小さい!
ということで、フォントを大きくするカスタマイズと、Minimalismをお使いの方向けのフォント種類を合わせるカスタマイズ。
さらに強調したい部分に黄色マーカーを引くカスタマイズを行いました。

www.kurasitotonoe.com

 

Canvaを使って素敵なブログヘッダーを作成&目次・見出しのカスタマイズ

CanvaというWebツールを使い、素敵なブログヘッダーを作成しました。
さらに見た目のカスタマイズとして、目次・見出しをカスタマイズしました。

www.kurasitotonoe.com

Canvaではアイキャッチ画像や、ブログのアイコンまでお世話になっています。

 

ヘッダー画像の余白を取り、スマホ表示も美しく対応したカスタマイズ

ヘッダー画像を作成したら、画像の周りに余白ができてしまう問題が発生!
その対応をしました。
スマホでの画像がずれる問題も解決しています。
Minimalism以外のテーマでも使えるカスタマイズです。

www.kurasitotonoe.com

 

Google AdSensの広告配置のカスタマイズ

広告の種類と配置位置のカスタマイズをご紹介しています。

www.kurasitotonoe.com

現在は表示速度の改善のため、自動広告は外しています。

 

ブログの表示速度を改善するカスタマイズ

訪問者様のために少しでもブログを軽くしよう!と思い、速度改善を始めました。
画像圧縮とはてなフォトライフを使った速度改善をご紹介しています。

www.kurasitotonoe.com

 

その後、改善されたのかをまとめた記事です。

www.kurasitotonoe.com

 

商品紹介にカエレバを導入

カエレバを導入してASPの収益化を目指します!

www.kurasitotonoe.com

 

フッターにコピーライトを表示する

フッターのコピーライトってあまり気にしてなかったのですが、あったほうが見た目もいいし…と思い、シンプルなものを付けました。

f:id:ku-kahan:20190730164820p:plain

上記赤枠の部分です。
背景白で本当にシンプルです(笑)

▼参考にさせて頂きました

blog.minimal-green.com

 

スマホの固定フッターメニュー(レスポンシブ対応)

使ってらっしゃる方が多いフッターメニューは、レスポンシブ対応でなかったため、こちらのサイトを参考にさせていただきました。

www.bambi.pro

レスポンシブ対応、いいですね。
PCとスマホで別々のカスタマイズをするのは面倒なので(;´∀`)

 

設置には少々苦労しましたが、スマホユーザーの方が多いのでスマホファーストなサイト作りはしておいて損はないと思います。

f:id:ku-kahan:20190730164756j:plain

↑このような表示が出ます。
メニューの内容はカスタマイズしています。

 

固定メニューにカテゴリを追加

何があれば使いやすいのかなぁ?と考え、私はカテゴリを見たいと思うことが多いのでカテゴリを入れました。
それに伴いカテゴリも10こに絞って整理しました。

 

f:id:ku-kahan:20190730164806j:plain

↑カテゴリは2列表示になるようにしました。
幅を指定している部分を【width: 100%;】から【width: 50%;】に変更すると2列になります。

 

本当はカテゴリは細かく分けたい派なんですけどね…(; ・`д・´)

 

固定メニューに検索ボックスを追加

カテゴリの他に、検索もできると便利かな?と思い、検索ボックスを固定ページにて追加し、検索ボタンからいけるようにしました。

f:id:ku-kahan:20190730164812j:plain

 

▼検索ボックスの作り方はこちらを参考にさせていただきました!

diy-kagu.hatenablog.com

検索ボックスってあまり使わないかもしれないけど、使いたい時にすぐ使えると便利ですよね( *´艸`)
さらにおすすめの記事もちゃっかり載せてます。
これは私の備忘録で、自分が時々見たいがためのショートカットだったりします(笑)

 

最後に

今までカスタマイズはバラバラに記事にしていたので、こういったまとめがあったほうが良いかな、と思いまとめてみました。

 

カスタマイズは自分でできたら一番いいのだろうけど、私は一から作る技術は持ち合わせていないので、求めている内容に合った記事を探し出し、そこから自分流に少しアレンジを加えたりしてきました。
カスタマイズ記事は同じブロガーにとってはとても貴重な記事になったりもするので、残しておくことは大事だなと感じています。

 

Minimalismは白を基調としたシンプルなデザインでとても好きでしたが、1年位使っているとやはり他のデザインも試してみたくなります( *´艸`)
近々テーマ変更を行いますので、また見に来ていただけると嬉しいです♪

 

本日も最後までご覧いただき、ありがとうございました。