すぎ日記 育児 , 生活 ,仕事 など

アラサー 男 育休中

グローバルメニューを作成しました ( はてなブログ 、 テーマ : Haruni )

こんにちは。
最近、そういえばブログのデザインって変えられるんだったよなぁと思い、デザインをいじってみております。
直近は「グローバルメニュー」とやらを作ってみました。

これのこと、グローバルメニューって言うのですね。

 

グローバルメニューの作り方

 

ググってコピペです。
設定>デザイン>ヘッダ のところで、

  • 「ブログタイトル下」にHTMLのコードをコピペ(各メニュー名とリンク先は変える)
  • 「{}デザインcss」にcssのコードをコピペ

です。

 

ちなみに、ブログ全体の雰囲気(テーマ)を、設定>デザイン のところから Haruni というテーマに先んじて変更していました。
なぜHaruniにしたかというと、少し調べたところHaruniが人気で、どんなブログにもフィットしそうということだからです。

 

詰まったところ

拾ってきたHTMLとCSSのコードをコピペするも、グローバルメニューが縦に並んでしまうという事象が発生しました。
よくよく調べると、メニューを横に並べるためにはCSSに「flex」とか、「float」、「display: inline-block」というキーワードを使うらしいです。そしてコピペに使ったサイトのコードにはこれらが全くありませんでした。。HTMLもCSSも知識ほぼなしのため全然気づきませんでした。まともそうなサイトにも間違ったコードが書いてあることがあるようなので気をつけてください(^_^;)
うまくいかなかったら、CSSにこれらのワードのいずれかがあるかな~と見てみたらよいかもしれません。

 

こちらのサイトを参考にいたしました。コードも拝借しました。

ありがとうございました!!

gray-code.com