MENU

アフィリエイト広告を利用しています

クムテジ食堂
ラミチェ皮膚科
花西子
海外旅行eSIM

【ブログカスタマイズ】初心者でも大丈夫!はてなブログのカスタマイズでお世話になった おすすめサイト

こんにちは!

 

はてなブログを初めてもう4ヶ月。初めは続くかな~と不安だったブログですけど、マイペースになんだかんだで続いてます!😊

何気なく選んだはてなブログだったんですけど、いろいろカスタマイズできて、楽しくてすっかりはまっています。

 

ということで、今日はブログのカスタマイズでお世話になったサイトをご紹介させていただきます。

 

皆さま、コピーするだけでOKなど、コードを無料で公開してくださっているので本当に感謝しかありません。

ありがとうございます😭

 

目次

まずはこの↑上の部分、目次のデザイン。

minimalgreen様のステッチ風の目次デザインを使わせていただいてます。

 

blog.minimal-green.com

 

この他に見出しデザインもストライプとか、マスキングテープ風とか可愛いのがたくさん。

説明もとても丁寧でわかりやすく、コピーするだけでOKなものが多いので初心者でもわかりやすいです。

 

記事の中でこんなデザイン使いたいな~、ここに枠が欲しいな~と思ったら、minimalgrenn様のブログでカスタマイズのデザインを探して、そしてお借りしてきています😊

 

グローバルメニュー

グローバルメニューとは、ブログタイトルの下に表示されているHOMEや旅行などのメニューバーのこと。

私のブログでは、これです。

グローバルメニュー

これはパソコンから見たバージョン

このグローバルメニューはゆきひー様のブログを見ながら設置しました。

 

www.yukihy.com


普通のブラウザサイズだとグローバルメニューで、スマホとか画面が小さくなった時はトグルメニューになるというカスタマイズ!

 

これまた初心者の私でも、読みながらやったら設置できました。

均等に配置するのとか、途中読み飛ばしたらわからなくなったので、コードなにそれ?というカスタマイズ初心者の方は、上から順番に読みながら進めていくことをオススメします😂

 

グローバルメニューで一番悩んだのは色の設定。

自分のブログのカラーが決まっていたらすぐに設定できるんですが、私が自分のブログにこれを設置したときはまだなにも決めていなかったので、あれこれ色を変えては、なんか違う!もう一回!とあーだこーだしてたら、必要なコードを消してデザインが崩れてイチから設定しなおしになったり・・。

設置とは違う部分で苦戦しました。

 

グローバルメニューをこれから設定しようと思っている方は、カラーを決めてから設置することをオススメします。その方がスムーズにできます😂

 

カテゴリー

はてなブログのカテゴリーを階層化したい!と思って検索してみたら、ありました。

ちなみに階層化というのは、▲の部分をクリックすると▼子カテゴリーが表示される形式のもの。

カテゴリーの階層化とは

 こういうの。

 

WorldWorldWorld様の記事を見ながらやったら、これまた無事に設定完了!

blog.wackwack.net

 

細かく図解入りなので、わかりやすいです!

 

記事が多くなってから設定となると、ひとつひとつ記事のカテゴリーを修正しなきゃいけないのでちょっと大変かと思います・・。なので早い段階で設定しておくのがオススメ。

 

ヘッダー下にオススメ記事を並べて表示

最後は、先日したばかりのカスタマイズ!

トップページから見たときに表示されているこの部分。

オススメ記事の表示

 ブラウザからだと横並びに4つの記事。スマホなどからだと、2列表示で常にトップページのヘッダー下に表示されるようにしています。

f:id:mameriday:20190323091059j:image

これはスマホから見たときのトップページ。

 

これはバンビ様のブログを見ながら設定しました。

www.bambi.pro

 

アクセスの多い記事を、トップページに固定させました😊

アイキャッチ画像は、統一感を持たせるようにはしたんですが・・・なにせセンスが問われるので難しい💦

全部同じデザインで統一感を持たせた方が良かったかな・・とかまだ悩んでます。

 

人気の記事が変わってきたら、都度変えていく予定です!

 

いまのとこ私のブログで一番アクセスが多いのは、CNPのビタBアンプルインクッションです。

www.happysunnyday.net

 

 

以上、私がカスタマイズするときにお世話になった方々のご紹介でした!

コードとか全くわからない私でも、丁寧な説明とコピーするだけでOKというコードを公開してくださっている皆様のおかげで、ブログのカスタマイズができています。

本当にありがとうございます。

 

これからブログのカスタマイズをしようかと考えている皆様。

検索したら、ほんとたくさんの方々がカスタマイズのコードを公開してくださっているので、色々と検索してみてください😊