ブログのデザインを変更しました♡
以前までは私の大好きなピンクがギラギラしていたのですが、このブログは男性読者さんも多いのでピンク感を減らしてすっきりとさせてみました。
使わせていただいたテーマは、こどみす/codomisuさんのMinimalismです。
デモサイトを見てもらうとわかる通り、とってもシンプルで見やすいのが魅力です。
またテーマを導入してからやることも説明されており、とてもわかりやすいため初心者ブロガーさんにもおすすめ！
今回は、先人の知恵を借りてこのMinimalismを使ってブログをカスタマイズしたのでメモがてらご紹介します。
ナビゲーションメニューの変更
もともと用意されているグローバルナビゲーションのアイコンが、私のカテゴリーと合わないため変更！
こちらの記事の、
シンプルで美しいはてなブログの新テーマ「Minimalism」を公開しました。 – ひつじの雑記帳
「テーマを導入してからやること」 でも紹介されているのですが、これがやや手こずりました。
その通りやっても、何故かアイコンが表示されない。
アイコンは「FontAwesome」が使われていますので使い方を色々調べました。
参考にさせていただいたブログは、こちら↓
☝︎このサイトの手順1は「Minimalism」では、省いた方が良さそうです。（すでにデザインのCSSに書かれているのかしら。手順1をしたら不具合おきました。）
それから手順に沿ってコピペをしてみても、アイコンによっては表示されないものがありました。
そんな時は、
<i class=”fab fa-twitter”>
この「fab」を「far」とか「fa」に変えたら表示されるものもあったので、参考に書いておきます。
試行錯誤しーの完成！
可愛いー♡
シェアボタンの変更
「Minimalism」には最初からスタイルが記述されているので、手順に沿ってコピペするだけ！
しかし、標準搭載のものがモノクロでシンプルすぎたためカラフルに変更しました。
参考にさせていただいた記事はこちら↓
丸いアイコンを選びましたよー！
コピペで苦労することなく変更できました！
かわい〜♡
見出しを変更
標準搭載の見出しは、大きな文字になるだけのシンプルなものだったので大好きなピンクに可愛く変更！！
参考にさせていただいた記事はこちら↓
色見本はこちら↓
パステルピンクに変更しました。
こんな感じー！↓
可愛いー♡
マーカーラインを導入
様々なブロガーさんが使っていていいなーって思っていたマーカーラインをこれを機に導入してみました。
参考させてもらった記事はこちら↓
太字と斜体でそれぞれ以下のようなマーカーがつくようになりました！
可愛いー♡
パンくずリスト階層化
前のブログデザインの時も導入していたパンくずリストの階層化！
しかしテーマ変更したら、ズラーーっと親カテゴリのみならず子カテゴリも並んでしまったのでスッキリと設定し直しました。
参考にさせてもらった記事はこちら↓
雑記ブログを書いている人は、見安くするためには必死じゃないかなーと！
またGoogle Chromeちゃんにもみやすくなって、検索上位表示されるようにもなるとか。
アドセンス自動挿入の設置
今回一番苦労したのが、アドセンス自動挿入！
Googleアドセンスも新しいサービス、アドセンス自動挿入を試してみました。
どこに広告を表示するか設定しなくても、アドセンスが勝手に最適な場所を見つけて広告を出してくれるという。
参考にさせていただいた記事はこちら↓
この自動広告の効果を試すべく、今まで設置していた広告を削除しました。
（すでに設置してあるアドセンスは削除しなくても、AIがそれを考慮した上で最適な場所に広告表示してくれるらしい。）
が、しかし、
自動広告が記事の真下の真下にしか表示されませんでした。
自動広告で収益上がったっていう記事や広告が記事内にも表示されるという記事を何個も目にしたんだけど、私の場合は待てども待てども記事下のみ。
1日試してみたら今までそこそこに入っていた収益が10円とかになってしまった(Ｔ＿Ｔ)
結局自動広告はそのままに、見出し前と、記事下、あと関連を設置いたしました。
以下の記事も参考にさせてもらいました。
english-apple-diy.hatenablog.com
カエレバのデザイン変更
楽天やアマゾンの商品を紹介するときに便利なカエレバ！
そのデザインも変更しました！
参考にさせてもらった記事はこちら↓
まとめ
カスタマイズってやり始めると止まりませんね。
あれもこれも変更したくなり、せっかく変えたのに他の方が魅力的に感じたりして。
今の所フォローボタンや読者ボタンを設置していないので、まだまだカスタマイズの日々は続きます。
CSSやHMTLは詳しくありません。
先人の知恵を借りて、ほぼコピペでここまでやってみました。
はてなブログをカスタマイズする方は、参考にしてみてください。
