Midnight the Gathering

Midnight the Gathering

僕なりの愛ですよ

【CSS】グローバルメニューの設置

f:id:tepped:20200512133233p:plain

 

今回は、”グローバルメニューの設置”についてのご紹介。

 

私のトップページは、

アーカイブをカード型で一覧表示する形式になっています。

そのため、サイドバーであるカテゴリーが

どうしても下層部に位置してしまい、スグ見れず不便でした。

 

その為、ヘッダーへメニューを設置する事にしました。

 

詳細は下記ブログ様を参照下さい。

 

2段階層まで設けてあるので、カテゴリーの細分化が出来ます。

また、横幅が狭いとトグルメニューに切り替えてくれる機能も搭載。

タブレットスマホでの閲覧でも見やすくなっています。

 

トグルメニュー とは... 

エクセルで言うところのプルダウンメニュー(ドロップダウンリスト)。

 

f:id:tepped:20200502192620p:plainf:id:tepped:20200502192640p:plain

これは、私のタブレットから見たトップページです。

トグルメニューはこんな感じです。

左上の”MENU”を押すと、カテゴリーが下に展開されます。

 

f:id:tepped:20200502043355p:plain

現在は、サイトを表示して即目視で確認できる位置にあり、

アクセスが容易!便利になりました。