xeorybaseでナビゲーションメニューを固定させる

ナビゲーションメニュー(グローバルナビゲーション)を固定させたページはサイトを回遊しやすくていいですよね。
自分もやりたいと思うけどどうやったらいいのか…分からず苦戦しました。

今回は、そう言った悩みを解決する
Sticky Menu (or Anything!) on Scroll
というプラグインを紹介します。

※当サイトはxeorybaseをテーマに使用していますので、その前提で記事を書いてあります。

画像の赤枠で囲ってあるところをカスタマイズします。
では実際に設定してみましょう。

設定してみる

[ダッシュボード]→[設定]→[Sticky Menu (or Anything!) on Scroll]
もしくは
[プラグイン]→[インストール済みプラグイン]→[Sticky Menu (or Anything!) on Scroll]→[setting]

basic setting のタブを開きます。

①のところにxeorybaseのナビゲーションメニューのIDである #gnav と書き込みます。
②下にある青いボタンをクリック。設定を保存します。

それだけです!

あとがき

いかがでしたでしょうか。
記事を読み進めても、ぬるぬるっと上部のナビゲーションが追従してくれるようになりました。

これを設定すると
スマホからサイトを閲覧すると、固定させたナビゲーションが邪魔になって記事が全く読めなくなってしまいました。そこも設定をいじらないといけないかもしれません。

記事にしてみましたので、興味がありましたらこちらもご覧ください。
xeorybaseのスマホメニューをデフォルトで閉じておく方法

それでは。

スポンサーリンク

コメントを残す

*

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください