目次
WordPressのメニュー表示をスクロール追従型で固定させたい
今回ご紹介する事例は、下記のようなお問い合わせ内容です。
お問い合わせ内容
WordPressで弊社ホームページを制作しておりますが、スクロールすると位置が固定され、追従するメニューを制作したいと考えております。
利用しているテンプレートは、「Twenty Twelve」です。
実装したい内容を詳しくお伝えすると、現在ページ上部に表示されているグローバルメニューを、ページ上部に固定させたままスクロールしても追従するような仕様にしたいです。
そして、これはできればプラグインで導入できるものがあればいいなと思っております。
【実装したい内容】
・スクロール時に追従するメニュー
・プラグインでの導入を希望します
下記が私のイメージに近い参考サイトになります。
https://●●●/△△△
その他、不明点などあればご質問ください。
宜しくお願い致します。
※「Twenty Twelve(トゥエンティ・トゥエルブ)」とは、PCやスマートフォン、タブレットなどのさまざまなサイズの画面やデバイスで表示されることを前提に、美しく見やすいWordPressの無料テーマです。
※「グローバルメニュー」とは、別名「グローバルナビゲーション」とも呼ばれており、ホームページ内のコンテンツを把握しやすくするために、主なコンテンツがまとめられているメニューのことを言います。
言わば、ホームページ内の「案内メニュー」であり、ユーザーがより使いやすくなるメリットがあります。
追従型メニューのメリット
スクロール追従型のメニューを実装することによって、画面上部に常にメニューが存在するため、ホームページに訪れたユーザーが目的のページに進みやすくなり、ページ内のどの位置にいても、すぐに目的のメニューをクリックできます。
また、ユーザーの煩雑さを軽減できるため、ページ内で迷ってしまって離脱する現象を防ぐメリットもあります。
テレコム東京の対応
上記のお客様のケースで、弊社では下記のような対応をさせていただきました。
実際の対応
まずは、下記情報をお客様からお聞きしました。
- WordPressのログイン情報
- FTPのログイン情報
今回WordPressにスクロール追従型のメニューを実装させていただくにあたり、お客様とお打ち合わせを行ったところ、今回は下記の仕様で導入することになりました。
- 弊社にてプラグイン「myStickymenu」をインストール・有効化・設定
- メニュー内のコンテンツを出現させる際の動作は「スライド式」
- メニューの不透明度は「90」
- PCおよびスマホでのデザイン調整
※「myStickymenu」とは、ナビゲーションメニューなどを画面上部で、スクロール追従型にすることができるWordPressの無料プラグインです。
弊社では、主に下記の作業内容でご依頼内容の実現ができました。
- サイト内調査
- 仕様確認・お打ち合わせ
- プラグイン「myStickymenu」をインストール・有効化
- 設定の「General Settings」や「Style」、「Advanced」にて必要な設定を行う
- PCおよびスマホのデザイン調整(CSSにて追記も含む)
- プレビューで表示確認・動作確認
- お客様に提出し、ご確認いただき公開
- 最終確認を行い、作業完了
- 30日間の無料保証サポート
このケースの見積もり金額
今回ご紹介したケースの場合、弊社では5万円(税別)にて対応いたしました。
業者によって設定されている価格が異なり、同じ作業内容であっても高額な見積もりを出される場合もありますので、依頼先を検討する際には必ず他社見積りを取りましょう。
今回ご紹介したようなケース以外にもホームページのことでお困りの場合は、お気軽に弊社までお問い合わせください。
弊社にお問い合わせいただく70%は、専門知識を持たれていない読者様からです。
わかりやすい言葉でご説明させていただくように心がけておりますので、お気軽にご相談くださいね。
下記の画像をクリックしていただくと、無料診断フォームに遷移します。
関連記事