【ブログカスタマイズ】グローバルメニューを設置しました
こんにちは。ぴこりあです。
『手仕事だったり、ちがったり』を始めてちょうど1ヶ月が経過しました。
私の利用しているはてなブログには、はてなブログユーザーが作成したブログ用のテーマデザインをインストールして使える機能があります。
テーマストアにはおしゃれなテーマがたくさん並んでいて、自分のブログでプレビューしてみるだけでも楽しすぎ!
迷いに迷ってJOURNAL.を利用させていただいています。くすみピンクやベージュを基調としたデザインで、大人かわいくて大満足♡
インストールするだけで充分おしゃれになりますが、読みやすさや自分らしさを出すために、少しずつカスタマイズを進めています。
テーマ必須項目の設定
まずは、このテーマにおいて設定必須とされている下記の項目について設定しました。
- スマホからも同じデザインで見られるようにする
- Webフォントを読み込む
- ブログタイトルの背景画像 ※2021.6.27現在 この設定はしていません
- メニューの設定
これらは、テーマ作者さまの見本ブログのとおり設定しています。
Webページの作成については、HTMLの言葉を聞いたことがあるくらいの全くの素人ですが、記載されているコードを指定されたところにコピペして、必要なURL等を書き入れるだけでできてしまうので、とっても簡単でした。
グローバルメニューの設置
今回はこの中の、4.メニューの設定をしたよという記事になります。
と言っても、設定の仕方は上記のブログにわかりやすく書かれていますので、実際に設定する際に考える必要があったことなどを、備忘録を兼ねて書きたいと思います。
どのカテゴリーを表示させるかを決める
ますはじめに、どのカテゴリーをメニューに表示させるかを考えました。
ハンドメイド作家の活動の一環で運営しているブログなので、『手仕事』『作品の購入・オーダー』『お問い合わせ』のみにすることも考えましたが、picoriaの作品に興味をもってくださった方に、こんな人が作った作品なんですよというのが伝わるように、ハンドメイド以外の事柄について書いている『ちがったり』も追加しました。
『お客様の声』は『作品の購入・オーダー』の子カテゴリーですが、多くの方に見ていただきたいので載せています。※はてなブログにはカテゴリーの階層化の機能がありませんが、後日行ったカテゴリーの階層化によって子カテゴリーを作成することができました。
私はカテゴリーの数が多くないのですべての親カテゴリーを表示させていますが、たくさんのカテゴリーがある場合は絞る必要がありそうですね。
メニュー名の表記
それぞれに合ったアイコンをつけることも考えましたが、シンプルに ▶︎ をつけています。ブログの背景に三角のタイルのような模様を設定しているので、それとも合っていて個人的に気に入っています。
▶︎ をつけずにカテゴリー名だけも良いですが、なんとなく寂しかったのです。
今後追加でやりたいこと
メニュー項目を階層化したいです。
いろいろな素敵なブログを拝見していて、メニュー項目からドロップダウンして子カテゴリーが現れる仕様になっていると、読みたい記事を探しやすいので取り入れたいなと思っています。
最後に
ブログをカスタマイズすることでデザインを自分好みにすることはもちろんですが、訪問者の目線でわかりやすく、惹きつけるページ作りが重要です。
これからも様々な魅力的なブログを参考にさせていただきながら、読みやすく長く滞在したくなるブログを目指して、必要に応じてカスタマイズしていきたいと思います。
今日も最後までお読みいただきありがとうございました
クリックで応援していただけると嬉しいです♡