ここしばらく、ブログのデザインを変えたり、色々とカスタマイズをしていました。
あれこれ失敗しながらのカスタマイズだったので、せっかくブログを訪れて下さったのに、ちゃんと表示されないことがあったかも、、、。お目汚し失礼いたしました。
カスタマイズ、親切に How to 記事を上げてくれている方のおかげで、なんとか自分で出来ました。
パソコンを使って調べれば大抵の答えが見つかるって、ホントに便利な時代ですね。
とはいえ、めっきりデジタルやらなんやらに弱くなってしまった私なので、知らない言葉がたくさん並んでいる「やり方」を読んでも、中々頭に入ってこない。
特にカタカナ文字は、自分の思い込みで読みがちで「トグルメニュー」は「グルメメニュー」とか。
「ハンバーガーメニュー」っていうのを調べようと思って、「ハンバーグメニュー」で検索してハンバーグのレシピとかレストラン情報しか出てこなかったり。
カスタマイズを終えるまで、まぁ時間はずいぶんかかりました。
私の理解が間違っていて、誤った情報を拡散してしまっては大変なので、詳しいやり方はブログ上に載せるのは控えることにして、自分がどこをカスタマイズをしたのかだけ、覚え書きとして残したいなと思います。
元々のデザインからこんな風にすることができました〜という記録ですが、ど素人の私でもここまではできたという記録が、カスタマイズを考えている人の参考になれば嬉しいです。
記事の最後に、参考にさせていただいて、とても助けられたリンクを貼らせていただきます。
テーマの変更
ブログを始めた時に選んだのは、はてなの「Smooth」というテーマ。
それに青緑っぽい背景画像を合わせていました。
これも気に入っていたのですが、何となく文字のフォントがしっくりこない感じ。
私は、シンメトリーとか、物が規則正しく並んでいるのが大好きなので、画面の中の文字のフォントが統一されていないのが、何となく落ち着かない。
それ以外のデザインは、慣れたせいもあってとっても使いやすい。
それで色々見ていたら、デザインは似ていて文字のフォントが統一されている「Haruni」というテーマを見つけました。さらに、記事の囲み部分の角が丸かったり、全体的に柔らかい印象。こちらのテーマに変更することに決めました。
ブログ全体の色を変えて、更にヘッダをデザインしました
「Haruni」を使っている方のブログを見ると、上手にカスタマイズされている方がたくさんいて、同じテーマを使っているように見えない個性的で素敵なデザイン。
私も、挑戦してみました。
右：貼り付けてみます
グローバルメニューを入れました
（思い出そうと思うと、ワールドメニューとか言いそうになってます）
グローバルメニューと同じ機能ですが、
トグルメメニューとかハンバーガーメニューと呼ばれるみたいです。
このカスタマイズをやらなければ、一覧になってる帯状のやつとか、よく右上にある丸いやつって呼んですませていたと思います、、、。
シェアボタンをちょっとかわいく
そのために、Font Awesome っていうのも導入しました。
こちらの シンプルなシェアボタン - Haruni を参考にして挑戦したのですが、なぜかTwitterのアイコンだけが表示されませんでした。
本来あるべき場所にあるようなのですが、アイコンの色が「背景と同じ白」になってしまって、見た目は表示されてないような状態になっていたようです。
それで、Font Awesome のサイトに行って、最新版のものを導入したところ、ちゃんと表示されるようになりました。
Font Awesome の導入の仕方も、「Font Awesome の導入 やり方」などで検索すると、説明してくださっているサイトが見つけられると思います。
実のところシェアボタンの意味がいまだによく分かってないのですが。
あとは、パンくずリストをオンにしたり、はてなブログの設定をちょこちょこ変えました。
カスタマイズをし始める前にやればよかったと思ったこと
自分のブログをもう一つ作ること。
私は、はてなブログの無料版を使ってブログを書かせてもらっていますが、無料版のアカウントでもブログを３つ作ることができます。
カスタマイズにあたって色々調べていると、「メインブログを丸ごと複製したもうひとつのブログ」を作り公開設定を自分のみにする方法がおすすめされていました。
こうすると、カスタマイズをしたら実際どんな感じになるのかチェックできるので、人様にお見せできる状態じゃないものを公開しないで済むし、メインブログのバックアップにもなります。
やり方は、「はてなブログ 丸ごとバックアップ テストブログ」などで検索すると、丁寧に説明されている方のサイトが見つけられると思います。
こんな感じで、何とかカスタマイズをやり遂げました。
色々とカスタマイズするために、よく分からない記号とかコードとかを決められた場所に書き込むと、設定がパッと変わるんです。コンピューターってすごい、作った人すごい！！
コンピューターやスマホもあるのが当たり前になりましたが、こういうものを日々開発してくれる賢い人に感謝。おかげで日常生活がほんとに便利になりました。
今回のカスタマイズの際にお世話になったサイトはこちらです。
色を変更するときは、ここから色のコードを探します。
アンミカさんが、「白って２００色ある」とおっしゃっていましたが、ウェブ上の色もきれいな色がほんとにたくさんあって、これ！って決めるのが大変。
「Haruni」を作成した方のサイト。ここに書かれていることを何度も読みました。
ヘッダのデザインをここで作りました。
https://www.canva.com/ja_jp/learn/how-to/
ヘッダのデザインの変更の際、参考にさせていただいたブログ
Font Awesome のサイト
