アコーディオンメニューをレスポンシブでWordPressサイトに実装したい
今回ご紹介する事例は、下記のようなお問い合わせ内容です。
お問い合わせ内容
初めまして。
今回、下記URLのホームページの改修をお願いしたく、ご連絡させていただきました。
https://●▲●.com
上記ホームページはWordPressにて制作しており、全ページのヘッダー部分に、アコーディオンメニューというものをレスポンシブ対応にて実装していただきたいです。
ホームページ自体は、私がインターネットの情報を元になんとか作成し、運営していますが、自分で試行錯誤しても上手く表示することができないため、ご依頼できればと考えております。
必要な情報などがあれば、教えてください。
どうぞ宜しくお願い致します。
※「アコーディオンメニュー」とは、ナビゲーションメニューの一種であり、クリックするとアコーディオンの中に隠れているリンクなどを展開して、表示させることができます。
(※一説では、楽器のアコーディオンのように開閉が可能なため、「アコーディオンメニュー」と呼ばれるようになったようです。)
また、「レスポンシブ」とは「レスポンシブWebデザイン」の略称で、PCやスマートフォン、タブレットなどのさまざまな画面サイズにおいても、サイト表示を柔軟に調整し、どんな機器でも見やすく、最適な表示ができることを意味します。
テレコム東京の対応
実際の対応
まずは、下記の情報をお客様よりお聞きしました。
- WordPress管理画面のログイン情報
- レンタルサーバーのログイン情報
- 現在のページ数は、10ページ
- アコーディオンメニュー内に格納したいコンテンツ
(※別途添付ファイルにて、一覧と詳細を送っていただきました。) - シンプルな開閉式アコーディオンメニューを希望
(※動作もデザインも、参考サイトを元にシンプルなものを希望) - PCおよびレスポンシブは、高さ3,000pxまで
主に、下記の作業内容でお客様のご要望を実現しました。
- サイト内調査(既存の仕様・システム確認などを含む)
- アコーディオンメニューとレスポンシブの仕様確認
(ヒアリング実施・格納コンテンツの詳細やデザイン決めなどを含む) - お客様へ仕様書を提出(問題ないかをご確認いただきました)
- お客様からの確認が取れた後に、JavaScript・CSS等にてアコーディオンメニューを制作(レスポンシブ対応)
- 実装・デザイン調整
- 動作確認
- お客様に問題ないかどうかを確認
- 最終確認を行い、作業完了
- 30日間の無料保証サポート
このケースの見積もり金額
今回ご紹介したケースの場合、弊社では15万円(税別)にて対応いたしました。
業者によって設定されている価格が異なり、同じ作業内容であっても高額な見積もりを出される場合もありますので、依頼先を検討する際には必ず他社見積りを取りましょう。
今回ご紹介したようなケース以外にもホームページのことでお困りの場合は、お気軽に弊社までお問い合わせください。
弊社にお問い合わせいただく70%は、専門知識を持たれていない読者様からです。
わかりやすい言葉でご説明させていただくように心がけておりますので、お気軽にご相談くださいね。
下記の画像をクリックしていただくと、無料診断フォームに遷移します。
関連記事