専業主婦Pさんのおうち

お小遣い0円の専業主婦が投資と節約を頑張るブログ~マイホーム計画中~

無料版はてなブログをおしゃれにカスタマイズする方法

こんにちは!

 

今回は、「はてなブログ無料版」をおしゃれにカスタマイズするために参考にしたサイトを記録として残します。

 

案外、無料版でも色々カスタムができるので、課金なしでブログを楽しめそうです♪

 

記事のサムネイルやヘッダーの画像作り

記事のサムネイルやヘッダーなど、私のブログで使われている画像全般、「Canva」で作っています。テンプレートや素材が大量にあり、無料範囲内でも十分素敵な画像が作れちゃいます!

https://www.canva.com/

プロフィール画像をオシャレにカスタマイズ

下記のフジプロっさんのサイトでは、ブログのサイドバー(PC)に表示されるプロフィールをオシャレにカスタムできます。デザインは10種類もあり、サイト内のフォームに必要事項を入力するだけで完成!神なのかな?

使い方も丁寧に説明されていますので、初心者でも作業は簡単でした💕

www.fuji-blo.com

 

ブログカテゴリーを可愛いアイコン(表)で表示する

カテゴリーのアイコン表示とは、これのこと↓です。

 

またまたフジプロっさんのサイトにて作れます。
こちらもフォームに入力するだけでOK。一気にブログデザインがオシャレになります。

www.fuji-blo.com

 

ブログのヘッダー下にオススメ記事を設置する

ブログヘッダーの直下にオススメ記事を4つ設置できます。特に読んでもらいたい記事やカテゴリーを目立たせることができます。

www.fuji-blo.com

 

ブログのヘッダー画像の調整(PCとスマホ)

ブログのヘッダーに画像を設置する方法として、参考にしたサイトです。

maysun53.com

ヘッダーを設置したものの、スマホ版と連動させる「レスポンシブ」をONにしているとスマホ版のヘッダー画像が切れてうまく表示されない!というときは、下記サイトが参考になりました。

www.fuji-blo.com

 

スマホ版のグローバルメニューを設置する

この方のブログ記事を参考にして設置しました。

miya-moto-blog.hatenablog.com

 

はてなブログのデザインテーマを使う

いくつか試してみて、マテリアルぽっぷが一番しっくり来たので使用しています。

blog.hatena.ne.jp

私のブログでは、マテリアルぽっぷのデフォルト配色を変更して使っています。変更方法は下記リンクにて説明されています。

demo-mamegoro.hatenablog.com

 

まとめ

紹介した作業をするだけで、ブログの雰囲気がガラッと変わって、こだわってます感が出ますね!

無料でもここまでカスタムできるとは、、、カスタム方法を共有されているプロの皆さまに感謝です~~♪