Blog

Tháng Tám 6, 2019

Tạo thanh liên hệ trên giao diện điện thoại

Hướng dẫn tạo thanh liên hệ nhanh trên giao diện điện thoại bằng code html và css

Thanh liên hệ nhanh hay còn gọi là các nút Call to Action, nút này có ý nghĩa kêu gọi người dùng sử dụng hành vi lướt website và click vào các nút mục tiêu do chúng ta đặt sẵn.

Thanh liên hệ này sẽ chỉ hiển thị trên giao diện của điện thoại và bao gồm có 4 nút : gọi điện, nhắn tin SMS, chat zalo và chat facebook

Mình đang áp dụng cho nhiều website và rất có hiệu quả, các bạn thử xem nhé.

Cách chèn Code các nút liên hệ nhanh vào giao diện điện thoại áp dụng đối với theme Flatsome WordPress :

Bước 1: Tại thanh Admin Bar trên cùng, truy cập chữ Flatsome – Advanced – Global Setting– Footer Script.

Bước 2: Copy toàn bộ đoạn code dưới đây và paste vào ô Footer Scipt.

<style> .bottom-contact{display:none} @media (max-width: 767px) { .bottom-contact{display: block; position: fixed; bottom: 0; background: white; width: 100%; z-index: 99; box-shadow: 2px 1px 9px #dedede; border-top: 1px solid #eaeaea;} .bottom-contact ul li{width: 25%; float: left; list-style: none; text-align: center; font-size:13.5px;} .bottom-contact ul li span{color:black} .bottom-contact ul li img{ width: 35px; margin-top: 10px; margin-bottom: 0px;} } </style> <div class="bottom-contact"> <ul> <li> <a id="goidien" href="tel:0909656269"> <img src="https://thietkeweb24h.com.vn/blink/icon-phone2.png"/> <br> <span>Gọi điện</span> </a> </li> <li> <a id="nhantin" href="sms:0909656269"> <img src="https://thietkeweb24h.com.vn/blink/icon-sms2.png"/> <br> <span>Nhắn tin</span> </a> </li> <li> <a id="chatzalo" href="http://zalo.me/0909656269"> <img src="https://thietkeweb24h.com.vn/blink/icon-zalo2.png"/> <br> <span>Chat zalo</span> </a> </li> <li> <a id="chatfb" href="https://www.messenger.com/t/thietkeweb24h.com.vn"> <img src="https://thietkeweb24h.com.vn/blink/icon-mesenger2.png"/> <br> <span>Chat Facebook</span> </a> </li> </ul> </div>

 

    • Gọi điện
    • Nhắn tin
    • Chat zalo
    • Chat Facebook

    • Gọi điện
    • Nhắn tin
    • Chat zalo
    • Chat Facebook

Chỉnh sửa thông tin:

  • Số điện thoại gọi :  tel:0909656269
  • Số điện thoại nhắn tin sms:0909656269
  • Link zalo :href=”http://zalo.me/0909656269"
  • Nick chat Facebook : href=”https://messenger.com/t/thietkeweb24h.com.vn"

Bước 3: Lưu lại và truy cập trên điện thoại để xem thành quả.

Hướng dẫn
About admin

Leave a Reply

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *

Cart