[ 解決済 ] スマホ時のヘッダーロゴの右横に電話アイコン

VWSとは フォーラム Lightning [ 解決済 ] スマホ時のヘッダーロゴの右横に電話アイコン

[ 解決済 ] スマホ時のヘッダーロゴの右横に電話アイコン

  • このトピックには2件の返信、2人の参加者があり、最後にzzzにより4年、 6ヶ月前に更新されました。
3件の投稿を表示中 - 1 - 3件目 (全3件中)
  • 投稿者
    投稿
  • #37612

    zzz
    閲覧者

    メニューボタンを開くと電話番号が表示されるようにしているのですが、スマホ時のヘッダーロゴの右横にタップで通話できる電話アイコンを設置したいです。

    添付画像の赤丸箇所になります。

    ご教示いただければ幸いです。

    よろしくお願いいたします。

    Lightning Skin Fort: 6.1.3
    VK All in One Expansion Unit: 9.18.1.0
    Lightning Proバージョン: 1.6.7

    Attachments:
    You must be logged in to view attached files.
    #37616

    DRILL LANCER
    モデレーター

    カスタマイズの例としては下記が挙げられます。
    下記をベースにカスタマイズをしてみてください。

    functions.php

    function lightning_mobile_header_tel(){
    	$html='<div class="mobile-header-tel"><a href="tel:0120-123-456"><i class="fas fa-phone"></i></a></div>';
    	echo $html;
    }
    add_action( 'lightning_header_append', 'lightning_mobile_header_tel' );

    子テーマの style.css

    @media (max-width: 991.98px) {
    	.siteHeader {
    		position: relative;
    	}
    	.mobile-header-tel {
    		position:absolute;
    		right:5px;
    		top:1em;
    	}
    }
    • この返信は4年、 6ヶ月前にDRILL LANCERが編集しました。
    • この返信は4年、 6ヶ月前にDRILL LANCERが編集しました。
    #37634

    zzz
    閲覧者

    DRILL LANCER様

    迅速なご教示ありがとうございます!

    無事、アイコンを反映させることができました。

    なかなか表示されず困っておりましたが助かりました。

    感謝いたします。

    今後ともよろしくお願いいたします。

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