【対応事例】「WP Simple Booking Calendar」の月送りをするとスクロールしてしまう

【対応事例】「WP Simple Booking Calendar」の月送りをするとスクロールしてしまう

2024年2月27日

株式会社まほろばの鈴木(@mahoroba148)です。

カレンダーを表示するWordPressのプラグイン「WP Simple Booking Calendar

無料で使える且つ、操作画面もわかりやすいので営業日カレンダーなどを表示に役立ちます。

しかし、テーマによっては「次の月」「前の月」を押すとそのページの一番上へ勝手に移動してしまうことがあります。

実際にご相談がありましたので対応事例としてご紹介します。

原因

特定の場所に自動スクロールするスムーススクロールが発火してしまうため、トップへ移動してしまいます。

だいたいのスムーススクロールは「#」がついたリンクを押したら、対象位置にスクロールしなさいね、というような指示になっています。

実は月送りのボタンもリンク先が「#」になっているのです。

デバックでみるとこんな感じ↓

テーマによってはこのスムーススクロールの指示が埋め込まれていることが多く、子テーマで上書きできない場合があります。

親テーマを直接編集することで一時的に解消できますが、アップデートの度に上書きされてしまい、完全に解決できたとはいえません。

対応策

Javascriptで「WP Simple Booking Calendar」の次の月、前の月のリンク先を変更します。

詳しいコードはここでは載せられませんが、Javascriptに知見のある方ならばそこまで難しくないコードだと思います。

また、「WP Simple Booking Calendar」はパソコンとスマートフォンで表示が切り替わります。

2つのコードに対応できるようにしましょう。

ホームページのお悩み相談

業者にこんな提案されたんだけどどうかな?

WordPressを今まで一度もアップデートしたことがない

ホームページ制作前のお悩み、制作後の更新方法などを相談だけでもOK!
セカンドオピニオンのようにもご利用いただけます。

\相談だけしたいなら/

\実際に作業を依頼するなら/