グローバルメニューを作ってみた!  目がウロウロしたよ!

こんにちは、てんです。

マイコン使用歴は20年以上です。あっマイコンが分からない?

マイコンピュータの略で、マイコンです。

 

先月から始めたブログのデザインに手を入れたので記事にします。

やり方ではなく、感想の記事です。参考にしたサイトは分かりますよ。

 

 

グローバルメニューバーってなに

ブログの記事はざっくりとでもだいたい分類されているものですが、

希望する項目へジャンプできるボタンが設置されているのが

普通というか親切です。

 

多くの開設者さんはこのボタンを作ってヘッダーの近くに設置しています。

これがグローバルメニューバーと呼ばれているものです。初めて知ったよぉ。

 

最初にブログに訪れた時には「ブログのタイトル」とともに

整然としたデザインとして目に入りますね。

これがなんでか気になって、自分のブログに入れたくて仕方なかったのです。

記事も書きながらずっと心にありました。

 

グローバルメニューバーを作りたい

さっそくググります。#クソババアサロン の先輩たちはそりゃもうガンガン行こうぜの精神で邁進中ですから、まずは己でやってみます。

 

多くのはてなブロガーの先輩たちが このグローバルメニューバーを自分で設置されていました。

最終的に参考にして実装までこぎつけたのは これ!

ゆきひーさんのブログ。 ★実際に参考にしたページは↓

www.yukihy.com

 

2015年12月の記事です。

色々な人が参考に作っていた様子です。

 

 

横文字とカタカナに悩まされる

最近仕事でも書類にみだれとぶ横文字にめまいがするというのに、もうブログ設定などとなると、HTMLやらCSSやら意味は知らずとも、英数文字が直接目玉から脳みそを襲うくらいのダメージ。

 

しかし何度も「このグローバルメニューが…」とググってはクラクラするのを繰り返している段階で、とっととやってしまうしかないと思いました。

 

いくつかの先輩方の設置記事を読んだ結果、上記のゆきひーさんの記事でやってみる事にしました。

 

 

地道にあきらめず

作業時間は1時間でした。

トグルとドロップダウンという表記方法を選択。

意味は良く知らないが

「確かスマホとPC両方で表記させたいなら、これだよね…」と できるかどうかよりも、やるならこれだと選びました。

 

そもそも注意点や説明にある用語すらも分かっていません。

作業しながら「子メニューってこれか」とか「段階層って?」などと日本語ですらあやしい!

 

この作業で新しいHTMLやCSSを導入することは、それまでのものが崩れてしまう可能性があるということ。

したがって、事前にメモを取っておくようにとよそのサイトでも重々注意がされています。

 

もちろん素人で「なにかおかしくなった」となったとしても修復修正をできる私ではありません。

しかーし、…やりませんでした。

メモを取るってどうするん?ワードかエクセルにするのかなぁ

と言っている間に頭がzzz…。

けっきょく人生と同じように、やっちまえ!ってやりました。

この方法は完全に自己責任です。

 

勢いだけの私のようですが、色を変えるかどうかは少し悩みました。

なぜならすでにこの時点で40分くらい経過していたからです。

でも…黒いメニューバーをみるたびにウキウキしないのです。

もうやります。できました。

 

どうしても設置したい、自分の好みに作り上げたい

HTMLやCSSが多分プログラムで、その中身まで分かった方が

何かと絶対便利なんだろうなぁと今回も思いました。

でも先輩方のおかげでどうにかもできました。

 

見た目だけとはいえ、服や髪型、部屋やデスク上などと同じように自分の大事な場所です。気分の良い方がいいの。

 

気分が変わったら色も変えられるし、(多分忘れてると思うけど)とっても満足です。作業達成感の方が今は強いかもしれませんが、それでも記事を書くたびに良い気持ちでできそうです。

 

 以上、グローバルメニューバー設置してみた感想でした。