Vektor WordPress Solution
VWSとは › フォーラム › Lightning › Lightning Skin Fortのスクロールによるnavbar-headerの固定
本日lightningProのFortスキンを購入したのですが、今までのOriginではヘッダ固定がロゴを含めて固定されていたのですが、Fortではメニューのみ固定の仕様となっていますが、Originと同じようにロゴなども含め固定するにはどのようにしたらよろしいでしょうか?
よろしくお願いいたします。
子テーマの functions.php などに
// ヘッダー固定用のclassを追加 add_filter( 'body_class', 'my_body_class_add_headfix' ); function my_body_class_add_headfix( $class ) { $class[] = 'headfix'; return $class; }
子テーマの style.css などに
@media (min-width: 992px){ body.header_scrolled .gMenu_outer, body.header_scrolled.admin-bar .gMenu_outer { top:inherit; } body.header_scrolled .navbar-header { margin-bottom: 0; } } @media (max-width: 991px){ body.admin-bar .siteHeader { padding-top: 0; } }
でいけると思います。
全てのWordPressテーマで使える!デザインをピンポイントで変更する方法 〜親テーマのCSSは書き換えないで〜
お返事が遅くなり申し訳ございません。 お陰様で無事固定出来ました。ありがとうございました
ヘッダ固定を行うと、同一ページのアンカーをクリックすると想定以上にズレて表示されます。 スムーススクロール機能をオフにしたりオンにしたりしましたが解決しませんでした。
https://github.com/vektor-inc/VK-All-in-One-Expansion-Unit/commit/f9656f78fe6933adaa96dfa28a7b09eca49c9c21
こちらのJavaScriptが使われているのでしたら、jQuery(‘body’).hasClass(‘headfix’)が jQuery(‘body’).hasClass(‘siteHeader’)にしたら良いのかなどご教授を頂けたらと思います。
お手数をお掛けしますがよろしくお願いいたします。
Fort II で上記のようなカスタマイズを何もしていなければ ロゴこそ表示されませんがページ内リンクの際にヘッダー固定は一旦消えるので違和感なく表示されますが、 やはりヘッダーは初期状態で固定でないとダメ…でしょうか?
まさにFortIIでロゴを表示して、上記設定を行っています。 ロゴを表示もそうですが、先方からフリーダイヤル等は表示しっぱなしにするよう指示を受けていています。 なのでどうしてもSiteHeaderを固定するしかないのですが、何か良い方法はないでしょうか?
本当に申し訳ございません。よろしくお願いいたします。
function my_disable_skin_header_prefix() { remove_filter( 'lightning_localize_options', 'lightning_fort_add_js_option', 10, 1 ); remove_filter( 'lightning_headfix_enable', 'ltg_fort_headfix_disabel' ); } add_action( 'init', 'my_disable_skin_header_prefix' );
Fort II をご使用の場合、以前(2019年)のカスタマイズを破棄したうえで、 上記コードを functions.php に記述すればOKです。
旧設定を破棄した上で教えて頂いたコードを追加してみました。 ヘッダー固定は変わらず表示されていますが、アンカーのズレなども変わりませんでした。
申し訳ございません。 Elementorを当方導入しています。 どうやら、Elementorのsmoothscrollも効果が出ていてズレているかも知れません。 もう一度Elementorの設定など見直してみます。 お手数をお掛けしました。申し訳ございません。