iBegins
 

Thêm 3 nút Facebook, Zalo, Gọi điện thoại vào flatsome

Gắn code nút hotline, nút gọi có cả icon cho wordpress flatsome.

Tham khảo thêm một hotline khác :

Gắn hỗ trợ Hotline Zalo Fanpage Facebook vào website

Code hotline zalo và số điện thoại góc trái website

Share code nút hiển thị số điện thoại hotline đẹp

<style>
.hotline-footer{
display:none
}
.float-contact {
position: fixed;
bottom: 20px;
left: 20px;
z-index: 99999;
}
.chat-zalo {
background:#7dbd2a;
border-radius: 20px;
padding: 0 18px;
color: white;
display: block;
margin-bottom: 6px;
}
.chat-face {
background: #125c9e;
border-radius: 20px;
padding: 0 18px;
color: white;
display: block;
margin-bottom: 6px;
}
.float-contact .hotline {
background: #21a342!important;
border-radius: 20px;
padding: 0 18px;
color: white;
display: block;
margin-bottom: 6px;
}
.chat-zalo a, .chat-face a, .hotline a {
font-size: 15px;
color: white;
font-weight: 400;
text-transform: none;
line-height: 0;
}
@media (max-width: 549px){
.hotline-footer{
display:block;
position:fixed;
bottom:0;
width:100%;
height:50px;
left: 0;
z-index:99;
background:rgba(0,0,0,0.6);
}
.hotline-footer .left{
width: 40%;
float: left;
height: 100%;
color: white;
line-height: 43px;
text-align: center;
}
.hotline-footer .left1 a {
background: #3fb801;
line-height: 40px;
margin: 5px;
color: #fff;
border-radius: 3px;
}
.hotline-footer .left1{
width: 30%;
float: left;
height: 100%;
color: white;
line-height: 43px;
text-align: center;
}
.hotline-footer .right{
width: 30%;
float: right;
height: 100%;
line-height: 43px;
text-align: center;
}
.absolute-footer{
font-size:13px
}
.blog-single .large-9, .blog-single .large-3{
flex-basis: 100%;
max-width: 100%;
}
.blog-single .large-3{
padding-left:15px;
font-size:15px
}
.blog-single .large-3 .widget-area .section4{
display:none
}
.tin-tuc-section .cot1-2{
display:none
}
.hotline-footer a{
color:white
}
.hotline-footer a{
display:block;
}
.hotline-footer .left a{
background: #0082d0;
line-height: 40px;
margin: 5px;
border-radius: 3px;
}
.hotline-footer .right a{
background: #3fb801;
line-height: 40px;
margin: 5px;
color: #fff;
border-radius: 3px;
}
.hotline-footer .left img, .hotline-footer .right img{
width:30px;
padding-right: 10px;
}
.float-contact{
display:none
}
}</style>
<div class="float-contact">
<button class="chat-zalo">
<a href="http://zalo.me/0902796333"><i class="icon-whatsapp"></i> Chat Zalo</a>
</button>
<button class="chat-face">
<a href="http://m.me/Hệ-Thống-Chăm-Sóc-Xe-Việt-T1-CAR-380665932517064/"><i class="icon-facebook" aria-hidden="true"></i> Chat Facebook</a>
</button>
<button class="hotline">
<a href="tel:0902796333"><i class="icon-phone" aria-hidden="true"></i> Hotline: 0902796333</a>
</button>
</div>
<div class="hotline-footer">
<div class="left">
<a href="https://messenger.com/t/Hệ-Thống-Chăm-Sóc-Xe-Việt-T1-CAR-380665932517064/" ><i class="icon-facebook" aria-hidden="true"></i> Chat Facebook</a>
</div>
<div class="left1">
<a href="http://zalo.me/0902796333" ><i class="icon-whatsapp"></i> Chat Zalo</a>
</div>
<div class="right">
<a href="tel:0902796333"><i class="icon-phone" aria-hidden="true"></i> Gọi Ngay</a>
</div>
<div class="clearboth"></div>
</div> 

Ngày 28 Tháng Năm, 2020 ( 1323 )

Tagged with: ,

Bình luận bài viết

Đăng nhập để bình luận và xem các bình luận khác.