はてなブログのカスタマイズ - Bootstrap Navbarの設置

公開:2014-09-06 21:27
更新:2017-07-29 13:17
カテゴリ:javascript,bootstrap,はてなブログのカスタマイズ,boost

今日はサイドバーのモジュールをBootstrapのNavbarに変換するコードを書いていた。NavbarはJSに依存しているのでCSSのカスタマイズだけでは対応できないので、フッター下にサイドバーメニューを変換し、Navbarを表示するコードを書いている。
Navbarの実装にあたりBootstrapのCSSも必要となったため、ヘッダーでインポートするようにしている。

で、いま表示している一番上のメニューがNavbarで作ったものだ。Bootstrapデフォルト丸出しのデザインだが、私は気に入っている。モバイルにすると縦方向のメニューになったりするところが。

サイドバーをメニューにしたので、ブログは1カラムのレイアウトになった。あとはメニューに利用しているWebサービスへのリンクとか追加したいなと思っている。