Stickyスティッキーを無料のUltimate Addonsヘッダーメニューに

WordPressのElementor Header & Footer Builderプラグインは名称が「Ultimate Addons for Elementor Lite (UAE Lite)」に変更になりました。

Elementorの有料でしかできないヘッダーとフッターを自分で作ることができるので、ご利用されている方も多いと思います

このUltimate AddonsヘッダーメニューをStickyスティッキーにしたいと思います。

スティッキーメニューとは、Webサイト上でユーザーがスクロールしても画面上部に固定表示されるナビゲーションメニューのことです。
「スティッキーヘッダー」や「固定ヘッダー」とも呼ばれます. 上からヌルッとあらわれて、
これにより、ユーザーはサイト内を移動する際に常にメニューにアクセスでき、利便性が向上します.

プラグインで新規の検索。myStickymenuと、検索します

インストールして有効化します


有効化したらダッシュボードに下記の「mySticky Bar」が表示されるので、下記の赤丸をクリック

下記の2つの赤丸部分を設定(mStickymenuをオンにしてス、Slideの部分にチェック入れます)

SAVEボタンでいったん保存します。
このままではトップページのメニューはまだ動かないからです。

いったんTOPページを表示させて、検証画面へ
(検証画面を開くショートカットキーは、Windowsでは Ctrl + Shift + I、macOSでは Command + Option + I です。また、F12キーでも開くことができます。)

ヘッダーメニューにあたる部分のCSSクラスをさがします。
.elementor-elementが怪しそうです。

それを下記に入力します


SAVEボタンでいったん保存し、トップページを確認します。

無事にStickymenuが動きました

色や透明度などは赤丸から

ちなみにこの画面を日本語化すると

透明度と色だけ設定すればOKな感じです

上部へスクロール