[ 解決済 ] ヘッダーメニューからのアンカー移動について
[ 解決済 ] ヘッダーメニューからのアンカー移動について
- このトピックには2件の返信、2人の参加者があり、最後に
により1年、 8ヶ月前に更新されました。
-
投稿
-
■ WordPress のバージョン
6.0.1■ テーマ・プラグインは全て最新版で確認してください。
確認しました。■ 子テーマをご利用の場合は親テーマに変更して症状が改善するか確認してください。
確認しました。■ テーマの種類
Lightning ( G3 ) + Lightning G3 Pro Unit■ テーマのバージョン
14.23.1■ Pro Unit のバージョン
0.22.2■ スキンの種類
Origin III■ 関連しそうなプラグインを一つづつ停止して症状が改善するか確認してください。
確認しました。■ 期待する動作
固定ページを2カラム（左にメニューなどを配置する形）にして表示し、メニューに001（#001）
002（#002）
003（#003）というリンクメニューをウイジェットで設置して、固定ページ内に各アンカーを打ったとします。
例えば003のリンクURLを「#003」とした場合、クリックすると対象のアンカーの場所に移動するのですが、ヘッダーメニューが下りてきません。
リンクを「https://〇〇〇.〇〇〇/#003」とフルパスにすればヘッダーメニューは下りてきますが、ExUnitのスムーズスクロールにチェックを入れてもスムーズスクロールしません。アンカーでページ内を移動してもヘッダーメニューが下りてきて、スムーズスクロールするようにしたいと思っています。
■ 自分で試した事
リンクURLを「https://〇〇〇.〇〇〇/#003」とフルパスにし、
「Page scroll to id」を入れれば、とりあえず希望の動作はしますが、できればプラグインが無くても希望の形にしたいと考えています。■ 症状が発生するブラウザ
エッジ、クローム■ 実際の症状
もしかすると、アンカーを入れた場所に移動した際にヘッダーメニューが下りてくると、コンテンツがメニューの下に隠れてしまうので、それを考慮した構造なのでしょうか？これについては現状、PCの場合のみアンカーにマージンを入れるなどして対処しています。
> もしかすると、アンカーを入れた場所に移動した際にヘッダーメニューが下りてくると、コンテンツがメニューの下に隠れてしまうので、それを考慮した構造なのでしょうか？
はい、そうです。
* スクロールするとbodyに識別用のclassがついて、そのクラスがあるとヘッダーが降りてくるようになる。
* ページ内スクロールがあった時点で識別用のclassを一旦外すという処理をしています。
* ヘッダーの高さや、スクロール後に上部にどれくらい余白を持たせたいかは人によって異なるため、固定ヘッダーを一旦外した方が多くのユーザーに安定してページトップに表示させられる
* ページを見たらほぼほぼスクロールするので、スクロールすればまた固定ヘッダーは降りてくるという理由で不特定多数に対する最適解はこうだろうという意図での仕様です。
解除するフックを実装する事は不可能ではありませんが、結局それを利用するにはコードで外した上でCSSでごにょらないといけないので、手間としては現状カスタマイズされている方法と結局大差ない状態でしかないので、私としては対応フック実装・カスタマイズ検証するより、全ユーザーに恩恵のある別の機能改善にリソースを回したいと考えてますが、ページ内スクロースしても固定ヘッダーを解除しないようにできるフックはあった方が良いですか？
石川様
ご丁寧な解説をいただき有難うございました。
不特定多数に対する最適な仕様という事で理解いたしました。プラグインで実現出来ておりますのでフックは不要です。
ご回答有難うございました。
- このトピックに返信するにはログインが必要です。
