[ 解決済 ] ヘッダーコンタクト設定について

VWSとは フォーラム Lightning [ 解決済 ] ヘッダーコンタクト設定について

[ 解決済 ] ヘッダーコンタクト設定について

  • このトピックには4件の返信、3人の参加者があり、最後に山本隆により2週、 5日前に更新されました。
5件の投稿を表示中 - 1 - 5件目 (全5件中)
  • 投稿者
    投稿
  • #58582

    山本隆
    参加者

    ■ WordPress のバージョン
    WordPress 5.8.2 (lightning Child テーマ)

    ■ テーマ・プラグインは全て最新版で確認してください。
    確認しました。

    ■ テーマの種類
    Lightning ( G3 ) + Lightning G3 Pro Unit

    ■ テーマのバージョン
    バージョン: 14.11.4

    ■ Pro Unit のバージョン
    バージョン 0.13.2

    ■ スキンの種類
    Origin III

    ■ 関連しそうなプラグインを一つづつ停止して症状が改善するか確認してください。
    確認しました。

    ■ プラグインの種類・バージョン

    ■ 期待する動作
    ライトニングの初心者です。
    ヘッダー設定で『ヘッダーコンタクト&ナビ貫通』に設定にしています。パソコンでは、見えている電話番号とお問合せアイコンがモバイル(safari)では表示されません。パソコンでブラウザの幅を狭くしても同じです。電話番号とお問合せアイコンをモバイルで折り返し表示する方法をご教示いただけますでしょうか?

    お手数ですがよろしくお願いします。

    ■ 自分で試した事
    ヘッダーの高さをCSSで調整しましたが、高さを広げても、電話番号等の要素は表示されません。

    ■ 症状が発生するブラウザ
    sarari/Chrome

    ■ 実際の症状
    モバイルで参照すると『ヘッダーコンタクト&ナビ貫通』で設定した電話番号とお問合せアイコンが表示されません。

    #58588

    うなこ
    モデレーター

    モバイルではモバイル固定ナビを固定表示することができるので、こちらを使用するのがお勧めですが、もし電話番号とお問合せボタンの同じレイアウトを表示させたいということでしたら、別途、ウィジェットで設置する形になります。

    【やり方】
    その1:ハンバーガーメニューを展開した時に、モバイルナビ上部orモバイルナビ下部に表示する方法
    カスタマイズ→ウィジェット の「モバイルナビ上部」もしくは「モバイルナビ下部」の+ボタンを押して、検索窓に「従来のウィジェット」と入れてください。選択項目が出てきますので、「VK お問合せセクション」を入れて、「更新」ボタンをおしてください。
    モバイルで確認すると、メニューの中のナビの上か下に、お問合せセクションが表示されます。

    その2:常に画面下部に固定で表示したい場合
    カスタマイズ→ウィジェット の「モバイル固定ナビ ウィジェットエリア」の+ボタンを押して、検索窓に「従来のウィジェット」と入れてください。選択項目が出てきますので、「VK お問合せセクション」を入れて、「更新」ボタンをおしてください。
    モバイルで確認すると、画面の下部に、お問合せセクションが表示されます。
    この方法ですと、結構幅をとるので、モバイルでは邪魔になりますので、お問合せボタンなどを設置するくらいにして、電話などはモバイル固定ナビに設置するのがいいのかなと思います。

    • この返信は2週、 5日前にうなこが編集しました。
    • この返信は2週、 5日前にうなこが編集しました。
    • この返信は2週、 5日前にうなこが編集しました。
    • この返信は2週、 5日前にうなこが編集しました。
    • この返信は2週、 5日前にうなこが編集しました。
    #58593

    参考

    基本的に「モバイル固定ナビで問い合わせボタンも電話リンクも配置出来るのでヘッダーには必要ない」という意図で現状の仕様になっています。

    モバイル固定ナビ

    モバイルナビの中に問い合わせ情報を表示する

    Lightning 基本設定解説 ナビゲーションの設定

    以下で表示はできますが、レイアウトは別途調整する必要があります。

    @media (max-width: 991px){
    	.site-header-sub {
    		display:block
    	}
    }

    できる!CSSカスタマイズ

    #58619

    山本隆
    参加者

    石川様

    ありがとうございました。動画も見ました。大変勉強になりました。

    #58620

    山本隆
    参加者

    うなこ様

    早々のご返信、ありがとうございました。実際試してみて、実現できました。
    ありがとうございました。

5件の投稿を表示中 - 1 - 5件目 (全5件中)
  • このトピックに返信するにはログインが必要です。