Thêm nút Chat facebook và Gọi ngay trên giao diện Mobile

Code chèn các nút Call to Action hữu ích phía dưới chân trang trên giao diện mobile

Code chèn nút Chat Facebook và gọi ngay

Lưu ý: Những bạn nào không dùng theme Flatsome thì copy các đoạn code của mình bỏ vào file footer.php nhé (ngay phía dưới thẻ đóng </body> của footer.php). Để tìm file footer.php thì vào Quản trị – Giao diện – Sửa – tìm file footer.php.

Bước 1: Chèn code HTML và CSS vào Footer Scripts

<style>
.mobile-hotline{display:none}
.hotline {position: fixed;
    left: 10px;
    bottom: 10px;
    z-index: 9000;
    display: block;
    background: #fac100;
    color: red;
    padding-top: 5px;padding-bottom:5px; padding-left:12px; padding-right: 12px;
    border-radius: 99px;}
.hotline .hotline-number{font-size:20px; color: #b20000; font-weight: bold}
@media  (max-width: 767px) {
    .hotline{
        display :none;
    }
.mobile-hotline{display: block; bottom: 0; width: 100%; background:rgba(0,0,0,0.5); height: 60px; position: fixed; z-index:9999999}
.mobile-hotline .mobile-hotline-left{width: 45%; float: left; text-align: center; background: #00a502; margin-left: 10px; margin-right:5px; margin-top: 7px; height: 45px; border-radius: 4px}
.mobile-hotline .mobile-hotline-left a{color: white; line-height: 46px; font-size:16px; font-weight: bold}
.mobile-hotline .mobile-hotline-right{width: 45%; float: right; text-align: center; background: #fac100; margin-left: 5px; margin-right: 10px; margin-top: 7px; height: 45px; border-radius: 4px}
.mobile-hotline .mobile-hotline-right a{color: red; line-height: 46px; font-size: 16px; font-weight: bold}
}
</style>
<a href=“tel:+84398218999”><div class=“hotline”>
<span class=“before-hotline”>Hotline:</span>
<span class=“hotline-number”>039 8218 999</span>
</div></a>
<div class=“mobile-hotline”>
<div class=“mobile-hotline-left”>
<a href=“http://www.messenger.com/t/thietkewebdongthap” target=“blank”>Chat Facebook</a>
</div>
<div class=“mobile-hotline-right”><a href=“tel:+84398218999” target=“blank”>Gọi điện ngay</a></div>
</div>

Trong đó, bạn chỉ việc thay số điện thoại và link chat Facebook thành của các bạn là được!

Video hướng dẫn thêm code

Trả lời

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 *