TẠO TIỆN ÍCH QUICK SUPPORT HIỆU ỨNG ANIMATION CHO BLOGGER

Các bạn làm website bán hàng thì không thể thiếu một thông tin để liên lạc như bot chat , bot liên hệ … Vì vậy hôm nay mình xin chia sẻ đến các bạn một tiện ích khá hay giúp mọi người dễ dàng liên lạc được với bạn thông qua Facebook, call sđt , viber…

• Hướng dẫn tạo live chat siêu nhẹ chuyên nghiệp cho website
• Tạo Nút share chuyên nghiệp cho blogger

Hướng dẫn 

<style>.support-online{position:fixed;z-index:999;left:0;bottom:0;}.support-online a{position:relative;margin:20px 10px;text-align:left;width:40px;height:40px;}.support-online i{text-align:center;width:39px;height:39px;background:#72bf3b;color:#fff;border-radius:100%;font-size:20px;line-height:1.9;position:relative;z-index:999;margin-left:-2px;margin-top:3px;}.support-online a span{border-radius:2px;text-align:center;background:rgb(103,182,52);padding:9px;display:none;width:180px;margin-left:10px;position:absolute;color:#ffffff;z-index:999;top:0;left:40px;transition:all 0.2s ease-in-out 0s;-moz-animation:headerAnimation 0.7s 1;-webkit-animation:headerAnimation 0.7s 1;-o-animation:headerAnimation 0.7s 1;animation:headerAnimation 0.7s 1;}.support-online a:hover span{display:block;}.support-online a{display:block;}.support-online a span:before{content:””;width:0;height:0;border-style:solid;border-width:10px 10px 10px 0;border-color:transparent rgb(103,182,52) transparent transparent;position:absolute;left:-10px;top:10px;}.kenit-alo-circle-fill{width:60px;height:60px;top:-10px;position:absolute;-webkit-transition:all 0.2s ease-in-out;-moz-transition:all 0.2s ease-in-out;-ms-transition:all 0.2s ease-in-out;-o-transition:all 0.2s ease-in-out;transition:all 0.2s ease-in-out;-webkit-border-radius:100%;-moz-border-radius:100%;border-radius:100%;border:2px solid transparent;-webkit-transition:all .5s;-moz-transition:all .5s;-o-transition:all .5s;transition:all .5s;background-color:rgba(0,175,242,0.5);opacity:.75;right:-10px;}.kenit-alo-circle{width:50px;height:50px;top:-5px;right:-5px;position:absolute;background-color:transparent;-webkit-border-radius:100%;-moz-border-radius:100%;border-radius:100%;border:2px solid rgba(30,30,30,0.4);opacity:.1;border-color:#0089B9;opacity:.5;}.support-online .btn-support{cursor:pointer;}.btn-support .tooltiptext{visibility:hidden;width:140px;background-color:black;color:#fff;text-align:center;border-radius:3px;padding:4px 2px;position:absolute;z-index:1;}.btn-support:hover .tooltiptext{visibility:visibl</style><script> jQuery(document).ready(function(){jQuery(‘.support-content’).hide();jQuery(‘a.btn-support’).click(function(e){e.stopPropagation();jQuery(‘.support-content’).slideToggle();});jQuery(‘.support-content’).click(function(e){e.stopPropagation();});jQuery(document).click(function(){jQuery(‘.support-content’).slideUp();});});</script><div class=’support-online’><div class=’support-content’ style=’display:block;padding-left:34px;’><a class=’call-now’ href=’tel:01682676858‘ rel=’nofollow’><i aria-hidden=’true’ class=’fa fa-whatsapp’></i><div class=’animated infinite zoomIn kenit-alo-circle’></div><div class=’animated infinite pulse kenit-alo-circle-fill’></div><span>Hotline:01682676858</span></a><a class=’mes’ href=’https://m.me/100020722866800‘ target=’_blank’><i aria-hidden=’true’ class=’fa fa-facebook-official’></i><span>Nhắn tin facebook</span></a><a class=’zalo’ href=’https://zalo.me/01682676858‘ target=’_blank’><i class=’fa fa-comments’></i><span>Zalo:01682676858</span></a></div><a class=’btn-support’ style=’ padding-left:33px;’><div class=’animated infinite zoomIn kenit-alo-circle’></div><div class=’animated infinite pulse kenit-alo-circle-fill’></div><i aria-hidden=’true’ class=’fa fa-user-circle’></i><div class=’tooltip’></div></a></div>

 Lưu ý : các bạn thay chỗ mình tô màu đỏ sau cho phù hợp với bạn là được

Lời kết