メディアサイト様より、スマホ表示時のみのハンバーガーメニュー内容を大きく変更(カスタマイズ)されたいとのご依頼をワードプレスドクターで代行させていただきました。

スマートホン表示時のみ、リッチなコンテンツを含むスマホメニューをワードプレスサイトで表示したい

お客様のご要望は下記の物でございました。

１　スマホ時のみ指定コンテンツを含むメニューをハンバーガーメニューとして表示されたい
２　検索を含めたい
３　任意の順位でカテゴリーを表示されたい
４　子カテゴリーのあるメニューは+をクリックするとスライドして子カテゴリーが表示される
５　バナーを含み、SNSへのリンクを最下部に配置されたい

スマホ判定、JSによるスライド

ワードプレスには、スマホ判定用の関数wp_is_mobile() があり、ユーザーが現在表示しているデバイスがスマホかどうかを判定することができます。

またCSSでは、メディアクエリと言ってデバイスの横幅によって表示を変える方法がございます。

メニュー表示や、スライドアニメーション等はJS(JAVASCRIPT)のプログラムで制御します。

WordPressワードプレスのスマホメニューのカスタマイズ、修正のご相談・ご依頼はWPドクターまでお気軽にお送りください

関連記事:

  1. ワードプレス依頼事例(WPドクター):テーマの改造・カスタマイズによる様々な機能の追加
    ワードプレスのテーマは最近ではプラグインに頼らずに様々な独自機能がついているものが増えてまいりました。ただ、テーマのそれらの機能だけではサイトのサービス内容と完全に合致するわけではないこともございます。 ワードプレスドクターでは、よりサイトのサービスを充実させるためにテーマの固有の機能をカスタマイズ・改造させていただくことが可能です。 ワードプレスドクターでテーマのカスタマイズを行って実装させていただいた機能を一部ご紹介いたします。...
  2. ワードプレス依頼事例(WPドクター):テーマのカスタマイズによるアートギャラリーの構築
    こちらのクライアント様は教書系の出版社でオンラインで、子供たち(学生)の書いた絵画のギャラリーの絵画をピンタレストのようなブロックレイアウトで構築されたいというご依頼でございました。 中学生や高校生の子供たちの書いた作品は大変レベルが高く驚きました。 ワードプレスドクターではテーマに独自のカスタマイズを施しまして、お好きなようにギャラリーを構築するようなご依頼も可能ですので是非ご検討ください。...
  3. ワードプレス依頼事例(WPドクター):クーポンの投稿システムの作成
    ワードプレスドクターで、店主がユーザー登録を経て、店舗情報を入力し、それぞれの店舗でクーポンが発行できる仕組みを構築させていただきました依頼事例をご紹介いたします。...
  4. ワードプレス依頼事例(WPドクター):WordPressテーマのカスタマイズの依頼事例
    ここでは、ワードプレスドクターでどんな事ができるのかご紹介する為に、実際にクライアントからご依頼のあったテーマのカスタマイズ事例をいくつかご紹介いたします 複数のワードプレスブログに同時に投稿する クライアント様のご依頼は、複数のサイトを運営しており、その中に建築の施工事例を載せているが一方に投稿すると他のサイトにも同時に投稿されるようにされたいとの事でした。...
  5. ワードプレスドクターではWordPressのプラグインやテンプレートのカスタマイズ・作成のご依頼承ります
    ワードプレスドクターでは、豊富なWordpress構築経験を持つPHPのプログラマによって、テンプレートやプラグインのカスタマイズ、作成ーレイアウト修正のご依頼を承っております。これまでご依頼頂いた様々な事例をご紹介いたします...