Liên hệ Zalo 0948.713.329 Để Nhận Tư Vấn Hỗ Trợ

Chia sẻ tổng hợp bộ tiện ích contact liên hệ đẹp cho blogspot

Chia sẻ tổng hợp bộ tiện ích contact liên hệ đẹp cho blogspot

Cập nhật ngày Bởi
Bài viết xin chia sẻ tới các bạn đang dùng blogspot bán hàng, bất động sản bộ tiện ích liên hệ đẹp giúp khách hàng liên hệ một cách dễ dàng với admin, chủ shop. Đây là một công cụ hỗ trợ khách hàng tuyệt vời của bộ Bộ tiện ích contact liên hệ cho blogger.

Chia sẻ bộ tiện ích contact liên hệ cho blogspot

1 - Bộ tiện ích contact liên hệ kiểu 1

Bộ tiện ích liên hệ cho blogspot bao gồm : Nút gọi diện, Nút gửi SMS, nút chát Messenger, nút Chát Zalo, nút gửi Email.

Cách cài đặt Bộ tiện ích contact liên hệ cho blogger như sau: Các bạn copy toàn bộ code bên dưới dán trước thẻ đóng </body> và lưu lại là xong.
<div id='contact'/>
    <style>
  /*<![CDATA[*/
.arcontactus-widget.hg .arcontactus-message-button,.arcontactus-widget.hg.arcontactus-message{width:100px;height:100px}.arcontactus-widget{opacity:0;transition:.2s opacity}.arcontactus-widget *{box-sizing:border-box}.arcontactus-widget.left.arcontactus-message{left:20px;right:auto}.arcontactus-widget.left .arcontactus-message-button{right:auto;left:0}.arcontactus-widget.left .arcontactus-prompt{left:80px;right:auto;transform-origin:0 50%}.arcontactus-widget.left .arcontactus-prompt:before{border-right:8px solid #FFF;border-top:8px solid transparent;border-left:8px solid transparent;border-bottom:8px solid transparent;right:auto;left:-15px}.arcontactus-widget.left .messangers-block{right:auto;left:0;-webkit-transform-origin:10% 105%;-ms-transform-origin:10% 105%;transform-origin:10% 105%}.arcontactus-widget.left .callback-countdown-block{left:0;right:auto}.arcontactus-widget.left .callback-countdown-block::before,.arcontactus-widget.left .messangers-block::before{left:25px;right:auto}.arcontactus-widget.hg .callback-countdown-block,.arcontactus-widget.hg .messangers-block{bottom:110px}.arcontactus-widget.hg .arcontactus-prompt{bottom:5px}.arcontactus-widget.hg .icons-line{top:22px;left:24px}.arcontactus-widget.hg.left .callback-countdown-block:before,.arcontactus-widget.hg.left .messangers-block:before{left:41px}.arcontactus-widget.hg.left .arcontactus-prompt{left:110px;bottom:26px}.arcontactus-widget.hg.right .callback-countdown-block:before,.arcontactus-widget.hg.right .messangers-block:before{right:41px}.arcontactus-widget.hg.right .arcontactus-prompt{right:110px;bottom:26px}.arcontactus-widget.hg .arcontactus-message-button .pulsation{width:114px;height:114px;border-radius:60px}.arcontactus-widget.hg .arcontactus-message-button .callback-state,.arcontactus-widget.hg .arcontactus-message-button .icons{width:70px;height:70px;margin-top:-35px;margin-left:-35px}.arcontactus-widget.md .arcontactus-message-button,.arcontactus-widget.md.arcontactus-message{width:60px;height:60px}.arcontactus-widget.md .callback-countdown-block,.arcontactus-widget.md .messangers-block{bottom:70px}.arcontactus-widget.md .arcontactus-prompt{bottom:5px}.arcontactus-widget.md.left .callback-countdown-block:before,.arcontactus-widget.md.left .messangers-block:before{left:21px}.arcontactus-widget.md.left .arcontactus-prompt{left:70px}.arcontactus-widget.md.right .callback-countdown-block:before,.arcontactus-widget.md.right .messangers-block:before{right:21px}.arcontactus-widget.md.right .arcontactus-prompt{right:70px}.arcontactus-widget.md .arcontactus-message-button .pulsation{width:74px;height:74px}.arcontactus-widget.md .arcontactus-message-button .callback-state,.arcontactus-widget.md .arcontactus-message-button .icons{width:40px;height:40px;margin-top:-20px;margin-left:-20px}.arcontactus-widget.sm .arcontactus-message-button,.arcontactus-widget.sm.arcontactus-message{width:50px;height:50px}.arcontactus-widget.sm .callback-countdown-block,.arcontactus-widget.sm .messangers-block{bottom:60px}.arcontactus-widget.sm .arcontactus-prompt{bottom:0}.arcontactus-widget.sm.left .callback-countdown-block:before,.arcontactus-widget.sm.left .messangers-block:before{left:16px}.arcontactus-widget.sm.left .arcontactus-prompt{left:60px}.arcontactus-widget.sm.right .callback-countdown-block:before,.arcontactus-widget.sm.right .messangers-block:before{right:16px}.arcontactus-widget.sm.right .arcontactus-prompt{right:60px}.arcontactus-widget.sm .arcontactus-message-button .pulsation{width:64px;height:64px}.arcontactus-widget.sm .arcontactus-message-button .icons{width:40px;height:40px;margin-top:-20px;margin-left:-20px}.arcontactus-widget.sm .arcontactus-message-button .static{margin-top:-16px}.arcontactus-widget.sm .arcontactus-message-button .callback-state{width:40px;height:40px;margin-top:-20px;margin-left:-20px}.arcontactus-widget.active{opacity:1}.arcontactus-widget .icons.hide,.arcontactus-widget .static.hide{opacity:0;transform:scale(0)}.arcontactus-widget.arcontactus-message{z-index:10000;right:20px;bottom:20px;position:fixed!important;height:70px;width:70px}.arcontactus-widget .arcontactus-message-button{width:70px;position:absolute;height:70px;right:0;background-color:red;border-radius:50px;-webkit-box-sizing:border-box;box-sizing:border-box;text-align:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;cursor:pointer}.arcontactus-widget .arcontactus-message-button p{font-family:Ubuntu,Arial,sans-serif;color:#fff;font-weight:700;font-size:10px;line-height:11px;margin:0}.arcontactus-widget .arcontactus-message-button .pulsation{width:84px;height:84px;background-color:red;border-radius:50px;position:absolute;left:-7px;top:-7px;z-index:-1;-webkit-transform:scale(0);-ms-transform:scale(0);transform:scale(0);-webkit-animation:arcontactus-pulse 2s infinite;animation:arcontactus-pulse 2s infinite}.arcontactus-widget .arcontactus-message-button .icons{background-color:#fff;width:44px;height:44px;border-radius:50px;position:absolute;overflow:hidden;top:50%;left:50%;margin-top:-22px;margin-left:-22px}.arcontactus-widget .arcontactus-message-button .static{position:absolute;top:50%;left:50%;margin-top:-19px;margin-left:-26px;width:52px;height:52px;text-align:center}.arcontactus-widget .arcontactus-message-button .static img{display:inline}.arcontactus-widget .arcontactus-message-button .static svg{width:24px;height:24px;color:#FFF}.arcontactus-widget .arcontactus-message-button.no-text .static{margin-top:-12px}.arcontactus-widget .pulsation:nth-of-type(2n){-webkit-animation-delay:.5s;animation-delay:.5s}.arcontactus-widget .pulsation.stop{-webkit-animation:none;animation:none}.arcontactus-widget .icons-line{top:10px;left:12px;display:-webkit-box;display:-ms-flexbox;display:flex;position:absolute;-webkit-transition:cubic-bezier(.13,1.49,.14,-.4);-o-transition:cubic-bezier(.13,1.49,.14,-.4);-webkit-animation-delay:0s;animation-delay:0s;-webkit-transform:translateX(30px);-ms-transform:translateX(30px);transform:translateX(30px);height:24px;transition:.2s all}.arcontactus-widget .icons,.arcontactus-widget .static{transition:.2s all}.arcontactus-widget .icons-line.stop{-webkit-animation-play-state:paused;animation-play-state:paused}.arcontactus-widget .icons-line span{display:inline-block;width:24px;height:24px;color:red}.arcontactus-widget .icons-line span i,.arcontactus-widget .icons-line span svg{width:24px;height:24px}.arcontactus-widget .icons-line span i{display:block;font-size:24px;line-height:24px}.arcontactus-widget .icons-line img,.arcontactus-widget .icons-line span{margin-right:40px}.arcontactus-widget .icons.hide .icons-line{transform:scale(0)}.arcontactus-widget .icons .icon:first-of-type{margin-left:0}.arcontactus-widget .arcontactus-close{color:#FFF}.arcontactus-widget .arcontactus-close svg{-webkit-transform:rotate(180deg) scale(0);-ms-transform:rotate(180deg) scale(0);transform:rotate(180deg) scale(0);-webkit-transition:ease-in .12s all;-o-transition:ease-in .12s all;transition:ease-in .12s all;display:block}.arcontactus-widget .arcontactus-close.show-messageners-block svg{-webkit-transform:rotate(0) scale(1);-ms-transform:rotate(0) scale(1);transform:rotate(0) scale(1)}.arcontactus-widget .arcontactus-prompt,.arcontactus-widget .messangers-block{background:center no-repeat #FFF;box-shadow:0 0 10px rgba(0,0,0,.6);width:235px;position:absolute;bottom:80px;right:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;padding:14px 0;-webkit-box-sizing:border-box;box-sizing:border-box;border-radius:7px;-webkit-transform-origin:80% 105%;-ms-transform-origin:80% 105%;transform-origin:80% 105%;-webkit-transform:scale(0);-ms-transform:scale(0);transform:scale(0);-webkit-transition:ease-out .12s all;-o-transition:ease-out .12s all;transition:ease-out .12s all;z-index:10000}.arcontactus-widget .arcontactus-prompt:before,.arcontactus-widget .messangers-block:before{position:absolute;bottom:-7px;right:25px;left:auto;display:inline-block!important;border-right:8px solid transparent;border-top:8px solid #FFF;border-left:8px solid transparent;content:''}.arcontactus-widget .arcontactus-prompt.show-messageners-block,.arcontactus-widget .messangers-block.show-messageners-block{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}.arcontactus-widget .arcontactus-prompt{color:#787878;font-family:Arial,sans-serif;font-size:16px;line-height:18px;width:auto;bottom:10px;right:80px;white-space:nowrap;padding:18px 20px 14px}.arcontactus-widget .arcontactus-prompt:before{border-right:8px solid transparent;border-top:8px solid transparent;border-left:8px solid #FFF;border-bottom:8px solid transparent;bottom:16px;right:-15px}.arcontactus-widget .arcontactus-prompt.active{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}.arcontactus-widget .arcontactus-prompt .arcontactus-prompt-close{position:absolute;right:6px;top:6px;cursor:pointer;z-index:100;height:14px;width:14px;padding:2px}.arcontactus-widget .arcontactus-prompt .arcontactus-prompt-close svg{height:10px;width:10px;display:block}.arcontactus-widget .arcontactus-prompt .arcontactus-prompt-typing{border-radius:10px;display:inline-block;left:3px;padding:0;position:relative;top:4px;width:50px}.arcontactus-widget .arcontactus-prompt .arcontactus-prompt-typing>div{position:relative;float:left;border-radius:50%;width:10px;height:10px;background:#ccc;margin:0 2px;-webkit-animation:arcontactus-updown 2s infinite;animation:arcontactus-updown 2s infinite}.arcontactus-widget .arcontactus-prompt .arcontactus-prompt-typing>div:nth-child(2){animation-delay:.1s}.arcontactus-widget .arcontactus-prompt .arcontactus-prompt-typing>div:nth-child(3){animation-delay:.2s}.arcontactus-widget .messangers-block.sm .messanger{padding-left:50px;min-height:44px}.arcontactus-widget .messangers-block.sm .messanger span{height:32px;width:32px;margin-top:-16px}.arcontactus-widget .messangers-block.sm .messanger span svg{height:20px;width:20px;margin-top:-10px;margin-left:-10px}.arcontactus-widget .messanger{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin:0;cursor:pointer;width:100%;padding:8px 20px 8px 60px;position:relative;min-height:54px;text-decoration:none}.arcontactus-widget .messanger:hover{background-color:#EEE}.arcontactus-widget .messanger:before{background-repeat:no-repeat;background-position:center}.arcontactus-widget .messanger.facebook span{background:#0084ff}.arcontactus-widget .messanger.viber span{background:#7c529d}.arcontactus-widget .messanger.telegram span{background:#2ca5e0}.arcontactus-widget .messanger.skype span{background:#31c4ed}.arcontactus-widget .messanger.email span{background:#ff8400}.arcontactus-widget .messanger.contact span{background:#7eb105}.arcontactus-widget .messanger.call-back span{background:#54cd81}.arcontactus-widget .messanger span{position:absolute;left:10px;top:50%;margin-top:-20px;display:block;width:40px;height:40px;border-radius:50%;background-color:#0084ff;margin-right:10px;color:#FFF;text-align:center;vertical-align:middle}.arcontactus-widget .messanger span i,.arcontactus-widget .messanger span svg{width:24px;height:24px;vertical-align:middle;text-align:center;display:block;position:absolute;top:50%;left:50%;margin-top:-12px;margin-left:-12px}.arcontactus-widget .messanger span i{font-size:24px;line-height:24px}.arcontactus-widget .messanger p{margin:0;font-family:Arial,sans-serif;font-size:14px;color:rgba(0,0,0,.87);padding:0}.arcontactus-widget .callback-countdown-block{background:center no-repeat #FFF;box-shadow:0 0 10px rgba(0,0,0,.6);width:410px;height:150px;position:absolute;bottom:80px;left:auto;right:0;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-sizing:border-box;box-sizing:border-box;border-radius:7px;-webkit-transform-origin:80% 105%;-ms-transform-origin:80% 105%;transform-origin:80% 105%;-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1);-webkit-transition:ease-out .12s all;-o-transition:ease-out .12s all;transition:ease-out .12s all;z-index:10000;color:red;padding-top:5px;padding-left:8px;padding-right:19px;display:none}.arcontactus-widget .callback-countdown-block .callback-countdown-block-timer_timer{font-size:38px;font-family:Arial,sans-serif}.arcontactus-widget .callback-countdown-block.display-flex{display:-webkit-box;display:-ms-flexbox;display:flex}.arcontactus-widget .callback-countdown-block:before{position:absolute;bottom:-7px;right:25px;left:auto;display:inline-block!important;border-right:8px solid transparent;border-top:8px solid #FFF;border-left:8px solid transparent;content:''}.arcontactus-widget .callback-countdown-block .callback-countdown-block-phone{font-family:Arial,sans-serif;font-size:14px;line-height:16px;padding-left:10px;padding-right:10px;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;height:140px;display:none;position:relative}.arcontactus-widget .callback-countdown-block .callback-countdown-block-phone:before{transition:.2s all}.arcontactus-widget .callback-countdown-block .callback-countdown-block-phone.ar-loading:before{background:rgba(255,255,255,.8);content:' ';position:absolute;width:100%;height:100%;left:0;top:0;z-index:1}.arcontactus-widget .callback-countdown-block .callback-countdown-block-phone.ar-loading:after{content:' ';position:absolute;width:30px;height:30px;z-index:2;top:50%;bottom:50%;margin-top:-15px;margin-bottom:-15px;background:url(../img/ring-alt.gif) no-repeat}.arcontactus-widget .callback-countdown-block .callback-countdown-block-phone p{text-align:center;margin-bottom:10px;margin-top:3px}.arcontactus-widget .callback-countdown-block .callback-countdown-block-phone .callback-countdown-block-form-group{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.arcontactus-widget .callback-countdown-block .callback-countdown-block-phone .callback-countdown-block-form-group input[type=tel]{font-family:Arial,sans-serif;font-size:14px;line-height:16px;border-radius:4px;width:203px;height:36px;-webkit-box-sizing:border-box;box-sizing:border-box;padding:10px 11px 9px;border:1px solid #DDD}.arcontactus-widget .callback-countdown-block .callback-countdown-block-phone .callback-countdown-block-form-group input[type=submit]{border-radius:4px;border:0;background-color:red;color:#fff;font-family:Arial,sans-serif;font-size:14px;padding:10px 5px 9px;cursor:pointer;width:132px;height:36px;margin-left:5px}.arcontactus-widget .callback-countdown-block .callback-countdown-block-phone .callback-countdown-block-form-group input[type=submit]:hover{opacity:.8}.arcontactus-widget .callback-countdown-block .callback-countdown-block-sorry{height:140px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:none}.arcontactus-widget .callback-countdown-block .callback-countdown-block-sorry p{font-family:Arial,sans-serif;font-size:16px;line-height:18px;text-align:center;margin-bottom:5px;margin-top:7px}.arcontactus-widget .callback-countdown-block .callback-countdown-block-close{position:absolute;top:9px;right:9px;cursor:pointer;z-index:1}.arcontactus-widget .callback-countdown-block .callback-countdown-block-timer{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:140px;display:none}.arcontactus-widget .callback-countdown-block .callback-countdown-block-timer p{font-family:Arial,sans-serif;font-size:14px;line-height:16px;text-align:center;margin-bottom:5px;margin-top:7px}.arcontactus-widget .callback-countdown-block .callback-countdown-block-timer h1{font-family:Ubuntu,Arial,sans-serif;font-size:40px;line-height:46px;text-align:center;font-weight:300}.arcontactus-widget .callback-countdown-block .callback-countdown-block-phone.display-flex,.arcontactus-widget .callback-countdown-block .callback-countdown-block-sorry.display-flex,.arcontactus-widget .callback-countdown-block .callback-countdown-block-timer.display-flex{display:-webkit-box;display:-ms-flexbox;display:flex}.arcontactus-widget .callback-state{background-color:#fff;width:44px;height:44px;border-radius:50px;position:absolute;overflow:hidden;top:50%;left:50%;margin-top:-22px;margin-left:-22px;-webkit-animation:none;animation:none;z-index:999999;transition:.2s all;transform:scale(0);color:red;display:-webkit-box;display:-ms-flexbox;display:flex}.arcontactus-widget .callback-state.display-flex{transform:scale(1)}.arcontactus-widget .callback-state svg{width:24px;height:24px;position:absolute;top:50%;left:50%;margin-top:-12px;margin-left:-12px}.arcontactus-widget .callback-state .callback-state-img{position:absolute;top:12px;left:12px}.arcontactus-widget .animation-pause{-webkit-animation-play-state:paused;animation-play-state:paused}@-webkit-keyframes arcontactus-pulse{0%{-webkit-transform:scale(0);transform:scale(0);opacity:1}50%{opacity:.5}100%{-webkit-transform:scale(1);transform:scale(1);opacity:0}}@media (max-width:468px){.arcontactus-widget.opened.arcontactus-message,.arcontactus-widget.opened.left.arcontactus-message{width:auto;right:20px;left:20px}.arcontactus-widget .callback-countdown-block{width:100%}}@media (max-width:428px){.arcontactus-widget .callback-countdown-block .callback-countdown-block-phone .callback-countdown-block-form-group{display:block}.arcontactus-widget .callback-countdown-block .callback-countdown-block-phone .callback-countdown-block-form-group input[type=submit],.arcontactus-widget .callback-countdown-block .callback-countdown-block-phone .callback-countdown-block-form-group input[type=tel]{display:block;width:100%;margin:0 0 5px}}@keyframes arcontactus-updown{0%,100%,43%{transform:translate(0,0)}25%,35%{transform:translate(0,-10px)}}@-webkit-keyframes arcontactus-updown{0%,100%,43%{transform:translate(0 0)}25%,35%{transform:translate(-10px 0)}}@keyframes arcontactus-pulse{0%{-webkit-transform:scale(0);transform:scale(0);opacity:1}50%{opacity:.5}100%{-webkit-transform:scale(1);transform:scale(1);opacity:0}}@-webkit-keyframes arcontactus-show-stat{0%,100%,20%,85%{-webkit-transform:scale(1);transform:scale(1)}21%,84%{-webkit-transform:scale(0);transform:scale(0)}}@keyframes arcontactus-show-stat{0%,100%,20%,85%{-webkit-transform:scale(1);transform:scale(1)}21%,84%{-webkit-transform:scale(0);transform:scale(0)}}@-webkit-keyframes arcontactus-show-icons{0%,100%,20%,85%{-webkit-transform:scale(0);transform:scale(0)}21%,84%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes arcontactus-show-icons{0%,100%,20%,85%{-webkit-transform:scale(0);transform:scale(0)}21%,84%{-webkit-transform:scale(1);transform:scale(1)}}
  /*]]>*/
</style>
    <script>
//<![CDATA[
"use strict";!function(t){function e(s,n){this._initialized=!1,this.settings=null,this.options=t.extend({},e.Defaults,n),this.$element=t(s),this.init(),this.x=0,this.y=0,this._interval,this._menuOpened=!1,this._callbackOpened=!1,this.countdown=null}e.Defaults={align:"right",mode:"regular",countdown:10,drag:!1,buttonText:"",buttonSize:"small",menuSize:"small",buttonIcon:'<svg viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g id="Canvas" transform="translate(-825 -308)"><g id="Vector"><use xlink:href="#path0_fill0123" transform="translate(825 308)" fill="currentColor"></use></g></g><defs><path id="path0_fill0123" d="M 19 4L 17 4L 17 13L 4 13L 4 15C 4 15.55 4.45 16 5 16L 16 16L 20 20L 20 5C 20 4.45 19.55 4 19 4ZM 15 10L 15 1C 15 0.45 14.55 0 14 0L 1 0C 0.45 0 0 0.45 0 1L 0 15L 4 11L 14 11C 14.55 11 15 10.55 15 10Z"></path></defs></svg>',ajaxUrl:"server.php",action:"callback",phonePlaceholder:"+X-XXX-XXX-XX-XX",callbackSubmitText:"Ch\xe1\xbb\x9d cu\xe1\xbb™c g\xe1\xbb\x8di!",reCaptcha:!1,reCaptchaAction:"callbackRequest",reCaptchaKey:"",errorMessage:"L\xe1\xbb—i k\xe1\xba\xbft n\xe1\xbb‘i. HĂ\xa3y lĂ m m\xe1\xbb›i trang vĂ  th\xe1\xbb\xad l\xe1\xba\xa1i.",callProcessText:"ChĂ\xbang tĂ\xb4i \xc4‘ang g\xe1\xbb\x8di \xc4‘i\xe1\xbb‡n tho\xe1\xba\xa1i cho b\xe1\xba\xa1n!",callSuccessText:"C\xe1\xba\xa3m \xc6\xa1n b\xe1\xba\xa1n.<br />ChĂ\xbang tĂ\xb4i s\xe1\xba\xbd s\xe1\xbb›m g\xe1\xbb\x8di l\xe1\xba\xa1i cho b\xe1\xba\xa1n!",items:[],iconsAnimationSpeed:800,theme:"#000000",callbackFormText:"Xin vui lĂ\xb2ng \xc4‘i\xe1\xbb\x81n s\xe1\xbb‘ \xc4‘i\xe1\xbb‡n tho\xe1\xba\xa1i c\xe1\xbb\xa7a b\xe1\xba\xa1n.<br />VĂ  chĂ\xbang tĂ\xb4i g\xe1\xbb\x8di l\xe1\xba\xa1i cho b\xe1\xba\xa1n s\xe1\xbb›m!",closeIcon:'<svg width="12" height="13" viewBox="0 0 14 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g id="Canvas" transform="translate(-4087 108)"><g id="Vector"><use xlink:href="#path0_fill" transform="translate(4087 -108)" fill="currentColor"></use></g></g><defs><path id="path0_fill" d="M 14 1.41L 12.59 0L 7 5.59L 1.41 0L 0 1.41L 5.59 7L 0 12.59L 1.41 14L 7 8.41L 12.59 14L 14 12.59L 8.41 7L 14 1.41Z"></path></defs></svg>',callbackStateIcon:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M493.4 24.6l-104-24c-11.3-2.6-22.9 3.3-27.5 13.9l-48 112c-4.2 9.8-1.4 21.3 6.9 28l60.6 49.6c-36 76.7-98.9 140.5-177.2 177.2l-49.6-60.6c-6.8-8.3-18.2-11.1-28-6.9l-112 48C3.9 366.5-2 378.1.6 389.4l24 104C27.1 504.2 36.7 512 48 512c256.1 0 464-207.5 464-464 0-11.2-7.7-20.9-18.6-23.4z"></path></svg>'},e.prototype.init=function(){if(this._initialized)return!1;this.destroy(),this.settings=t.extend({},this.options),this.$element.addClass("arcontactus-widget").addClass("arcontactus-message"),"left"===this.settings.align?this.$element.addClass("left"):this.$element.addClass("right"),this.settings.items.length?(this.$element.append("<!--noindex-->"),this._initCallbackBlock(),"regular"==this.settings.mode&&this._initMessengersBlock(),this._initMessageButton(),this._initPrompt(),this._initEvents(),this.startAnimation(),this.$element.append("<!--/noindex-->"),this.$element.addClass("active")):console.info("jquery.contactus:no items"),this._initialized=!0,this.$element.trigger("arcontactus.init")},e.prototype.destroy=function(){if(!this._initialized)return!1;this.$element.html(""),this._initialized=!1,this.$element.trigger("arcontactus.destroy")},e.prototype._initCallbackBlock=function(){var e=t("<div>",{class:"callback-countdown-block",style:this._colorStyle()}),s=t("<div>",{class:"callback-countdown-block-close"});s.append(this.settings.closeIcon);var n=t("<div>",{class:"callback-countdown-block-phone"});n.append("<p>"+this.settings.callbackFormText+"</p>");var a=t("<form>",{action:this.settings.ajaxUrl,method:"POST"}),i=t("<div>",{class:"callback-countdown-block-form-group"}),o=t("<input>",{name:"action",type:"hidden",value:this.settings.action}),c=t("<input>",{name:"gtoken",class:"ar-g-token",type:"hidden",value:""}),l=t("<input>",{name:"phone",class:"arcontactus-message-callback-phone",required:"",type:"tel",value:"",placeholder:this.settings.phonePlaceholder}),r=t("<input>",{id:"arcontactus-message-callback-phone-submit",type:"submit",style:this._backgroundStyle(),value:this.settings.callbackSubmitText});i.append(o),i.append(c),i.append(l),i.append(r);var p=t("<div>",{class:"callback-countdown-block-timer"}),d=t("<p>"+this.settings.callProcessText+"</p>"),h=t("<div>",{class:"callback-countdown-block-timer_timer"});p.append(d),p.append(h);var u=t("<div>",{class:"callback-countdown-block-sorry"}),m=t("<p>"+this.settings.callSuccessText+"</p>");u.append(m),a.append(i),n.append(a),e.append(s),e.append(n),e.append(p),e.append(u),this.$element.append(e)},e.prototype._initMessengersBlock=function(){var e=t("<div>",{class:"messangers-block"});("normal"===this.settings.menuSize||"large"===this.settings.menuSize)&&e.addClass("lg"),"small"===this.settings.menuSize&&e.addClass("sm"),this._appendMessengerIcons(e),this.$element.append(e)},e.prototype._appendMessengerIcons=function(e){t.each(this.settings.items,function(s){if("callback"==this.href)var n=t("<div>",{class:"messanger call-back "+(this.class?this.class:"")});else{var n=t("<a>",{class:"messanger "+(this.class?this.class:""),id:this.id?this.id:null,rel:"nofollow noopener",href:this.href,target:this.target?this.target:"_blank"});if(this.onClick){var a=this;n.on("click",function(t){a.onClick(t)})}}var i=t("<span>",{style:this.color?"background-color:"+this.color:null});i.append(this.icon),n.append(i),n.append("<p>"+this.title+"</p>"),e.append(n)})},e.prototype._initMessageButton=function(){var e=this,s=t("<div>",{class:"arcontactus-message-button",style:this._backgroundStyle()});"large"===this.settings.buttonSize&&this.$element.addClass("lg"),"huge"===this.settings.buttonSize&&this.$element.addClass("hg"),"medium"===this.settings.buttonSize&&this.$element.addClass("md"),"small"===this.settings.buttonSize&&this.$element.addClass("sm");var n=t("<div>",{class:"static"});n.append(this.settings.buttonIcon),!1!==this.settings.buttonText?n.append("<p>"+this.settings.buttonText+"</p>"):s.addClass("no-text");var a=t("<div>",{class:"callback-state",style:e._colorStyle()});a.append(this.settings.callbackStateIcon);var i=t("<div>",{class:"icons hide"}),o=t("<div>",{class:"icons-line"});t.each(this.settings.items,function(s){var n=t("<span>",{style:e._colorStyle()});n.append(this.icon),o.append(n)}),i.append(o);var c=t("<div>",{class:"arcontactus-close"});c.append(this.settings.closeIcon);var l=t("<div>",{class:"pulsation",style:e._backgroundStyle()}),r=t("<div>",{class:"pulsation",style:e._backgroundStyle()});s.append(n).append(a).append(i).append(c).append(l).append(r),this.$element.append(s)},e.prototype._initPrompt=function(){var e=t("<div>",{class:"arcontactus-prompt"}),s=t("<div>",{class:"arcontactus-prompt-close",style:this._colorStyle()});s.append(this.settings.closeIcon);var n=t("<div>",{class:"arcontactus-prompt-inner"});e.append(s).append(n),this.$element.append(e)},e.prototype._initEvents=function(){var e=this.$element,s=this;e.find(".arcontactus-message-button").on("mousedown",function(t){s.x=t.pageX,s.y=t.pageY}).on("mouseup",function(t){t.pageX===s.x&&t.pageY===s.y&&("regular"==s.settings.mode?s.toggleMenu():s.openCallbackPopup(),t.preventDefault())}),this.settings.drag&&(e.draggable(),e.get(0).addEventListener("touchmove",function(t){var s=t.targetTouches[0];e.get(0).style.left=s.pageX-25+"px",e.get(0).style.top=s.pageY-25+"px",t.preventDefault()},!1)),t(document).on("click",function(t){s.closeMenu()}),e.on("click",function(t){t.stopPropagation()}),e.find(".call-back").on("click",function(){s.openCallbackPopup()}),e.find(".callback-countdown-block-close").on("click",function(){null!=s.countdown&&(clearInterval(s.countdown),s.countdown=null),s.closeCallbackPopup()}),e.find(".arcontactus-prompt-close").on("click",function(){s.hidePrompt()}),e.find("form").on("submit",function(t){t.preventDefault(),e.find(".callback-countdown-block-phone").addClass("ar-loading"),s.settings.reCaptcha?grecaptcha.execute(s.settings.reCaptchaKey,{action:s.settings.reCaptchaAction}).then(function(t){e.find(".ar-g-token").val(t),s.sendCallbackRequest()}):s.sendCallbackRequest()}),setTimeout(function(){s._processHash()},500),t(window).on("hashchange",function(t){s._processHash()})},e.prototype._processHash=function(){var t=window.location.hash;switch(t){case"#callback-form":case"callback-form":this.openCallbackPopup();break;case"#callback-form-close":case"callback-form-close":this.closeCallbackPopup();break;case"#contactus-menu":case"contactus-menu":this.openMenu();break;case"#contactus-menu-close":case"contactus-menu-close":this.closeMenu();break;case"#contactus-hide":case"contactus-hide":this.hide();break;case"#contactus-show":case"contactus-show":this.show()}},e.prototype._callBackCountDownMethod=function(){var t=this.settings.countdown,e=this.$element,s=this,n=60;e.find(".callback-countdown-block-phone, .callback-countdown-block-timer").toggleClass("display-flex"),this.countdown=setInterval(function(){var a=t,i=n-=1;t<10&&(a="0"+t),n<10&&(i="0"+n);var o=a+":"+i;e.find(".callback-countdown-block-timer_timer").html(o),0===n&&0===t&&(clearInterval(s.countdown),s.countdown=null,e.find(".callback-countdown-block-sorry, .callback-countdown-block-timer").toggleClass("display-flex")),0===n&&(n=60,t-=1)},20)},e.prototype.sendCallbackRequest=function(){var e=this,s=e.$element;this.$element.trigger("arcontactus.beforeSendCallbackRequest"),t.ajax({url:e.settings.ajaxUrl,type:"POST",dataType:"json",data:s.find("form").serialize(),success:function(t){(e.settings.countdown&&e._callBackCountDownMethod(),s.find(".callback-countdown-block-phone").removeClass("ar-loading"),t.success)?e.settings.countdown||s.find(".callback-countdown-block-sorry, .callback-countdown-block-phone").toggleClass("display-flex"):t.errors?alert(t.errors.join("\n\r")):alert(e.settings.errorMessage),e.$element.trigger("arcontactus.successCallbackRequest",t)},error:function(){s.find(".callback-countdown-block-phone").removeClass("ar-loading"),alert(e.settings.errorMessage),e.$element.trigger("arcontactus.errorCallbackRequest")}})},e.prototype.show=function(){this.$element.addClass("active"),this.$element.trigger("arcontactus.show")},e.prototype.hide=function(){this.$element.removeClass("active"),this.$element.trigger("arcontactus.hide")},e.prototype.openMenu=function(){if("callback"==this.settings.mode)return console.log("Widget in callback mode"),!1;var t=this.$element;t.find(".messangers-block").hasClass("show-messageners-block")||(this.stopAnimation(),t.find(".messangers-block, .arcontactus-close").addClass("show-messageners-block"),t.find(".icons, .static").addClass("hide"),t.find(".pulsation").addClass("stop"),this._menuOpened=!0,this.$element.trigger("arcontactus.openMenu"))},e.prototype.closeMenu=function(){if("callback"==this.settings.mode)return console.log("Widget in callback mode"),!1;var t=this.$element;t.find(".messangers-block").hasClass("show-messageners-block")&&(t.find(".messangers-block, .arcontactus-close").removeClass("show-messageners-block"),t.find(".icons, .static").removeClass("hide"),t.find(".pulsation").removeClass("stop"),this.startAnimation(),this._menuOpened=!1,this.$element.trigger("arcontactus.closeMenu"))},e.prototype.toggleMenu=function(){var t=this.$element;if(this.hidePrompt(),t.find(".callback-countdown-block").hasClass("display-flex"))return!1;t.find(".messangers-block").hasClass("show-messageners-block")?this.closeMenu():this.openMenu(),this.$element.trigger("arcontactus.toggleMenu")},e.prototype.openCallbackPopup=function(){var t=this.$element;t.addClass("opened"),this.closeMenu(),this.stopAnimation(),t.find(".icons, .static").addClass("hide"),t.find(".pulsation").addClass("stop"),t.find(".callback-countdown-block").addClass("display-flex"),t.find(".callback-countdown-block-phone").addClass("display-flex"),t.find(".callback-state").addClass("display-flex"),this._callbackOpened=!0,this.$element.trigger("arcontactus.openCallbackPopup")},e.prototype.closeCallbackPopup=function(){var t=this.$element;t.removeClass("opened"),t.find(".messangers-block").removeClass("show-messageners-block"),t.find(".arcontactus-close").removeClass("show-messageners-block"),t.find(".icons, .static").removeClass("hide"),t.find(".pulsation").removeClass("stop"),t.find(".callback-countdown-block, .callback-countdown-block-phone, .callback-countdown-block-sorry, .callback-countdown-block-timer").removeClass("display-flex"),t.find(".callback-state").removeClass("display-flex"),this.startAnimation(),this._callbackOpened=!1,this.$element.trigger("arcontactus.closeCallbackPopup")},e.prototype.startAnimation=function(){var t=this.$element,e=t.find(".icons-line"),s=t.find(".static"),n=t.find(".icons-line>span:first-child").width()+40;if("huge"===this.settings.buttonSize||"large"===this.settings.buttonSize)var a=2,i=0;if("medium"===this.settings.buttonSize||"small"===this.settings.buttonSize)var a=4,i=-2;var o=t.find(".icons-line>span").length,c=0;if(this.stopAnimation(),0===this.settings.iconsAnimationSpeed)return!1;this._interval=setInterval(function(){0===c&&(e.parent().removeClass("hide"),s.addClass("hide"));var t="translate("+-(n*c+a)+"px, "+i+"px)";if(e.css({"-webkit-transform":t,"-ms-transform":t,transform:t}),++c>o){c>o+1&&(c=0),e.parent().addClass("hide"),s.removeClass("hide");var t="translate("+-a+"px, "+i+"px)";e.css({"-webkit-transform":t,"-ms-transform":t,transform:t})}},this.settings.iconsAnimationSpeed)},e.prototype.stopAnimation=function(){clearInterval(this._interval);var t=this.$element,e=t.find(".icons-line"),s=t.find(".static");e.parent().addClass("hide"),s.removeClass("hide");var n="translate(-2px, 0px)";e.css({"-webkit-transform":n,"-ms-transform":n,transform:n})},e.prototype.showPrompt=function(t){var e=this.$element.find(".arcontactus-prompt");t&&t.content&&e.find(".arcontactus-prompt-inner").html(t.content),e.addClass("active"),this.$element.trigger("arcontactus.showPrompt")},e.prototype.hidePrompt=function(){this.$element.find(".arcontactus-prompt").removeClass("active"),this.$element.trigger("arcontactus.hidePrompt")},e.prototype.showPromptTyping=function(){this.$element.find(".arcontactus-prompt").find(".arcontactus-prompt-inner").html(""),this._insertPromptTyping(),this.showPrompt({}),this.$element.trigger("arcontactus.showPromptTyping")},e.prototype._insertPromptTyping=function(){var e=this.$element.find(".arcontactus-prompt-inner"),s=t("<div>",{class:"arcontactus-prompt-typing"}),n=t("<div>");s.append(n),s.append(n.clone()),s.append(n.clone()),e.append(s)},e.prototype.hidePromptTyping=function(){this.$element.find(".arcontactus-prompt").removeClass("active"),this.$element.trigger("arcontactus.hidePromptTyping")},e.prototype._backgroundStyle=function(){return"background-color: "+this.settings.theme},e.prototype._colorStyle=function(){return"color: "+this.settings.theme},t.fn.contactUs=function(s){var n=Array.prototype.slice.call(arguments,1);return this.each(function(){var a=t(this),i=a.data("ar.contactus");i||(i=new e(this,"object"==typeof s&&s),a.data("ar.contactus",i)),"string"==typeof s&&"_"!==s.charAt(0)&&i[s].apply(i,n)})},t.fn.contactUs.Constructor=e}(jQuery);
    //]]>
</script>
    <script>
      //<![CDATA[
      var arCuMessages = ["Hỗ trợ khách hàng"];
      var arCuPromptClosed = false;
      var arCuDelayFirst = 500;
      var _arCuTimeOut = null;
      var arCuDelayFirst = 2000;
      var arCuTypingTime = 2000;
      var arCuMessageTime = 4000;
      var arCuCloseLastMessage = false;
      var arCuLoop = false;

      function arCuShowMessage(index) {
        if (arCuPromptClosed) {
          return false;
        }
        if (typeof arCuMessages[index] !== 'undefined') {
          jQuery('#contact').contactUs('showPromptTyping');
          _arCuTimeOut = setTimeout(function() {
            if (arCuPromptClosed) {
              return false;
            }
            jQuery('#contact').contactUs('showPrompt', {
              content: arCuMessages[index]
            });
            index++;
            _arCuTimeOut = setTimeout(function() {
              if (arCuPromptClosed) {
                return false;
              }
              arCuShowMessage(index);
            }, arCuMessageTime);
          }, arCuTypingTime);
        } else {
          if (arCuCloseLastMessage) {
            jQuery('#contact').contactUs('hidePrompt');
          }
          if (arCuLoop) {
            arCuShowMessage(0);
          }
        }
      };

      function arCuShowMessages() {
        setTimeout(function() {
          clearTimeout(_arCuTimeOut);
          arCuShowMessage(0);
        }, arCuDelayFirst);
      }
      window.addEventListener('load', function() {
        $('#contact').on('arcontactus.init', function() {
          var email = $('<input>', {
            name: 'email',
            value: 'nhannguyenvn2008@Gmail.com',
            type: 'hidden'
          });
          $('#contact .callback-countdown-block-form-group').append(email);
          arCuShowMessages();
        });
        $('#contact').contactUs({
          drag: false,
          align: 'left',
          reCaptcha: false,
          iconsAnimationSpeed: 800,
          countdown: 0,
          theme: '#ee0000',
          items: [{
            title: 'Gọi ngay: 0269 3827 557',
            icon: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M493.4 24.6l-104-24c-11.3-2.6-22.9 3.3-27.5 13.9l-48 112c-4.2 9.8-1.4 21.3 6.9 28l60.6 49.6c-36 76.7-98.9 140.5-177.2 177.2l-49.6-60.6c-6.8-8.3-18.2-11.1-28-6.9l-112 48C3.9 366.5-2 378.1.6 389.4l24 104C27.1 504.2 36.7 512 48 512c256.1 0 464-207.5 464-464 0-11.2-7.7-20.9-18.6-23.4z"></path></svg>',
            href: 'tel:0948 713 329',
            color: '#ee0000'
          }, {
            title: 'Chat messenger',
            icon: '<svg class="svg-inline--fa fa-facebook fa-w-16" aria-hidden="true" focusable="false" data-prefix="fa" data-icon="facebook" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-fa-i2svg=""><g><path fill="currentColor" d="M156.5,447.7l-12.6,29.5c-18.7-9.5-35.9-21.2-51.5-34.9l22.7-22.7C127.6,430.5,141.5,440,156.5,447.7z M40.6,272H8.5 c1.4,21.2,5.4,41.7,11.7,61.1L50,321.2C45.1,305.5,41.8,289,40.6,272z M40.6,240c1.4-18.8,5.2-37,11.1-54.1l-29.5-12.6 C14.7,194.3,10,216.7,8.5,240H40.6z M64.3,156.5c7.8-14.9,17.2-28.8,28.1-41.5L69.7,92.3c-13.7,15.6-25.5,32.8-34.9,51.5 L64.3,156.5z M397,419.6c-13.9,12-29.4,22.3-46.1,30.4l11.9,29.8c20.7-9.9,39.8-22.6,56.9-37.6L397,419.6z M115,92.4 c13.9-12,29.4-22.3,46.1-30.4l-11.9-29.8c-20.7,9.9-39.8,22.6-56.8,37.6L115,92.4z M447.7,355.5c-7.8,14.9-17.2,28.8-28.1,41.5 l22.7,22.7c13.7-15.6,25.5-32.9,34.9-51.5L447.7,355.5z M471.4,272c-1.4,18.8-5.2,37-11.1,54.1l29.5,12.6 c7.5-21.1,12.2-43.5,13.6-66.8H471.4z M321.2,462c-15.7,5-32.2,8.2-49.2,9.4v32.1c21.2-1.4,41.7-5.4,61.1-11.7L321.2,462z M240,471.4c-18.8-1.4-37-5.2-54.1-11.1l-12.6,29.5c21.1,7.5,43.5,12.2,66.8,13.6V471.4z M462,190.8c5,15.7,8.2,32.2,9.4,49.2h32.1 c-1.4-21.2-5.4-41.7-11.7-61.1L462,190.8z M92.4,397c-12-13.9-22.3-29.4-30.4-46.1l-29.8,11.9c9.9,20.7,22.6,39.8,37.6,56.9 L92.4,397z M272,40.6c18.8,1.4,36.9,5.2,54.1,11.1l12.6-29.5C317.7,14.7,295.3,10,272,8.5V40.6z M190.8,50 c15.7-5,32.2-8.2,49.2-9.4V8.5c-21.2,1.4-41.7,5.4-61.1,11.7L190.8,50z M442.3,92.3L419.6,115c12,13.9,22.3,29.4,30.5,46.1 l29.8-11.9C470,128.5,457.3,109.4,442.3,92.3z M397,92.4l22.7-22.7c-15.6-13.7-32.8-25.5-51.5-34.9l-12.6,29.5 C370.4,72.1,384.4,81.5,397,92.4z"></path><circle fill="currentColor" cx="256" cy="364" r="28"><animate attributeType="XML" repeatCount="indefinite" dur="2s" attributeName="r" values="28;14;28;28;14;28;"></animate><animate attributeType="XML" repeatCount="indefinite" dur="2s" attributeName="opacity" values="1;0;1;1;0;1;"></animate></circle><path fill="currentColor" opacity="1" d="M263.7,312h-16c-6.6,0-12-5.4-12-12c0-71,77.4-63.9,77.4-107.8c0-20-17.8-40.2-57.4-40.2c-29.1,0-44.3,9.6-59.2,28.7 c-3.9,5-11.1,6-16.2,2.4l-13.1-9.2c-5.6-3.9-6.9-11.8-2.6-17.2c21.2-27.2,46.4-44.7,91.2-44.7c52.3,0,97.4,29.8,97.4,80.2 c0,67.6-77.4,63.5-77.4,107.8C275.7,306.6,270.3,312,263.7,312z"><animate attributeType="XML" repeatCount="indefinite" dur="2s" attributeName="opacity" values="1;0;0;0;0;1;"></animate></path><path fill="currentColor" opacity="0" d="M232.5,134.5l7,168c0.3,6.4,5.6,11.5,12,11.5h9c6.4,0,11.7-5.1,12-11.5l7-168c0.3-6.8-5.2-12.5-12-12.5h-23 C237.7,122,232.2,127.7,232.5,134.5z"><animate attributeType="XML" repeatCount="indefinite" dur="2s" attributeName="opacity" values="0;0;1;1;0;0;"></animate></path></g></svg>',
            href: 'https://m.me/blogtrongminh',
            color: '#ee0000'
          }, {
            title: 'Gửi tin nhắn SMS',
            icon: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path fill="currentColor" d="M512 160h-96V64c0-35.3-28.7-64-64-64H64C28.7 0 0 28.7 0 64v160c0 35.3 28.7 64 64 64h32v52c0 7.1 5.8 12 12 12 2.4 0 4.9-.7 7.1-2.4L224 288h128c35.3 0 64-28.7 64-64v-32h96c17.6 0 32 14.4 32 32v160c0 17.6-14.4 32-32 32h-64v49.6l-80.2-45.4-7.3-4.2H256c-17.6 0-32-14.4-32-32v-96l-32 18.1V384c0 35.3 28.7 64 64 64h96l108.9 61.6c2.2 1.6 4.7 2.4 7.1 2.4 6.2 0 12-4.9 12-12v-52h32c35.3 0 64-28.7 64-64V224c0-35.3-28.7-64-64-64zm-128 64c0 17.6-14.4 32-32 32H215.6l-7.3 4.2-80.3 45.4V256H64c-17.6 0-32-14.4-32-32V64c0-17.6 14.4-32 32-32h288c17.6 0 32 14.4 32 32v160z"></path></svg>',
            href: 'sms:0948 713 329',
            color: '#ee0000'
          }, {
            title: 'Nhắn tin trên zalo',
            icon: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path fill="currentColor" d="M385.2 167.6c6.4 0 12.6.3 18.8 1.1C387.4 90.3 303.3 32 207.7 32 100.5 32 13 104.8 13 197.4c0 53.4 29.3 97.5 77.9 131.6l-19.3 58.6 68-34.1c24.4 4.8 43.8 9.7 68.2 9.7 6.2 0 12.1-.3 18.3-.8-4-12.9-6.2-26.6-6.2-40.8-.1-84.9 72.9-154 165.3-154zm-104.5-52.9c14.5 0 24.2 9.7 24.2 24.4 0 14.5-9.7 24.2-24.2 24.2-14.8 0-29.3-9.7-29.3-24.2.1-14.7 14.6-24.4 29.3-24.4zm-136.4 48.6c-14.5 0-29.3-9.7-29.3-24.2 0-14.8 14.8-24.4 29.3-24.4 14.8 0 24.4 9.7 24.4 24.4 0 14.6-9.6 24.2-24.4 24.2zM563 319.4c0-77.9-77.9-141.3-165.4-141.3-92.7 0-165.4 63.4-165.4 141.3S305 460.7 397.6 460.7c19.3 0 38.9-5.1 58.6-9.9l53.4 29.3-14.8-48.6C534 402.1 563 363.2 563 319.4zm-219.1-24.5c-9.7 0-19.3-9.7-19.3-19.6 0-9.7 9.7-19.3 19.3-19.3 14.8 0 24.4 9.7 24.4 19.3 0 10-9.7 19.6-24.4 19.6zm107.1 0c-9.7 0-19.3-9.7-19.3-19.6 0-9.7 9.7-19.3 19.3-19.3 14.5 0 24.4 9.7 24.4 19.3.1 10-9.9 19.6-24.4 19.6z"></path></svg>',
            href: 'https://zalo.me/0948713329',
            color: '#ee0000'
          }, {
            title: 'Gửi mail cho chúng tôi',
            icon: '<svg  xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M464 64H48C21.5 64 0 85.5 0 112v288c0 26.5 21.5 48 48 48h416c26.5 0 48-21.5 48-48V112c0-26.5-21.5-48-48-48zM48 96h416c8.8 0 16 7.2 16 16v41.4c-21.9 18.5-53.2 44-150.6 121.3-16.9 13.4-50.2 45.7-73.4 45.3-23.2.4-56.6-31.9-73.4-45.3C85.2 197.4 53.9 171.9 32 153.4V112c0-8.8 7.2-16 16-16zm416 320H48c-8.8 0-16-7.2-16-16V195c22.8 18.7 58.8 47.6 130.7 104.7 20.5 16.4 56.7 52.5 93.3 52.3 36.4.3 72.3-35.5 93.3-52.3 71.9-57.1 107.9-86 130.7-104.7v205c0 8.8-7.2 16-16 16z"></path></svg>',
            href: 'mailto:minhruoutv@gmail.com',
            color: '#ee0000'
          }]
        });
      });
      //]]>
    </script>

Lưu ý: 

Blog cần phải sử dụng thư viện jQuery. Nếu blog của bạn có rồi thì bỏ qua bước này, nếu blog chưa có thì copy code dưới dán trước thẻ </head>. Đa số blogspot hiện nay đều sử dụng thư viện jQuery này rồi.
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.1/jquery.min.js" integrity="sha512-aVKKRRi/Q/YV+4mjoKBsE4x3H+BkegoM/em46NNlCqNTmUYADjBbeNefNxYV7giUp0VxICtqdrbqU7iVaeZNXA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>

2 - Bộ tiện ích contact liên hệ kiểu 2

Bộ tiện ích liên hệ cho blogspot bao gồm: MessengerZaloGọi điện, tronng đó nút gọi điện thoại có hiệu ứng rung lắc rất đẹp mắt.

Bộ tiện ích contact liên hệ kiểu 2

Các bước cài đặt tiện ích liên hệ như sau:

Bước 1: Các bạn copy toàn bộ nội dung HTML bên dưới dán dưới thẻ mở <body> hoặc thẻ đóng </body> đều được

<div class='fixed-right'>

  <a href='https://facebook.com' target='_blank' title='Facebook'>

    <img alt='icon' height='60' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEirCazuV2PoyetkdOeW1tt_i8NVpCSBUlALbkHBCM6QlXrwr4M7mYsAH1-zi2-FgVVvbitl9zXMxdo7hzCSr8_WS8PiQFcOm4UW-hRZizDVgRIb5JPxKLZhtZ_WzaDV16kcne74Ob0FNGSj/s0/icon-menu-right1.png' width='60' />

  </a>

  <a href='https://zalo.me/0948713329' title='Zalo'>

    <img alt='icon' height='60' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhw12ul6atd9IlxnqQtlJGbFfYW-iWXPfAp5OBATr9giy-qdaZ21pywZivLV37OXz59jYzc5VPLlYrDQHNnBhmYU9Bfjv1Q6sUfQECopTefL2JJdl8FP2oJ3hd_wCq_xBj7Q7JLdmLTo2A9/s0/icon-menu-right2.png' width='60' />

  </a>

  <a class='phone' href='tel:0948713329' title='0948713329'>

    <img alt='icon' height='60' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxJD8UCkjfBIkIw2p50weEpS6wP2TtXOhWIOZP_bdwh8xBIU6wW7nr_nMNcfflEegIIEG6nR0pb10PyN6PW0ZkMHp756scz9zLaPs8oRkOb7bhYiA23hCp9ic6alHA0q2geJCA2w5sgNrM/s0/icon-menu-right3.png' width='60' />

  </a>

</div>

Bước 2: Các bạn copy toàn bộ CSS bên dưới dán trước thẻ đóng </b:skin>

img{border:0 none;max-width:100%;height:auto}.fixed-right{position:fixed;z-index:9999;right:5px;transform:translateY(-50%);top:calc(50% + 10px) !important;width:50px;text-align:center;overflow:hidden}.fixed-right a{margin-bottom:10px;width:40px;height:40px;display:inline-block}.fixed-right a.phone{border-radius:50%;background:#64bc46;padding:6px;animation:quick-alo-circle-img-anim 1s infinite ease-in-out}@-moz-keyframes quick-alo-circle-img-anim{0%{transform:rotate(0) scale(1) skew(1deg)}10%{-moz-transform:rotate(-25deg) scale(1) skew(1deg)}20%{-moz-transform:rotate(25deg) scale(1) skew(1deg)}30%{-moz-transform:rotate(-25deg) scale(1) skew(1deg)}40%{-moz-transform:rotate(25deg) scale(1) skew(1deg)}50%{-moz-transform:rotate(0) scale(1) skew(1deg)}100%{-moz-transform:rotate(0) scale(1) skew(1deg)}}@-webkit-keyframes quick-alo-circle-img-anim{0%{-webkit-transform:rotate(0) scale(1) skew(1deg)}10%{-webkit-transform:rotate(-25deg) scale(1) skew(1deg)}20%{-webkit-transform:rotate(25deg) scale(1) skew(1deg)}30%{-webkit-transform:rotate(-25deg) scale(1) skew(1deg)}40%{-webkit-transform:rotate(25deg) scale(1) skew(1deg)}50%{-webkit-transform:rotate(0) scale(1) skew(1deg)}100%{-webkit-transform:rotate(0) scale(1) skew(1deg)}}@-o-keyframes quick-alo-circle-img-anim{0%{-o-transform:rotate(0) scale(1) skew(1deg)}10%{-o-transform:rotate(-25deg) scale(1) skew(1deg)}20%{-o-transform:rotate(25deg) scale(1) skew(1deg)}30%{-o-transform:rotate(-25deg) scale(1) skew(1deg)}40%{-o-transform:rotate(25deg) scale(1) skew(1deg)}50%{-o-transform:rotate(0) scale(1) skew(1deg)}100%{-o-transform:rotate(0) scale(1) skew(1deg)}}

3 - Bộ tiện ích contact liên hệ kiểu 3

Chi sẻ tới các bạn một mẫu Tiện ích liên hệ đẹp cho blogspot phù hợp với các blogspot bán hàng. Hướng dẫn các bạn tạo tiện ích liên hệ đẹp cho blogspot bao gồm gọi điện, zalo, gửi tin nhắn và địa chỉ maps.

Bộ tiện ích contact liên hệ kiểu 3

Các bước thực hiện để cài Tiện ích liên hệ đẹp cho blogspot như sau:

Bước 1: Thêm CSS

Các bạn copy toàn bộ CSS bên dưới dán trước thẻ đóng </head> trong chủ đề của template.

<style>

  /*<![CDATA[*/

.arcontactus-widget{opacity:0;transition:.2s opacity;line-height:1}.arcontactus-widget *{box-sizing:border-box}.arcontactus-widget.left.arcontactus-message{left:20px;right:auto}.arcontactus-widget.left .arcontactus-message-button{right:auto;left:0}.arcontactus-widget.left .arcontactus-prompt{left:80px;right:auto;transform-origin:0 50%}.arcontactus-widget.left .arcontactus-prompt.arcu-prompt-top{left:0;right:auto}.arcontactus-widget.left .arcontactus-prompt.arcu-prompt-top:before{border-right:8px solid transparent;border-top:8px solid #fff;border-left:8px solid transparent;border-bottom:0 none;left:25px;right:auto}.arcontactus-widget.left .arcontactus-prompt:before{border-right:8px solid #fff;border-top:8px solid transparent;border-left:8px solid transparent;border-bottom:8px solid transparent;right:auto;left:-15px}.arcontactus-widget.left .messangers-block{right:auto;left:0;-webkit-transform-origin:10% 105%;-ms-transform-origin:10% 105%;transform-origin:10% 105%}.arcontactus-widget.left .callback-countdown-block{left:0;right:auto}.arcontactus-widget.left .messangers-block::before,.arcontactus-widget.left .callback-countdown-block::before{left:25px;right:auto}.arcontactus-widget.hg.arcontactus-message{width:100px;height:100px}.arcontactus-widget.hg .messangers-block,.arcontactus-widget.hg .callback-countdown-block,.arcontactus-widget.hg .arcu-popup{bottom:110px}.arcontactus-widget.hg .arcontactus-prompt{bottom:5px}.arcontactus-widget.hg .icons-line{top:22px;left:24px}.arcontactus-widget.hg.left .messangers-block:before,.arcontactus-widget.hg.left .callback-countdown-block:before,.arcontactus-widget.hg.left .arcu-popup:before{left:41px}.arcontactus-widget.hg.left .arcontactus-prompt{left:110px;bottom:26px}.arcontactus-widget.hg.right .messangers-block:before,.arcontactus-widget.hg.right .callback-countdown-block:before,.arcontactus-widget.hg.right .arcu-popup:before{right:41px}.arcontactus-widget.hg.right .arcontactus-prompt{right:110px;bottom:26px}.arcontactus-widget.hg .arcontactus-message-button{width:100px;height:100px}.arcontactus-widget.hg .arcontactus-message-button .pulsation{width:114px;height:114px;border-radius:60px}.arcontactus-widget.hg .arcontactus-message-button .icons{width:70px;height:70px;margin-top:-35px;margin-left:-35px}.arcontactus-widget.hg .arcontactus-message-button .callback-state{width:70px;height:70px;margin-top:-35px;margin-left:-35px}.arcontactus-widget.md.arcontactus-message{width:60px;height:60px}.arcontactus-widget.md .messangers-block,.arcontactus-widget.md .callback-countdown-block,.arcontactus-widget.md .arcu-popup{bottom:70px}.arcontactus-widget.md .arcontactus-prompt{bottom:5px}.arcontactus-widget.md.left .messangers-block:before,.arcontactus-widget.md.left .callback-countdown-block:before,.arcontactus-widget.md.left .arcu-popup:before{left:21px}.arcontactus-widget.md.left .arcontactus-prompt{left:70px}.arcontactus-widget.md.left .arcontactus-prompt.arcu-prompt-top{bottom:70px;left:0;right:auto}.arcontactus-widget.md.left .arcontactus-prompt.arcu-prompt-top:before{border-right:8px solid transparent;border-top:8px solid #fff;border-left:8px solid transparent;border-bottom:0 none;left:21px;right:auto}.arcontactus-widget.md.right .messangers-block:before,.arcontactus-widget.md.right .callback-countdown-block:before,.arcontactus-widget.md.right .arcu-popup:before{right:21px}.arcontactus-widget.md.right .arcontactus-prompt{right:70px}.arcontactus-widget.md.right .arcontactus-prompt.arcu-prompt-top{right:0;bottom:70px}.arcontactus-widget.md.right .arcontactus-prompt.arcu-prompt-top:before{right:21px}.arcontactus-widget.md .arcontactus-message-button{width:60px;height:60px}.arcontactus-widget.md .arcontactus-message-button .pulsation{width:74px;height:74px}.arcontactus-widget.md .arcontactus-message-button .icons{width:40px;height:40px;margin-top:-20px;margin-left:-20px}.arcontactus-widget.md .arcontactus-message-button .callback-state{width:40px;height:40px;margin-top:-20px;margin-left:-20px}.arcontactus-widget.sm.arcontactus-message{width:60px;height:60px}.arcontactus-widget.sm .messangers-block,.arcontactus-widget.sm .callback-countdown-block,.arcontactus-widget.sm .arcu-popup{bottom:60px}.arcontactus-widget.sm .arcontactus-prompt{bottom:0}.arcontactus-widget.sm.left .messangers-block:before,.arcontactus-widget.sm.left .callback-countdown-block:before,.arcontactus-widget.sm.left .arcu-popup:before{left:16px}.arcontactus-widget.sm.left .arcontactus-prompt{left:60px}.arcontactus-widget.sm.left .arcontactus-prompt.arcu-prompt-top{bottom:60px;left:0;right:auto}.arcontactus-widget.sm.left .arcontactus-prompt.arcu-prompt-top:before{border-right:8px solid transparent;border-top:8px solid #fff;border-left:8px solid transparent;border-bottom:0 none;left:16px;right:auto}.arcontactus-widget.sm.right .messangers-block:before,.arcontactus-widget.sm.right .callback-countdown-block:before,.arcontactus-widget.sm.right .arcu-popup:before{right:16px}.arcontactus-widget.sm.right .arcontactus-prompt{right:70px;bottom: 7px;}.arcontactus-widget.sm.right .arcontactus-prompt.arcu-prompt-top{right:0;bottom:60px}.arcontactus-widget.sm.right .arcontactus-prompt.arcu-prompt-top:before{right:16px}.arcontactus-widget.sm .arcontactus-message-button{width:60px;height:60px}.arcontactus-widget.sm .arcontactus-message-button .pulsation{width:74px;height:74px}.arcontactus-widget.sm .arcontactus-message-button .icons{width:40px;height:40px;margin-top:-20px;margin-left:-20px}.arcontactus-widget.sm .arcontactus-message-button .static{margin-top:-16px}.arcontactus-widget.sm .arcontactus-message-button .callback-state{width:40px;height:40px;margin-top:-20px;margin-left:-20px}.arcontactus-widget.active{opacity:1}.arcontactus-widget.arcontactus-message{z-index:1000000;right:20px;bottom:20px;position:fixed !important;height:70px;width:70px}.arcontactus-widget .arcontactus-message-button{width:70px;position:absolute;height:70px;right:0;background-color:red;border-radius:50px;-webkit-box-sizing:border-box;box-sizing:border-box;text-align:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;cursor:pointer}.arcontactus-widget .arcontactus-message-button p,.arcontactus-widget .arcontactus-message-button .arcu-item-label{font-family:Segoe UI,Frutiger,Frutiger Linotype,Dejavu Sans,Helvetica Neue,Arial,sans-serif;color:#fff;font-weight:700;font-size:10px;line-height:11px;margin:0}.arcontactus-widget .arcontactus-message-button .pulsation{width:84px;height:84px;background-color:red;border-radius:50px;position:absolute;left:-7px;top:-7px;z-index:-1;-webkit-transform:scale(0);-ms-transform:scale(0);transform:scale(0);-webkit-animation:arcontactus-pulse 2s infinite;animation:arcontactus-pulse 2s infinite}.arcontactus-widget .arcontactus-message-button .icons{background-color:#fff;width:44px;height:44px;border-radius:50px;position:absolute;overflow:hidden;top:50%;left:50%;margin-top:-22px;margin-left:-22px}.arcontactus-widget .arcontactus-message-button .static{position:absolute;top:50%;left:50%;margin-top:-19px;margin-left:-26px;width:52px;height:52px;text-align:center}.arcontactus-widget .arcontactus-message-button .static img{display:inline}.arcontactus-widget .arcontactus-message-button .static svg{width:24px;height:24px;color:#fff}.arcontactus-widget .arcontactus-message-button.no-text .static{margin-top:-12px}.arcontactus-widget .pulsation:nth-of-type(2n){-webkit-animation-delay:.5s;animation-delay:.5s}.arcontactus-widget .pulsation.stop{-webkit-animation:none;animation:none}.arcontactus-widget .icons-line{top:10px;left:12px;display:-webkit-box;display:-ms-flexbox;display:flex;position:absolute;-webkit-transition:cubic-bezier(.13, 1.49, .14, -0.4);-o-transition:cubic-bezier(.13, 1.49, .14, -0.4);transition:cubic-bezier(.13, 1.49, .14, -0.4);-webkit-animation-delay:0s;animation-delay:0s;-webkit-transform:translateX(30px);-ms-transform:translateX(30px);transform:translateX(30px);height:24px;transition:.2s all}.arcontactus-widget .icons-line.stop{-webkit-animation-play-state:paused;animation-play-state:paused}.arcontactus-widget .icons-line span{display:inline-block;width:24px;height:24px;color:red}.arcontactus-widget .icons-line span svg,.arcontactus-widget .icons-line span i{width:24px;height:24px}.arcontactus-widget .icons-line span i{display:block;font-size:24px;line-height:24px}.arcontactus-widget .icons-line img,.arcontactus-widget .icons-line span{margin-right:40px}.arcontactus-widget .static{transition:.2s all}.arcontactus-widget .static.hide{transform:scale(0);opacity:0}.arcontactus-widget .icons{transition:.2s all}.arcontactus-widget .icons.hide{transform:scale(0);opacity:0}.arcontactus-widget .icons.hide .icons-line{transform:scale(0)}.arcontactus-widget .icons .icon:first-of-type{margin-left:0}.arcontactus-widget .arcontactus-close{color:#fff}.arcontactus-widget .arcontactus-close svg{-webkit-transform:rotate(180deg) scale(0);-ms-transform:rotate(180deg) scale(0);transform:rotate(180deg) scale(0);-webkit-transition:ease-in .12s all;-o-transition:ease-in .12s all;transition:ease-in .12s all;display:block}.arcontactus-widget .arcontactus-close.show-messageners-block svg{-webkit-transform:rotate(0) scale(1);-ms-transform:rotate(0) scale(1);transform:rotate(0) scale(1)}.arcontactus-widget .arcontactus-prompt{display:-webkit-box;display:-ms-flexbox;display:flex}.arcontactus-widget .messangers-block,.arcontactus-widget .arcontactus-prompt,.arcontactus-widget .arcu-popup{background:#fff;box-shadow:0 0 40px rgba(0,0,0,0.2);width:300px;background-repeat:no-repeat;background-position:center;position:absolute;bottom:80px;right:0;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;padding:10px 0;-webkit-box-sizing:border-box;box-sizing:border-box;border-radius:7px;-webkit-transform-origin:80% 105%;-ms-transform-origin:80% 105%;transform-origin:80% 105%;-webkit-transform:scale(0);-ms-transform:scale(0);transform:scale(0);-webkit-transition:ease-out .12s all;-o-transition:ease-out .12s all;transition:ease-out .12s all;z-index:1000000}.arcontactus-widget .messangers-block:before,.arcontactus-widget .arcontactus-prompt:before,.arcontactus-widget .arcu-popup:before{position:absolute;bottom:-7px;right:25px;left:auto;display:inline-block !important;border-right:8px solid transparent;border-top:8px solid #fff;border-left:8px solid transparent;content:''}.arcontactus-widget .messangers-block.show-messageners-block,.arcontactus-widget .arcontactus-prompt.show-messageners-block,.arcontactus-widget .arcu-popup.show-messageners-block{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}.arcontactus-widget .arcu-popup{padding:0}.arcontactus-widget .arcu-popup .arcu-popup-header{padding:18px 15px;color:#fff;background:#787878;border-radius:7px 7px 0 0;font-family:Segoe UI,Frutiger,Frutiger Linotype,Dejavu Sans,Helvetica Neue,Arial,sans-serif;margin-bottom:0;font-size:17px;position:relative;line-height:1.4}.arcontactus-widget .arcu-popup .arcu-popup-content{padding:10px;max-height:300px;overflow:auto;line-height:initial}.arcontactus-widget .arcontactus-prompt.arcu-prompt-top{right:0;max-width:260px;bottom:80px}.arcontactus-widget .arcontactus-prompt.arcu-prompt-top:before{bottom:-7px;right:25px;left:auto;border-right:8px solid transparent;border-top:8px solid #fff;border-left:8px solid transparent;border-bottom:0 none}.arcontactus-widget .messangers-block{display:block}.arcontactus-widget .messangers-block.has-header{padding-top:0}.arcontactus-widget .messangers-block .arcu-menu-header{padding:18px 15px;color:#fff;background:#787878;border-radius:7px 7px 0 0;font-family:Segoe UI,Frutiger,Frutiger Linotype,Dejavu Sans,Helvetica Neue,Arial,sans-serif;margin-bottom:10px;font-size:17px;position:relative;line-height:1.4}.arcontactus-widget .arcu-header-close,.arcontactus-widget .arcu-popup-close,.arcontactus-widget .arcu-popup-back{position:absolute;right:0;top:-30px;padding:0;margin:0;border:0 none;background:none;line-height:1;width:26px;height:26px;cursor:pointer;color:#fff;background:#787878;border-radius:50%;text-align:center}.arcontactus-widget .arcu-header-close svg,.arcontactus-widget .arcu-popup-close svg,.arcontactus-widget .arcu-popup-back svg{height:12px;width:12px;display:block;position:absolute;left:50%;top:50%;margin:-6px 0 0 -6px}.arcontactus-widget .arcu-popup-back{right:auto;left:0;top:50%;margin-top:-13px;display:none}.arcontactus-widget .arcu-popup-back svg{height:16px;width:16px;margin:-8px 0 0 -8px}.arcontactus-widget .arcontactus-prompt{color:#787878;font-family:Segoe UI,Frutiger,Frutiger Linotype,Dejavu Sans,Helvetica Neue,Arial,sans-serif;font-size:16px;line-height:18px;width:auto;bottom:10px;right:80px;white-space:nowrap;padding:14px 20px 14px}.arcontactus-widget .arcontactus-prompt:before{border-right:8px solid transparent;border-top:8px solid transparent;border-left:8px solid #fff;border-bottom:8px solid transparent;bottom:16px;right:-15px}.arcontactus-widget .arcontactus-prompt.active{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}.arcontactus-widget .arcontactus-prompt:hover .arcontactus-prompt-close{opacity:1}.arcontactus-widget .arcontactus-prompt .arcontactus-prompt-close{opacity:0;transition:.2s all;position:absolute;right:-10px;top:-10px;padding:0;margin:0;border:0 none;background:none;line-height:1;width:26px;height:26px;cursor:pointer;color:#fff;background:#787878;border-radius:50%;text-align:center}.arcontactus-widget .arcontactus-prompt .arcontactus-prompt-close svg{height:12px;width:12px;display:block;position:absolute;left:50%;top:50%;margin:-6px 0 0 -6px}.arcontactus-widget .arcontactus-prompt .arcontactus-prompt-typing{border-radius:10px;display:inline-block;left:3px;padding:0 0 0 3px;position:relative;top:4px;width:50px}.arcontactus-widget .arcontactus-prompt .arcontactus-prompt-typing>div{position:relative;float:left;border-radius:50%;width:10px;height:10px;background:#ccc;margin:0 2px;-webkit-animation:arcontactus-updown 2s infinite;animation:arcontactus-updown 2s infinite}.arcontactus-widget .arcontactus-prompt .arcontactus-prompt-typing>div:nth-child(2){animation-delay:.1s}.arcontactus-widget .arcontactus-prompt .arcontactus-prompt-typing>div:nth-child(3){animation-delay:.2s}.arcontactus-widget .messangers-block .messangers-list{list-style:none;margin:0;padding:0}.arcontactus-widget .messangers-block .messangers-list li{margin:0;padding:0}.arcontactus-widget .messangers-block.sm .arcu-menu-header{padding-top:12px;padding-bottom:12px}.arcontactus-widget .messangers-block.sm .not-rounded-items .messanger{padding-left:42px}.arcontactus-widget .messangers-block.sm .messanger{padding-left:50px;min-height:44px;padding-top:4px;padding-bottom:4px}.arcontactus-widget .messangers-block.sm .messanger span{height:32px;width:32px;margin-top:-16px}.arcontactus-widget .messangers-block.sm .messanger span svg,.arcontactus-widget .messangers-block.sm .messanger span i{height:20px;width:20px;line-height:20px;margin-top:-10px;margin-left:-10px;font-size:21px}.arcontactus-widget .not-rounded-items .messanger{padding-left:48px}.arcontactus-widget .not-rounded-items .messanger span{left:5px}.arcontactus-widget .messanger{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin:0;cursor:pointer;width:100%;padding:8px 20px 8px 60px;position:relative;min-height:54px;text-decoration:none}.arcontactus-widget .messanger:hover{background-color:#eee}.arcontactus-widget .messanger:before{background-repeat:no-repeat;background-position:center}.arcontactus-widget .messanger.facebook span{background:#0084ff}.arcontactus-widget .messanger.viber span{background:#7c529d}.arcontactus-widget .messanger.telegram span{background:#2ca5e0}.arcontactus-widget .messanger.skype span{background:#31c4ed}.arcontactus-widget .messanger.email span{background:#ff8400}.arcontactus-widget .messanger.contact span{background:#7eb105}.arcontactus-widget .messanger.call-back span{background:#54cd81}.arcontactus-widget .messanger span{position:absolute;left:10px;top:50%;margin-top:-20px;display:block;width:40px;height:40px;border-radius:50%;background-color:#0084ff;margin-right:10px;color:#fff;text-align:center;vertical-align:middle}.arcontactus-widget .messanger span svg,.arcontactus-widget .messanger span i{width:24px;height:24px;vertical-align:middle;text-align:center;display:block;position:absolute;top:50%;left:50%;margin-top:-12px;margin-left:-12px}.arcontactus-widget .messanger span i{font-size:24px;line-height:24px}.arcontactus-widget .messanger p,.arcontactus-widget .messanger .arcu-item-label{margin:0;font-family:Segoe UI,Frutiger,Frutiger Linotype,Dejavu Sans,Helvetica Neue,Arial,sans-serif;font-size:15px;color:rgba(0,0,0,0.87);padding:0;line-height:17px}.arcontactus-widget .messanger p .arcu-item-subtitle,.arcontactus-widget .messanger .arcu-item-label .arcu-item-subtitle{font-size:13px;color:#787878}.arcontactus-widget .callback-countdown-block{background:#fff;box-shadow:0 0 40px rgba(0,0,0,0.2);width:410px;background-repeat:no-repeat;background-position:center;position:absolute;bottom:80px;left:auto;right:0;align-items:center;border-radius:7px;-webkit-transform-origin:80% 105%;-ms-transform-origin:80% 105%;transform-origin:80% 105%;-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1);-webkit-transition:ease-out .12s all;-o-transition:ease-out .12s all;transition:ease-out .12s all;z-index:1000000;color:red;padding-top:5px;padding-left:8px;padding-right:8px;display:none}.arcontactus-widget .callback-countdown-block .callback-countdown-block-timer_timer{font-size:38px;font-family:Segoe UI,Frutiger,Frutiger Linotype,Dejavu Sans,Helvetica Neue,Arial,sans-serif}.arcontactus-widget .callback-countdown-block.display-flex{display:block}.arcontactus-widget .callback-countdown-block:before{position:absolute;bottom:-7px;right:25px;left:auto;display:inline-block !important;border-right:8px solid transparent;border-top:8px solid #fff;border-left:8px solid transparent;content:''}.arcontactus-widget .callback-countdown-block .callback-countdown-block-phone{font-family:Segoe UI,Frutiger,Frutiger Linotype,Dejavu Sans,Helvetica Neue,Arial,sans-serif;font-size:15px;line-height:18px;padding:0 10px 10px;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;display:none;width:100%;position:relative}.arcontactus-widget .callback-countdown-block .callback-countdown-block-phone:before{transition:.2s all}.arcontactus-widget .callback-countdown-block .callback-countdown-block-phone.ar-loading:before{background:rgba(255,255,255,0.8);content:' ';position:absolute;width:100%;height:100%;left:0;top:0;z-index:1}.arcontactus-widget .callback-countdown-block .callback-countdown-block-phone.ar-loading:after{content:' ';position:absolute;width:30px;height:30px;z-index:2;top:50%;bottom:50%;margin-top:-15px;margin-bottom:-15px;left:50%;margin-left:-15px;background:url('../img/ring-alt.gif') no-repeat transparent scroll 0 0}.arcontactus-widget .callback-countdown-block .callback-countdown-block-phone p,.arcontactus-widget .callback-countdown-block .callback-countdown-block-phone .arcu-item-label{text-align:center;margin-bottom:10px;margin-top:3px}.arcontactus-widget .callback-countdown-block .callback-countdown-block-phone .callback-countdown-block-form-group{align-items:center}.arcontactus-widget .callback-countdown-block .callback-countdown-block-phone .callback-countdown-block-form-group .arcu-form-group{margin-bottom:10px}.arcontactus-widget .callback-countdown-block .callback-countdown-block-phone .callback-countdown-block-form-group .arcu-form-group.arcu-form-group-required .arcu-form-label:after{content:" *";color:#c7254e}.arcontactus-widget .callback-countdown-block .callback-countdown-block-phone .callback-countdown-block-form-group .arcu-form-group.arcu-form-group-type-checkbox{position:relative;padding-left:20px}.arcontactus-widget .callback-countdown-block .callback-countdown-block-phone .callback-countdown-block-form-group .arcu-form-group.arcu-form-group-type-checkbox input{position:absolute;top:2px;left:0;width:16px;height:16px}.arcontactus-widget .callback-countdown-block .callback-countdown-block-phone .callback-countdown-block-form-group .arcu-form-label{font-size:14px;margin-bottom:3px;color:#333}.arcontactus-widget .callback-countdown-block .callback-countdown-block-phone .callback-countdown-block-form-group .arcu-form-field{display:block;width:100%;font-family:Segoe UI,Frutiger,Frutiger Linotype,Dejavu Sans,Helvetica Neue,Arial,sans-serif;font-size:14px;line-height:16px;border-radius:4px;border:0;height:36px;-webkit-box-sizing:border-box;box-sizing:border-box;padding:6px 10px 6px;border:1px solid #ddd;margin:0 !important}.arcontactus-widget .callback-countdown-block .callback-countdown-block-phone .callback-countdown-block-form-group textarea.arcu-form-field{height:80px;resize:vertical;max-height:140px;min-height:60px}.arcontactus-widget .callback-countdown-block .callback-countdown-block-phone .callback-countdown-block-form-group button[type=submit]{display:block;width:100%;border-radius:4px;border:0;background-color:red;color:#fff;font-family:Segoe UI,Frutiger,Frutiger Linotype,Dejavu Sans,Helvetica Neue,Arial,sans-serif;font-size:14px;padding:7px 5px 7px;cursor:pointer;height:36px;margin:0;line-height:1}.arcontactus-widget .callback-countdown-block .callback-countdown-block-phone .callback-countdown-block-form-group button[type=submit]:hover{opacity:.8}.arcontactus-widget .callback-countdown-block .callback-countdown-block-sorry{height:140px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:none}.arcontactus-widget .callback-countdown-block .callback-countdown-block-sorry p{font-family:Segoe UI,Frutiger,Frutiger Linotype,Dejavu Sans,Helvetica Neue,Arial,sans-serif;font-size:16px;line-height:18px;text-align:center;margin-bottom:5px;margin-top:7px;width:100%}.arcontactus-widget .callback-countdown-block .callback-countdown-block-close{position:absolute;right:9px;top:9px;padding:0;margin:0;border:0 none;background:none;line-height:1;width:26px;height:26px;cursor:pointer;color:#fff;background:#787878;border-radius:50%;z-index:1;text-align:center}.arcontactus-widget .callback-countdown-block .callback-countdown-block-close svg{height:12px;width:12px;display:block;position:absolute;left:50%;top:50%;margin:-6px 0 0 -6px}.arcontactus-widget .callback-countdown-block .callback-countdown-block-timer{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:140px;display:none}.arcontactus-widget .callback-countdown-block .callback-countdown-block-timer p{font-family:Segoe UI,Frutiger,Frutiger Linotype,Dejavu Sans,Helvetica Neue,Arial,sans-serif;font-size:16px;line-height:21px;text-align:center;margin-bottom:5px;margin-top:7px}.arcontactus-widget .callback-countdown-block .callback-countdown-block-timer h1{font-family:Segoe UI,Frutiger,Frutiger Linotype,Dejavu Sans,Helvetica Neue,Arial,sans-serif;font-size:40px;line-height:46px;text-align:center;font-weight:300}.arcontactus-widget .callback-countdown-block .callback-countdown-block-phone.display-flex{display:block}.arcontactus-widget .callback-countdown-block .callback-countdown-block-timer.display-flex,.arcontactus-widget .callback-countdown-block .callback-countdown-block-sorry.display-flex{display:-webkit-box;display:-ms-flexbox;display:flex}.arcontactus-widget .callback-state{background-color:#fff;width:44px;height:44px;border-radius:50px;position:absolute;overflow:hidden;top:50%;left:50%;margin-top:-22px;margin-left:-22px;display:none;-webkit-animation:none;animation:none;z-index:999999;transition:.2s all;transform:scale(0);color:red;display:-webkit-box;display:-ms-flexbox;display:flex}.arcontactus-widget .callback-state.display-flex{transform:scale(1)}.arcontactus-widget .callback-state svg{width:24px;height:24px;position:absolute;top:50%;left:50%;margin-top:-12px;margin-left:-12px}.arcontactus-widget .callback-state .callback-state-img{position:absolute;top:12px;left:12px}.arcontactus-widget .animation-pause{-webkit-animation-play-state:paused;animation-play-state:paused}@-webkit-keyframes arcontactus-pulse{0%{-webkit-transform:scale(0);transform:scale(0);opacity:1}50%{opacity:.5}100%{-webkit-transform:scale(1);transform:scale(1);opacity:0}}@media (max-width:468px){.arcontactus-widget.arcontactus-message.opened{width:auto;right:20px;left:20px}.arcontactus-widget .callback-countdown-block{width:auto}}@media (max-height:400px){.arcontactus-widget .arcontactus-prompt .arcontactus-prompt-close{opacity:1}}@media (max-width:428px){.arcontactus-widget .callback-countdown-block .callback-countdown-block-phone .callback-countdown-block-form-group{display:block}.arcontactus-widget .callback-countdown-block .callback-countdown-block-phone .callback-countdown-block-form-group input[type=tel],.arcontactus-widget .callback-countdown-block .callback-countdown-block-phone .callback-countdown-block-form-group button[type=submit]{display:block;width:100%;margin:0 0 5px 0}.arcontactus-widget .callback-countdown-block .callback-countdown-block-phone .callback-countdown-block-form-group input[type=tel]{margin-bottom:10px !important}.arcontactus-widget .callback-countdown-block .callback-countdown-block-phone.display-flex{display:block;width:100%}.arcontactus-widget .arcontactus-prompt .arcontactus-prompt-close{opacity:1}.arcontactus-widget.arcontactus-message .messangers-block,.arcontactus-widget.arcontactus-message .callback-countdown-block,.arcontactus-widget.arcontactus-message .arcu-popup{bottom:0;border-radius:0}.arcontactus-widget.arcontactus-message.open,.arcontactus-widget.arcontactus-message.opened,.arcontactus-widget.arcontactus-message.popup-opened{width:100%;left:0;right:0;bottom:0}.arcontactus-widget.arcontactus-message.open .messangers-block .arcu-menu-header,.arcontactus-widget.arcontactus-message.opened .messangers-block .arcu-menu-header,.arcontactus-widget.arcontactus-message.popup-opened .messangers-block .arcu-menu-header{border-radius:0;padding-right:40px}.arcontactus-widget.arcontactus-message.open .messangers-block .arcu-header-close,.arcontactus-widget.arcontactus-message.opened .messangers-block .arcu-header-close,.arcontactus-widget.arcontactus-message.popup-opened .messangers-block .arcu-header-close{right:5px;top:50%;margin-top:-13px}.arcontactus-widget.arcontactus-message.open .arcu-popup .arcu-popup-header,.arcontactus-widget.arcontactus-message.opened .arcu-popup .arcu-popup-header,.arcontactus-widget.arcontactus-message.popup-opened .arcu-popup .arcu-popup-header{border-radius:0;padding-right:40px;padding-left:30px}.arcontactus-widget.arcontactus-message.open .arcu-popup .arcu-popup-back,.arcontactus-widget.arcontactus-message.opened .arcu-popup .arcu-popup-back,.arcontactus-widget.arcontactus-message.popup-opened .arcu-popup .arcu-popup-back{display:block}.arcontactus-widget.arcontactus-message.open .arcu-popup .arcu-popup-close,.arcontactus-widget.arcontactus-message.opened .arcu-popup .arcu-popup-close,.arcontactus-widget.arcontactus-message.popup-opened .arcu-popup .arcu-popup-close{right:5px;top:50%;margin-top:-13px}.arcontactus-widget.arcontactus-message.open .messangers-block,.arcontactus-widget.arcontactus-message.opened .messangers-block,.arcontactus-widget.arcontactus-message.popup-opened .messangers-block,.arcontactus-widget.arcontactus-message.open .callback-countdown-block,.arcontactus-widget.arcontactus-message.opened .callback-countdown-block,.arcontactus-widget.arcontactus-message.popup-opened .callback-countdown-block,.arcontactus-widget.arcontactus-message.open .arcontactus-prompt,.arcontactus-widget.arcontactus-message.opened .arcontactus-prompt,.arcontactus-widget.arcontactus-message.popup-opened .arcontactus-prompt,.arcontactus-widget.arcontactus-message.open .arcu-popup,.arcontactus-widget.arcontactus-message.opened .arcu-popup,.arcontactus-widget.arcontactus-message.popup-opened .arcu-popup{width:100%}.arcontactus-widget.arcontactus-message.open .messangers-block .arcontactus-prompt-close,.arcontactus-widget.arcontactus-message.opened .messangers-block .arcontactus-prompt-close,.arcontactus-widget.arcontactus-message.popup-opened .messangers-block .arcontactus-prompt-close,.arcontactus-widget.arcontactus-message.open .callback-countdown-block .arcontactus-prompt-close,.arcontactus-widget.arcontactus-message.opened .callback-countdown-block .arcontactus-prompt-close,.arcontactus-widget.arcontactus-message.popup-opened .callback-countdown-block .arcontactus-prompt-close,.arcontactus-widget.arcontactus-message.open .arcontactus-prompt .arcontactus-prompt-close,.arcontactus-widget.arcontactus-message.opened .arcontactus-prompt .arcontactus-prompt-close,.arcontactus-widget.arcontactus-message.popup-opened .arcontactus-prompt .arcontactus-prompt-close,.arcontactus-widget.arcontactus-message.open .arcu-popup .arcontactus-prompt-close,.arcontactus-widget.arcontactus-message.opened .arcu-popup .arcontactus-prompt-close,.arcontactus-widget.arcontactus-message.popup-opened .arcu-popup .arcontactus-prompt-close{opacity:1}.arcontactus-widget.arcontactus-message.open .arcontactus-message-button,.arcontactus-widget.arcontactus-message.opened .arcontactus-message-button,.arcontactus-widget.arcontactus-message.popup-opened .arcontactus-message-button{display:none}}@keyframes arcontactus-updown{0%,43%,100%{transform:translate(0, 0)}25%,35%{transform:translate(0, -10px)}}@-webkit-keyframes arcontactus-updown{0%{transform:translate(0 0)}25%{transform:translate(-10px 0)}35%{transform:translate(-10px 0)}43%{transform:translate(0 0)}100%{transform:translate(0 0)}}@keyframes arcontactus-pulse{0%{-webkit-transform:scale(0);transform:scale(0);opacity:1}50%{opacity:.5}100%{-webkit-transform:scale(1);transform:scale(1);opacity:0}}@-webkit-keyframes arcontactus-show-stat{0%,20%{-webkit-transform:scale(1);transform:scale(1)}21%,84%{-webkit-transform:scale(0);transform:scale(0)}85%,100%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes arcontactus-show-stat{0%,20%{-webkit-transform:scale(1);transform:scale(1)}21%,84%{-webkit-transform:scale(0);transform:scale(0)}85%,100%{-webkit-transform:scale(1);transform:scale(1)}}@-webkit-keyframes arcontactus-show-icons{0%,20%{-webkit-transform:scale(0);transform:scale(0)}21%,84%{-webkit-transform:scale(1);transform:scale(1)}85%,100%{-webkit-transform:scale(0);transform:scale(0)}}@keyframes arcontactus-show-icons{0%,20%{-webkit-transform:scale(0);transform:scale(0)}21%,84%{-webkit-transform:scale(1);transform:scale(1)}85%,100%{-webkit-transform:scale(0);transform:scale(0)}}

  /*]]>*/

</style>

Bước 2: Thêm thư viện JavaScript

Các bạn copy toàn bộ code bên dưới dán trước thẻ đóng </head> trong chủ đề template

<script>

//<![CDATA[

var $jscomp=$jscomp||{};$jscomp.scope={};$jscomp.arrayIteratorImpl=function(b){var d=0;return function(){return d<b.length?{done:!1,value:b[d++]}:{done:!0}}};$jscomp.arrayIterator=function(b){return{next:$jscomp.arrayIteratorImpl(b)}};$jscomp.ASSUME_ES5=!1;$jscomp.ASSUME_NO_NATIVE_MAP=!1;$jscomp.ASSUME_NO_NATIVE_SET=!1;$jscomp.SIMPLE_FROUND_POLYFILL=!1;

$jscomp.defineProperty=$jscomp.ASSUME_ES5||"function"==typeof Object.defineProperties?Object.defineProperty:function(b,d,a){b!=Array.prototype&&b!=Object.prototype&&(b[d]=a.value)};$jscomp.getGlobal=function(b){return"undefined"!=typeof window&&window===b?b:"undefined"!=typeof global&&null!=global?global:b};$jscomp.global=$jscomp.getGlobal(this);$jscomp.SYMBOL_PREFIX="jscomp_symbol_";$jscomp.initSymbol=function(){$jscomp.initSymbol=function(){};$jscomp.global.Symbol||($jscomp.global.Symbol=$jscomp.Symbol)};

$jscomp.Symbol=function(){var b=0;return function(d){return $jscomp.SYMBOL_PREFIX+(d||"")+b++}}();$jscomp.initSymbolIterator=function(){$jscomp.initSymbol();var b=$jscomp.global.Symbol.iterator;b||(b=$jscomp.global.Symbol.iterator=$jscomp.global.Symbol("iterator"));"function"!=typeof Array.prototype[b]&&$jscomp.defineProperty(Array.prototype,b,{configurable:!0,writable:!0,value:function(){return $jscomp.iteratorPrototype($jscomp.arrayIteratorImpl(this))}});$jscomp.initSymbolIterator=function(){}};

$jscomp.initSymbolAsyncIterator=function(){$jscomp.initSymbol();var b=$jscomp.global.Symbol.asyncIterator;b||(b=$jscomp.global.Symbol.asyncIterator=$jscomp.global.Symbol("asyncIterator"));$jscomp.initSymbolAsyncIterator=function(){}};$jscomp.iteratorPrototype=function(b){$jscomp.initSymbolIterator();b={next:b};b[$jscomp.global.Symbol.iterator]=function(){return this};return b};

$jscomp.iteratorFromArray=function(b,d){$jscomp.initSymbolIterator();b instanceof String&&(b+="");var a=0,c={next:function(){if(a<b.length){var e=a++;return{value:d(e,b[e]),done:!1}}c.next=function(){return{done:!0,value:void 0}};return c.next()}};c[Symbol.iterator]=function(){return c};return c};

$jscomp.polyfill=function(b,d,a,c){if(d){a=$jscomp.global;b=b.split(".");for(c=0;c<b.length-1;c++){var e=b[c];e in a||(a[e]={});a=a[e]}b=b[b.length-1];c=a[b];d=d(c);d!=c&&null!=d&&$jscomp.defineProperty(a,b,{configurable:!0,writable:!0,value:d})}};$jscomp.polyfill("Array.prototype.values",function(b){return b?b:function(){return $jscomp.iteratorFromArray(this,function(b,a){return a})}},"es8","es3");

$jscomp.findInternal=function(b,d,a){b instanceof String&&(b=String(b));for(var c=b.length,e=0;e<c;e++){var l=b[e];if(d.call(a,l,e,b))return{i:e,v:l}}return{i:-1,v:void 0}};$jscomp.polyfill("Array.prototype.find",function(b){return b?b:function(b,a){return $jscomp.findInternal(this,b,a).v}},"es6","es3");

(function(b){function d(a,c){this._initialized=!1;this.settings=null;this.popups=[];this.options=b.extend({},d.Defaults,c);this.$element=b(a);this.init();this.y=this.x=0;this._interval;this._callbackOpened=this._popupOpened=this._menuOpened=!1;this.countdown=null}d.Defaults={activated:!1,pluginVersion:"2.0.1",wordpressPluginVersion:!1,align:"right",mode:"regular",countdown:0,drag:!1,buttonText:"Contact us",buttonSize:"large",menuSize:"normal",buttonIcon:'<svg width="20" height="20" viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g transform="translate(-825 -308)"><g><path transform="translate(825 308)" fill="#FFFFFF" d="M 19 4L 17 4L 17 13L 4 13L 4 15C 4 15.55 4.45 16 5 16L 16 16L 20 20L 20 5C 20 4.45 19.55 4 19 4ZM 15 10L 15 1C 15 0.45 14.55 0 14 0L 1 0C 0.45 0 0 0.45 0 1L 0 15L 4 11L 14 11C 14.55 11 15 10.55 15 10Z"/></g></g></svg>',

ajaxUrl:"server.php",action:"callback",phonePlaceholder:"+X-XXX-XXX-XX-XX",callbackSubmitText:"Waiting for call",reCaptcha:!1,reCaptchaAction:"callbackRequest",reCaptchaKey:"",errorMessage:"Connection error. Please try again.",callProcessText:"We are calling you to phone",callSuccessText:"Thank you.<br>We are call you back soon.",showMenuHeader:!1,menuHeaderText:"How would you like to contact us?",showHeaderCloseBtn:!0,menuInAnimationClass:"show-messageners-block",menuOutAnimationClass:"",eaderCloseBtnBgColor:"#787878",

eaderCloseBtnColor:"#FFFFFF",items:[],itemsIconType:"rounded",iconsAnimationSpeed:800,iconsAnimationPause:2E3,promptPosition:"side",callbackFormFields:{name:{name:"name",enabled:!0,required:!0,type:"text",label:"Please enter your name",placeholder:"Your full name"},email:{name:"email",enabled:!0,required:!1,type:"email",label:"Enter your email address",placeholder:"Optional field. Example: email@domain.com"},time:{name:"time",enabled:!0,required:!1,type:"dropdown",label:"Please choose schedule time",

values:[{value:"asap",label:"Call me ASAP"},"00:00","01:00","02:00","03:00","04:00","05:00","06:00","07:00","08:00","09:00","10:00","11:00","12:00","13:00","14:00","15:00","16:00","17:00","18:00","19:00","20:00","21:00","22:00","23:00"]},phone:{name:"phone",enabled:!0,required:!0,type:"tel",label:"Please enter your phone number",placeholder:"+X-XXX-XXX-XX-XX"},description:{name:"description",enabled:!0,required:!1,type:"textarea",label:"Please leave a message with your request"}},theme:"#000000",

callbackFormText:"Please enter your phone number<br>and we call you back soon",closeIcon:'<svg width="12" height="13" viewBox="0 0 14 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g transform="translate(-4087 108)"><g><path transform="translate(4087 -108)" fill="currentColor" d="M 14 1.41L 12.59 0L 7 5.59L 1.41 0L 0 1.41L 5.59 7L 0 12.59L 1.41 14L 7 8.41L 12.59 14L 14 12.59L 8.41 7L 14 1.41Z"></path></g></g></svg>',callbackStateIcon:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M493.4 24.6l-104-24c-11.3-2.6-22.9 3.3-27.5 13.9l-48 112c-4.2 9.8-1.4 21.3 6.9 28l60.6 49.6c-36 76.7-98.9 140.5-177.2 177.2l-49.6-60.6c-6.8-8.3-18.2-11.1-28-6.9l-112 48C3.9 366.5-2 378.1.6 389.4l24 104C27.1 504.2 36.7 512 48 512c256.1 0 464-207.5 464-464 0-11.2-7.7-20.9-18.6-23.4z"></path></svg>'};

d.prototype.init=function(){if(this._initialized)return!1;this.destroy();this.settings=b.extend({},this.options);this.$element.addClass("arcontactus-widget").addClass("arcontactus-message");"left"===this.settings.align?this.$element.addClass("left"):this.$element.addClass("right");this.settings.items.length?(this.$element.append("\x3c!--noindex--\x3e"),this._initCallbackBlock(),"regular"==this.settings.mode&&this._initMessengersBlock(),this.popups.length&&this._initPopups(),this._initMessageButton(),

this._initPrompt(),this._initEvents(),this.startAnimation(),this.$element.append("\x3c!--/noindex--\x3e"),this.$element.addClass("active")):console.info("jquery.contactus:no items");this._initialized=!0;this.$element.trigger("arcontactus.init")};d.prototype.destroy=function(){if(!this._initialized)return!1;this.$element.html("");this._initialized=!1;this.$element.trigger("arcontactus.destroy")};d.prototype._initCallbackBlock=function(){var a=b("<div>",{class:"callback-countdown-block",style:this._colorStyle()}),

c=b("<div>",{class:"callback-countdown-block-close",style:"background-color:"+this.settings.theme+"; color: #FFFFFF"});c.append(this.settings.closeIcon);var e=b("<div>",{class:"callback-countdown-block-phone"});e.append("<p>"+this.settings.callbackFormText+"</p>");var d=b("<form>",{id:"arcu-callback-form",action:this.settings.ajaxUrl,method:"POST"}),h=b("<div>",{class:"callback-countdown-block-form-group"}),f=b("<input>",{name:"action",type:"hidden",value:this.settings.action}),g=b("<input>",{name:"gtoken",

class:"ar-g-token",type:"hidden",value:""});h.append(f);h.append(g);this._initCallbackFormFields(h);f=b("<div>",{class:"arcu-form-group arcu-form-button"});g=b("<button>",{id:"arcontactus-message-callback-phone-submit",type:"submit",style:this._backgroundStyle()});g.text(this.settings.callbackSubmitText);f.append(g);h.append(f);f=b("<div>",{class:"callback-countdown-block-timer"});g=b("<p>"+this.settings.callProcessText+"</p>");var k=b("<div>",{class:"callback-countdown-block-timer_timer"});f.append(g);

f.append(k);g=b("<div>",{class:"callback-countdown-block-sorry"});k=b("<p>"+this.settings.callSuccessText+"</p>");g.append(k);d.append(h);e.append(d);a.append(c);a.append(e);a.append(f);a.append(g);this.$element.append(a)};d.prototype._initCallbackFormFields=function(a){var c=this;b.each(c.settings.callbackFormFields,function(e){var d=b("<div>",{class:"arcu-form-group arcu-form-group-type-"+c.settings.callbackFormFields[e].type+" arcu-form-group-"+c.settings.callbackFormFields[e].name+(c.settings.callbackFormFields[e].required?

" arcu-form-group-required":"")}),h="<input>";switch(c.settings.callbackFormFields[e].type){case "textarea":h="<textarea>";break;case "dropdown":h="<select>"}if(c.settings.callbackFormFields[e].label){var f=b("<div>",{class:"arcu-form-label"});f.html(c.settings.callbackFormFields[e].label);d.append(f)}var g=b(h,{name:c.settings.callbackFormFields[e].name,class:"arcu-form-field arcu-field-"+c.settings.callbackFormFields[e].name,required:c.settings.callbackFormFields[e].required,type:"dropdown"==c.settings.callbackFormFields[e].type?

null:c.settings.callbackFormFields[e].type,value:""});g.attr("placeholder",c.settings.callbackFormFields[e].placeholder);"undefined"!=typeof c.settings.callbackFormFields[e].maxlength&&g.attr("maxlength",c.settings.callbackFormFields[e].maxlength);"dropdown"==c.settings.callbackFormFields[e].type&&b.each(c.settings.callbackFormFields[e].values,function(a){var d=c.settings.callbackFormFields[e].values[a],l=c.settings.callbackFormFields[e].values[a];"object"==typeof c.settings.callbackFormFields[e].values[a]&&

(d=c.settings.callbackFormFields[e].values[a].value,l=c.settings.callbackFormFields[e].values[a].label);a=b("<option>",{value:d});a.text(l);g.append(a)});d.append(g);a.append(d)})};d.prototype._initPopups=function(){var a=this,c=b("<div>",{class:"popups-block arcuAnimated"}),e=b("<div>",{class:"popups-list-container"});b.each(this.popups,function(){var c=b("<div>",{class:"arcu-popup",id:"arcu-popup-"+this.id}),d=b("<div>",{class:"arcu-popup-header",style:a.settings.theme?"background-color:"+a.settings.theme:

null}),f=b("<div>",{class:"arcu-popup-close",style:a.settings.theme?"background-color:"+a.settings.theme:null}),g=b("<div>",{class:"arcu-popup-back",style:a.settings.theme?"background-color:"+a.settings.theme:null});f.append(a.settings.closeIcon);g.append('<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 512"><path fill="currentColor" d="M231.293 473.899l19.799-19.799c4.686-4.686 4.686-12.284 0-16.971L70.393 256 251.092 74.87c4.686-4.686 4.686-12.284 0-16.971L231.293 38.1c-4.686-4.686-12.284-4.686-16.971 0L4.908 247.515c-4.686 4.686-4.686 12.284 0 16.971L214.322 473.9c4.687 4.686 12.285 4.686 16.971-.001z" class=""></path></svg>');

d.text(this.title);d.append(f);d.append(g);f=b("<div>",{class:"arcu-popup-content"});f.html(this.popupContent);c.append(d);c.append(f);e.append(c)});c.append(e);this.$element.append(c)};d.prototype._initMessengersBlock=function(){var a=b("<div>",{class:"messangers-block arcuAnimated"}),c=b("<div>",{class:"messangers-list-container"}),e=b("<ul>",{class:"messangers-list"});"normal"!==this.settings.menuSize&&"large"!==this.settings.menuSize||a.addClass("lg");"small"===this.settings.menuSize&&a.addClass("sm");

this._appendMessengerIcons(e);if(this.settings.showMenuHeader){var d=b("<div>",{class:"arcu-menu-header",style:this.settings.theme?"background-color:"+this.settings.theme:null});d.html(this.settings.menuHeaderText);if(this.settings.showHeaderCloseBtn){var h=b("<div>",{class:"arcu-header-close",style:"color:"+this.settings.headerCloseBtnColor+"; background:"+this.settings.headerCloseBtnBgColor});h.append(this.settings.closeIcon);d.append(h)}a.append(d);a.addClass("has-header")}"rounded"==this.settings.itemsIconType?

e.addClass("rounded-items"):e.addClass("not-rounded-items");c.append(e);a.append(c);this.$element.append(a)};d.prototype._appendMessengerIcons=function(a){var c=this;b.each(this.settings.items,function(e){e=b("<li>",{});if("callback"==this.href)var d=b("<div>",{class:"messanger call-back "+(this.class?this.class:"")});else if("_popup"==this.href)c.popups.push(this),d=b("<div>",{class:"messanger arcu-popup-link "+(this.class?this.class:""),"data-id":this.id?this.id:null});else if(d=b("<a>",{class:"messanger "+

(this.class?this.class:""),id:this.id?this.id:null,href:this.href}),this.onClick){var h=this;d.on("click",function(a){h.onClick(a)})}var f="rounded"==c.settings.itemsIconType?b("<span>",{style:this.color?"background-color:"+this.color:null}):b("<span>",{style:(this.color?"color:"+this.color:null)+"; background-color: transparent"});f.append(this.icon);d.append(f);f=b("<div>",{class:"arcu-item-label"});var g=b("<div>",{class:"arcu-item-title"});

g.text(this.title);f.append(g);"undefined"!=typeof this.subTitle&&this.subTitle&&(g=b("<div>",{class:"arcu-item-subtitle"}),g.text(this.subTitle),f.append(g));d.append(f);e.append(d);a.append(e)})};d.prototype._initMessageButton=function(){var a=this,c=b("<div>",{class:"arcontactus-message-button",style:this._backgroundStyle()});"large"===this.settings.buttonSize&&this.$element.addClass("lg");"huge"===this.settings.buttonSize&&this.$element.addClass("hg");"medium"===this.settings.buttonSize&&this.$element.addClass("md");

"small"===this.settings.buttonSize&&this.$element.addClass("sm");var e=b("<div>",{class:"static"});e.append(this.settings.buttonIcon);!1!==this.settings.buttonText?e.append("<p>"+this.settings.buttonText+"</p>"):c.addClass("no-text");var d=b("<div>",{class:"callback-state",style:a._colorStyle()});d.append(this.settings.callbackStateIcon);var h=b("<div>",{class:"icons hide"}),f=b("<div>",{class:"icons-line"});b.each(this.settings.items,function(c){c=b("<span>",{style:a._colorStyle()});c.append(this.icon);

f.append(c)});h.append(f);var g=b("<div>",{class:"arcontactus-close"});g.append(this.settings.closeIcon);var k=b("<div>",{class:"pulsation",style:a._backgroundStyle()}),m=b("<div>",{class:"pulsation",style:a._backgroundStyle()});c.append(e).append(d).append(h).append(g).append(k).append(m);this.$element.append(c)};d.prototype._initPrompt=function(){var a=b("<div>",{class:"arcontactus-prompt arcu-prompt-"+this.settings.promptPosition}),c=b("<div>",{class:"arcontactus-prompt-close",style:this._backgroundStyle()+

"; color: #FFFFFF"});c.append(this.settings.closeIcon);var e=b("<div>",{class:"arcontactus-prompt-inner"});a.append(c).append(e);this.$element.append(a)};d.prototype._initEvents=function(){var a=this.$element,c=this;a.find(".arcontactus-message-button").on("mousedown",function(a){c.x=a.pageX;c.y=a.pageY}).on("mouseup",function(a){if(c.settings.drag&&a.pageX===c.x&&a.pageY===c.y||!c.settings.drag)"regular"==c.settings.mode?c._menuOpened||c._popupOpened||c._callbackOpened?(c._menuOpened&&c.closeMenu(),

c._popupOpened&&c.closePopup()):c.openMenu():c.openCallbackPopup(),a.preventDefault()});this.settings.drag&&(a.draggable(),a.get(0).addEventListener("touchmove",function(c){var b=c.targetTouches[0];a.get(0).style.left=b.pageX-25+"px";a.get(0).style.top=b.pageY-25+"px";c.preventDefault()},!1));b(document).on("click",function(a){c.closeMenu();c.closePopup()});a.on("click",function(a){a.stopPropagation()});a.find(".call-back").on("click",function(){c.openCallbackPopup()});a.find(".arcu-popup-link").on("click",

function(){var a=b(this).data("id");c.openPopup(a)});a.find(".arcu-header-close").on("click",function(){c.closeMenu()});a.find(".arcu-popup-close").on("click",function(){c.closePopup()});a.find(".arcu-popup-back").on("click",function(){c.closePopup();c.openMenu()});a.find(".callback-countdown-block-close").on("click",function(){null!=c.countdown&&(clearInterval(c.countdown),c.countdown=null);c.closeCallbackPopup()});a.find(".arcontactus-prompt-close").on("click",function(){c.hidePrompt()});a.find("#arcu-callback-form").on("submit",

function(b){b.preventDefault();a.find(".callback-countdown-block-phone").addClass("ar-loading");c.settings.reCaptcha?grecaptcha.execute(c.settings.reCaptchaKey,{action:c.settings.reCaptchaAction}).then(function(b){a.find(".ar-g-token").val(b);c.sendCallbackRequest()}):c.sendCallbackRequest()});setTimeout(function(){c._processHash()},500);b(window).on("hashchange",function(a){c._processHash()})};d.prototype._processHash=function(){switch(window.location.hash){case "#callback-form":case "callback-form":this.openCallbackPopup();

break;case "#callback-form-close":case "callback-form-close":this.closeCallbackPopup();break;case "#contactus-menu":case "contactus-menu":this.openMenu();break;case "#contactus-menu-close":case "contactus-menu-close":this.closeMenu();break;case "#contactus-hide":case "contactus-hide":this.hide();break;case "#contactus-show":case "contactus-show":this.show()}};d.prototype._callBackCountDownMethod=function(){var a=this.settings.countdown,c=this.$element,b=this,d=60;c.find(".callback-countdown-block-phone, .callback-countdown-block-timer").toggleClass("display-flex");

this.countdown=setInterval(function(){--d;var e=a,f=d;10>a&&(e="0"+a);10>d&&(f="0"+d);e=e+":"+f;c.find(".callback-countdown-block-timer_timer").html(e);0===d&&0===a&&(clearInterval(b.countdown),b.countdown=null,c.find(".callback-countdown-block-sorry, .callback-countdown-block-timer").toggleClass("display-flex"));0===d&&(d=60,--a)},20)};d.prototype.sendCallbackRequest=function(){var a=this,c=a.$element;this.$element.trigger("arcontactus.beforeSendCallbackRequest");b.ajax({url:a.settings.ajaxUrl,type:"POST",

dataType:"json",data:c.find("form").serialize(),success:function(b){a.settings.countdown&&a._callBackCountDownMethod();c.find(".callback-countdown-block-phone").removeClass("ar-loading");if(b.success)a.settings.countdown||c.find(".callback-countdown-block-sorry, .callback-countdown-block-phone").toggleClass("display-flex");else if(b.errors){var d=b.errors.join("\n\r");alert(d)}else alert(a.settings.errorMessage);a.$element.trigger("arcontactus.successCallbackRequest",b)},error:function(){c.find(".callback-countdown-block-phone").removeClass("ar-loading");

alert(a.settings.errorMessage);a.$element.trigger("arcontactus.errorCallbackRequest")}})};d.prototype.show=function(){this.$element.addClass("active");this.$element.trigger("arcontactus.show")};d.prototype.hide=function(){this.$element.removeClass("active");this.$element.trigger("arcontactus.hide")};d.prototype.openPopup=function(a){this.closeMenu();var c=this.$element;c.find("#arcu-popup-"+a).addClass("show-messageners-block");c.find("#arcu-popup-"+a).hasClass("popup-opened")||(this.stopAnimation(),

c.addClass("popup-opened"),c.find("#arcu-popup-"+a).addClass(this.settings.menuInAnimationClass),c.find(".arcontactus-close").addClass("show-messageners-block"),c.find(".icons, .static").addClass("hide"),c.find(".pulsation").addClass("stop"),this._popupOpened=!0,this.$element.trigger("arcontactus.openPopup"))};d.prototype.closePopup=function(){var a=this.$element;a.find(".arcu-popup").hasClass("show-messageners-block")&&(setTimeout(function(){a.removeClass("popup-opened")},150),a.find(".arcu-popup").removeClass(this.settings.menuInAnimationClass).addClass(this.settings.menuOutAnimationClass),

setTimeout(function(){a.removeClass("popup-opened")},150),a.find(".arcontactus-close").removeClass("show-messageners-block"),a.find(".icons, .static").removeClass("hide"),a.find(".pulsation").removeClass("stop"),this.startAnimation(),this._popupOpened=!1,this.$element.trigger("arcontactus.closeMenu"))};d.prototype.openMenu=function(){if("callback"==this.settings.mode)return console.log("Widget in callback mode"),!1;var a=this.$element;a.find(".messangers-block").hasClass(this.settings.menuInAnimationClass)||

(this.stopAnimation(),a.addClass("open"),a.find(".messangers-block").addClass(this.settings.menuInAnimationClass),a.find(".arcontactus-close").addClass("show-messageners-block"),a.find(".icons, .static").addClass("hide"),a.find(".pulsation").addClass("stop"),this._menuOpened=!0,this.$element.trigger("arcontactus.openMenu"))};d.prototype.closeMenu=function(){if("callback"==this.settings.mode)return console.log("Widget in callback mode"),!1;var a=this.$element,c=this;a.find(".messangers-block").hasClass(this.settings.menuInAnimationClass)&&

(setTimeout(function(){a.removeClass("open")},150),a.find(".messangers-block").removeClass(this.settings.menuInAnimationClass).addClass(this.settings.menuOutAnimationClass),setTimeout(function(){a.find(".messangers-block").removeClass(c.settings.menuOutAnimationClass)},1E3),a.find(".arcontactus-close").removeClass("show-messageners-block"),a.find(".icons, .static").removeClass("hide"),a.find(".pulsation").removeClass("stop"),this.startAnimation(),this._menuOpened=!1,this.$element.trigger("arcontactus.closeMenu"))};

d.prototype.toggleMenu=function(){var a=this.$element;this.hidePrompt();if(a.find(".callback-countdown-block").hasClass("display-flex"))return!1;a.find(".messangers-block").hasClass(this.settings.menuInAnimationClass)?this.closeMenu():this.openMenu();this.$element.trigger("arcontactus.toggleMenu")};d.prototype.openCallbackPopup=function(){var a=this.$element;a.addClass("opened");this.closeMenu();this.stopAnimation();a.find(".icons, .static").addClass("hide");a.find(".pulsation").addClass("stop");

a.find(".callback-countdown-block").addClass("display-flex");a.find(".callback-countdown-block-phone").addClass("display-flex");a.find(".callback-state").addClass("display-flex");this._callbackOpened=!0;this.$element.trigger("arcontactus.openCallbackPopup")};d.prototype.closeCallbackPopup=function(){var a=this.$element;a.removeClass("opened");a.find(".messangers-block").removeClass(this.settings.menuInAnimationClass);a.find(".arcontactus-close").removeClass("show-messageners-block");a.find(".icons, .static").removeClass("hide");

a.find(".pulsation").removeClass("stop");a.find(".callback-countdown-block, .callback-countdown-block-phone, .callback-countdown-block-sorry, .callback-countdown-block-timer").removeClass("display-flex");a.find(".callback-state").removeClass("display-flex");this.startAnimation();this._callbackOpened=!1;this.$element.trigger("arcontactus.closeCallbackPopup")};d.prototype.startAnimation=function(){var a=this.$element,c=a.find(".icons-line"),b=a.find(".static"),d=a.find(".icons-line>span:first-child").width()+

40;if("huge"===this.settings.buttonSize)var h=2,f=0;"large"===this.settings.buttonSize&&(h=2,f=0);"medium"===this.settings.buttonSize&&(h=4,f=-2);"small"===this.settings.buttonSize&&(h=4,f=-2);var g=a.find(".icons-line>span").length,k=0;this.stopAnimation();if(0===this.settings.iconsAnimationSpeed)return!1;var m=this;this._interval=setInterval(function(){0===k&&(c.parent().removeClass("hide"),b.addClass("hide"));var a="translate("+-(d*k+h)+"px, "+f+"px)";c.css({"-webkit-transform":a,"-ms-transform":a,

transform:a});k++;if(k>g){if(k>g+1){if(m.settings.iconsAnimationPause)return m.stopAnimation(),setTimeout(function(){if(m._callbackOpened||m._menuOpened||m._popupOpened)return!1;m.startAnimation()},m.settings.iconsAnimationPause),!1;k=0}c.parent().addClass("hide");b.removeClass("hide");a="translate("+-h+"px, "+f+"px)";c.css({"-webkit-transform":a,"-ms-transform":a,transform:a})}},this.settings.iconsAnimationSpeed)};d.prototype.stopAnimation=function(){clearInterval(this._interval);var a=this.$element,

b=a.find(".icons-line");a=a.find(".static");b.parent().addClass("hide");a.removeClass("hide");b.css({"-webkit-transform":"translate(-2px, 0px)","-ms-transform":"translate(-2px, 0px)",transform:"translate(-2px, 0px)"})};d.prototype.showPrompt=function(a){var b=this.$element.find(".arcontactus-prompt");a&&a.content&&b.find(".arcontactus-prompt-inner").html(a.content);b.addClass("active");this.$element.trigger("arcontactus.showPrompt")};d.prototype.hidePrompt=function(){this.$element.find(".arcontactus-prompt").removeClass("active");

this.$element.trigger("arcontactus.hidePrompt")};d.prototype.showPromptTyping=function(){this.$element.find(".arcontactus-prompt").find(".arcontactus-prompt-inner").html("");this._insertPromptTyping();this.showPrompt({});this.$element.trigger("arcontactus.showPromptTyping")};d.prototype._insertPromptTyping=function(){var a=this.$element.find(".arcontactus-prompt-inner"),c=b("<div>",{class:"arcontactus-prompt-typing"}),d=b("<div>");c.append(d);c.append(d.clone());c.append(d.clone());a.append(c)};d.prototype.hidePromptTyping=

function(){this.$element.find(".arcontactus-prompt").removeClass("active");this.$element.trigger("arcontactus.hidePromptTyping")};d.prototype._backgroundStyle=function(){return"background-color: "+this.settings.theme};d.prototype._colorStyle=function(){return"color: "+this.settings.theme};b.fn.contactUs=function(a){var c=Array.prototype.slice.call(arguments,1);return this.each(function(){var e=b(this),l=e.data("ar.contactus");l||(l=new d(this,"object"==typeof a&&a),e.data("ar.contactus",l));"string"==

typeof a&&"_"!==a.charAt(0)&&l[a].apply(l,c)})};b.fn.contactUs.Constructor=d})(jQuery);

    //]]>

</script>

Bước 3: Thêm code JS hiển thị.

Các bạn copy toàn bộ code bên dưới dán trước thẻ đóng </body> trong chủ đề template

<div id='contact_us' />

<script>

  //<![CDATA[

  window.addEventListener('load', function() {

    $('#contact_us').on('arcontactus.init', function() {

      $('#contact_us').addClass('arcuAnimated').addClass('flipInY');

      setTimeout(function() {

        $('#contact_us').removeClass('flipInY');

      }, 1000);

    });

    $('#contact_us').contactUs({

      align: 'right',

      drag: false,

      reCaptcha: false,

      menuSize: 'small',

      buttonSize: 'small',

      buttonText: 'Liên hệ',

      iconsAnimationSpeed: 800,

      menuHeaderText: 'Liên hệ với chúng tôi!',

      itemsIconType: 'rounded',

      countdown: 0,

      showMenuHeader: true,

      showHeaderCloseBtn: true,

      headerCloseBtnColor: '#ffffff',

      headerCloseBtnBgColor: '#d08a00',

      promptPosition: 'side',

      theme: '#d08a00',

      items: [{

        title: 'Hotline',

        subTitle: '1900 6750',

        icon: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M493.4 24.6l-104-24c-11.3-2.6-22.9 3.3-27.5 13.9l-48 112c-4.2 9.8-1.4 21.3 6.9 28l60.6 49.6c-36 76.7-98.9 140.5-177.2 177.2l-49.6-60.6c-6.8-8.3-18.2-11.1-28-6.9l-112 48C3.9 366.5-2 378.1.6 389.4l24 104C27.1 504.2 36.7 512 48 512c256.1 0 464-207.5 464-464 0-11.2-7.7-20.9-18.6-23.4z"></path></svg>',

        href: 'tel:19006750',

        color: '#4EB625'

      }, {

        title: 'Email',

        subTitle: 'minhruoutv@gmail.com',

        icon: '<svg  xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M464 64H48C21.5 64 0 85.5 0 112v288c0 26.5 21.5 48 48 48h416c26.5 0 48-21.5 48-48V112c0-26.5-21.5-48-48-48zM48 96h416c8.8 0 16 7.2 16 16v41.4c-21.9 18.5-53.2 44-150.6 121.3-16.9 13.4-50.2 45.7-73.4 45.3-23.2.4-56.6-31.9-73.4-45.3C85.2 197.4 53.9 171.9 32 153.4V112c0-8.8 7.2-16 16-16zm416 320H48c-8.8 0-16-7.2-16-16V195c22.8 18.7 58.8 47.6 130.7 104.7 20.5 16.4 56.7 52.5 93.3 52.3 36.4.3 72.3-35.5 93.3-52.3 71.9-57.1 107.9-86 130.7-104.7v205c0 8.8-7.2 16-16 16z"></path></svg>',

        href: 'mailto:minhruoutv@gmail.com',

        color: '#FF643A'

      }, {

        title: 'Messenger',

        subTitle: 'm.me/sapowebvietnam',

        icon: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M224 32C15.9 32-77.5 278 84.6 400.6V480l75.7-42c142.2 39.8 285.4-59.9 285.4-198.7C445.8 124.8 346.5 32 224 32zm23.4 278.1L190 250.5 79.6 311.6l121.1-128.5 57.4 59.6 110.4-61.1-121.1 128.5z"></path></svg>',

        href: 'https://m.me/blogtrongminh/',

        color: '#31ADFF'

      }, {

        title: 'Zalo chat',

        subTitle: 'Tài khoản zalo: 0948 713 329',

        icon: '<svg id="svg_zalo_icon" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" viewBox="0 0 614.501 613.667" xml:space="preserve"><path fill="currentColor" d="M464.721,301.399c-13.984-0.014-23.707,11.478-23.944,28.312c-0.251,17.771,9.168,29.208,24.037,29.202   c14.287-0.007,23.799-11.095,24.01-27.995C489.028,313.536,479.127,301.399,464.721,301.399z"></path><path path fill="currentColor" d="M291.83,301.392c-14.473-0.316-24.578,11.603-24.604,29.024c-0.02,16.959,9.294,28.259,23.496,28.502   c15.072,0.251,24.592-10.87,24.539-28.707C315.214,313.318,305.769,301.696,291.83,301.392z"></path><path fill="currentColor" d="M310.518,3.158C143.102,3.158,7.375,138.884,7.375,306.3s135.727,303.142,303.143,303.142   c167.415,0,303.143-135.727,303.143-303.142S477.933,3.158,310.518,3.158z M217.858,391.083   c-33.364,0.818-66.828,1.353-100.133-0.343c-21.326-1.095-27.652-18.647-14.248-36.583c21.55-28.826,43.886-57.065,65.792-85.621   c2.546-3.305,6.214-5.996,7.15-12.705c-16.609,0-32.784,0.04-48.958-0.013c-19.195-0.066-28.278-5.805-28.14-17.652   c0.132-11.768,9.175-17.329,28.397-17.348c25.159-0.026,50.324-0.06,75.476,0.026c9.637,0.033,19.604,0.105,25.304,9.789   c6.22,10.561,0.284,19.512-5.646,27.454c-21.26,28.497-43.015,56.624-64.559,84.902c-2.599,3.41-5.119,6.88-9.453,12.725   c23.424,0,44.123-0.053,64.816,0.026c8.674,0.026,16.662,1.873,19.941,11.267C237.892,379.329,231.368,390.752,217.858,391.083z    M350.854,330.211c0,13.417-0.093,26.841,0.039,40.265c0.073,7.599-2.599,13.647-9.512,17.084   c-7.296,3.642-14.71,3.028-20.304-2.968c-3.997-4.281-6.214-3.213-10.488-0.422c-17.955,11.728-39.908,9.96-56.597-3.866   c-29.928-24.789-30.026-74.803-0.211-99.776c16.194-13.562,39.592-15.462,56.709-4.143c3.951,2.619,6.201,4.815,10.396-0.053   c5.39-6.267,13.055-6.761,20.271-3.357c7.454,3.509,9.935,10.165,9.776,18.265C350.67,304.222,350.86,317.217,350.854,330.211z    M395.617,369.579c-0.118,12.837-6.398,19.783-17.196,19.908c-10.779,0.132-17.593-6.966-17.646-19.512   c-0.179-43.352-0.185-86.696,0.007-130.041c0.059-12.256,7.302-19.921,17.896-19.222c11.425,0.752,16.992,7.448,16.992,18.833   c0,22.104,0,44.216,0,66.327C395.677,327.105,395.828,348.345,395.617,369.579z M463.981,391.868   c-34.399-0.336-59.037-26.444-58.786-62.289c0.251-35.66,25.304-60.713,60.383-60.396c34.631,0.304,59.374,26.306,58.998,61.986   C524.207,366.492,498.534,392.205,463.981,391.868z"></path></svg>',

        href: 'https://zalo.me/0948713329/',

        color: '#0165f8'

      }, {

        title: 'Google map cửa hàng',

        subTitle: 'Xem địa chỉ cửa hàng',

        icon: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="m199.03726,313.68853l11.18243,27.96403c-10.82963,4.32708 -21.63043,7.62457 -32.16787,9.82885l-6.15272,-29.48556c8.83106,-1.86142 17.9543,-4.65305 27.13816,-8.30732zm-89.68007,36.1173c11.03634,3.17723 22.66499,4.88461 34.55303,5.06052l0.47306,-30.13452c-9.24349,-0.15205 -18.21965,-1.44203 -26.69492,-3.88185l-8.33117,28.95586zm237.30565,-52.59777c8.68696,1.71235 17.16123,4.68485 25.19525,8.83205l13.84089,-26.78138c-10.59906,-5.44512 -21.75366,-9.35977 -33.20542,-11.59983l-5.83073,29.54917zm-62.86689,-24.7212l9.01193,28.7243c9.20672,-2.88505 18.30711,-4.70771 27.07257,-5.41332l-2.40703,-30.02222c-11.0105,0.88549 -22.342,3.15338 -33.67748,6.71125zm-48.382,22.66301c-3.38295,2.11981 -6.71125,4.05776 -9.97892,5.88539l14.6588,26.31727c3.67812,-2.06913 7.44468,-4.23962 11.21026,-6.59596c5.18176,-3.20904 10.24625,-6.06626 15.21832,-8.5995l-13.68784,-26.83704c-5.64786,2.88505 -11.47859,6.15173 -17.42062,9.82985zm83.2938,-187.80461c0,12.30246 -2.94965,23.95795 -8.18607,34.20222l-67.16117,131.55555c0,0 -67.69286,-132.64875 -67.95722,-133.20429c-4.74051,-9.83084 -7.38605,-20.89799 -7.38605,-32.55347c0,-41.61609 33.72717,-75.34525 75.34327,-75.34525c41.61311,0 75.34724,33.72916 75.34724,75.34525zm-30.1385,0c0,-24.95872 -20.25101,-45.20874 -45.20874,-45.20874c-24.95872,0 -45.20874,20.25002 -45.20874,45.20874c0,24.95574 20.25002,45.20576 45.20874,45.20576c24.95773,0 45.20874,-20.25002 45.20874,-45.20576zm105.48176,75.34525l-70.69121,0l-15.3992,30.13949l64.36954,0l32.52366,97.59781l-10.38936,11.47958c11.06715,9.99979 16.80445,19.21645 16.83626,19.24825l3.17723,-1.91111l28.16776,84.54999l-398.59919,0l30.19912,-90.49997c1.05941,0.73642 1.8813,1.44203 3.05897,2.17447l16.01338,-25.48743c-3.59166,-2.26789 -6.53534,-4.50398 -9.12622,-6.591l30.20012,-90.56159l64.39438,0c-6.38726,-12.48135 -11.41995,-22.33803 -15.39224,-30.13949l-70.725,0l-90.4155,271.2445l482.21101,0l-90.41351,-271.24351z"></path></svg>',

        href: 'https://www.google.com/maps/place/Web+b%C3%A1n+h%C3%A0ng+Sapo+HCM/@10.771207,106.6504991,17z/data=!3m1!4b1!4m5!3m4!1s0x31752f7470f16b57:0xb4326f9608376b97!8m2!3d10.7712017!4d106.6526878',

        color: '#d94234'

      }, ]

    });

  });

  //]]>

</script>

Chúc bạn thành công !

Comments

Call
0948713329
Contact Me on Zalo