“Hướng dẫn tạo nút liên hệ đa kênh cho Website WordPress”. Trên thực tế, việc cung cấp cho khách hàng một cách tiếp cận nhanh chóng và thuận tiện để liên hệ với bạn là rất quan trọng để xây dựng ý tưởng và tạo ra tương tác tích cực trên trang web của bạn.
Trong bài viết này, chúng tôi sẽ hướng dẫn bạn cách tạo một nút liên hệ đẹp và hiệu quả trên trang web WordPress của bạn. Chúng tôi sẽ chia sẻ với bạn mã code mà bạn có thể chèn vào trang web để tạo một nút liên hệ đa kênh. Bằng cách nhấp vào nút liên hệ này, khách hàng của bạn sẽ có thể trực tiếp liên hệ với bạn thông qua các ứng dụng như Messenger, Zalo, SMS, Email và số điện thoại.
Đừng chờ đợi nữa, hãy cùng chúng tôi khám phá cách tạo nút liên hệ đa kênh siêu đẹp cho trang web WordPress của bạn. Bằng cách cung cấp tiện ích tiếp theo nhanh chóng và thuận tiện, bạn sẽ tạo điều kiện thuận lợi cho khách hàng liên hệ với bạn, cung cấp sự tương tác và tăng khả năng chuyển đổi trên trang web của bạn.
Video hướng dẫn tạo nút liên hệ đa kênh cho Website WordPress
Nếu bạn không chèn được, có thể inbox mình qua Facebook cá nhân hoặc Fanpage mình chèn cho, phí là 50k nha :D
Đoạn code nút liên hệ đa kênh
<style>
.arcontactus-widget.right.arcontactus-message{right:20px}
.arcontactus-widget.right.arcontactus-message{bottom:20px}
.arcontactus-widget .arcontactus-message-button
.pulsation{-webkit-animation-duration:2s;animation-duration:2s}
.arcontactus-widget.md .arcontactus-message-button,.arcontactus-widget.md.arcontactus-message{width:60px;height:60px}
.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.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)}
@-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}}
@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>
<div id='arcontactus'></div>
<script>//<![CDATA[
function arCuGetCookie(t){return document.cookie.length>0&&(c_start=document.cookie.indexOf(t+"="),-1!=c_start)?(c_start=c_start+t.length+1,c_end=document.cookie.indexOf(";",c_start),-1==c_end&&(c_end=document.cookie.length),unescape(document.cookie.substring(c_start,c_end))):0}function arCuCreateCookie(t,e,s){var n;if(s){var i=new Date;i.setTime(i.getTime()+24*s*60*60*1e3),n="; expires="+i.toGMTString()}else n="";document.cookie=t+"="+e+n+"; path=/"}function arCuShowMessage(t){if(arCuPromptClosed)return!1;void 0!==arCuMessages[t]?(jQuery("#arcontactus").contactUs("showPromptTyping"),_arCuTimeOut=setTimeout(function(){if(arCuPromptClosed)return!1;jQuery("#arcontactus").contactUs("showPrompt",{content:arCuMessages[t]}),t++,_arCuTimeOut=setTimeout(function(){if(arCuPromptClosed)return!1;arCuShowMessage(t)},arCuMessageTime)},arCuTypingTime)):(arCuCloseLastMessage&&jQuery("#arcontactus").contactUs("hidePrompt"),arCuLoop&&arCuShowMessage(0))}function arCuShowMessages(){setTimeout(function(){clearTimeout(_arCuTimeOut),arCuShowMessage(0)},arCuDelayFirst)}!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",countdown:0,drag:!1,buttonText:"Liên hệ",buttonSize:"large",menuSize:"normal",items:[],iconsAnimationSpeed:1200,theme:"#f35704",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 id="Canvas" transform="translate(-825 -308)"><g id="Vector"><use xlink:href="#path0_fill0123" transform="translate(825 308)" fill="#FFFFFF"/></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"/></defs></svg>',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>'},e.prototype.init=function(){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._initCallbackBlock(),this._initMessengersBlock(),this._initMessageButton(),this._initPrompt(),this._initEvents(),this.startAnimation(),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(){},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 if(n=t("<a>",{class:"messanger "+(this.class?this.class:""),id:this.id?this.id:null,href:this.href,target:this.target?this.target:"_blank"}),this.onClick){var i=this;n.on("click",function(t){i.onClick(t)})}var a=t("<span>",{style:this.color?"background-color:"+this.color:null});a.append(this.icon),n.append(a),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"),"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 i=t("<div>",{class:"callback-state",style:e._colorStyle()});i.append(this.settings.callbackStateIcon);var a=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)}),a.append(o);var r=t("<div>",{class:"arcontactus-close"});r.append(this.settings.closeIcon);var c=t("<div>",{class:"pulsation",style:e._backgroundStyle()}),l=t("<div>",{class:"pulsation",style:e._backgroundStyle()});s.append(n).append(i).append(a).append(r).append(c).append(l),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&&(s.toggleMenu(),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.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(){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(){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"),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"),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("large"===this.settings.buttonSize)var i=2,a=0;"medium"===this.settings.buttonSize&&(i=4,a=-2),"small"===this.settings.buttonSize&&(i=4,a=-2);var o=t.find(".icons-line>span").length,r=0;if(this.stopAnimation(),0===this.settings.iconsAnimationSpeed)return!1;this._interval=setInterval(function(){0===r&&(e.parent().removeClass("hide"),s.addClass("hide"));var t="translate("+-(n*r+i)+"px, "+a+"px)";e.css({"-webkit-transform":t,"-ms-transform":t,transform:t}),++r>o&&(r>o+1&&(r=0),e.parent().addClass("hide"),s.removeClass("hide"),t="translate("+-i+"px, "+a+"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 i=t(this),a=i.data("ar.contactus");a||(a=new e(this,"object"==typeof s&&s),i.data("ar.contactus",a)),"string"==typeof s&&"_"!==s.charAt(0)&&a[s].apply(a,n)})},t.fn.contactUs.Constructor=e}(jQuery);
//]]></script>
<script>//<![CDATA[
var arCuMessages = ["Xin chào"];
var arCuLoop = false;
var arCuCloseLastMessage = false;
var arCuPromptClosed = false;
var _arCuTimeOut = null;
var arCuDelayFirst = 2000;
var arCuTypingTime = 2000;
var arCuMessageTime = 4000;
var arCuClosedCookie = 0;
var arcItems = [];
window.addEventListener('load', function() {
arCuClosedCookie = arCuGetCookie('arcu-closed');
jQuery('#arcontactus').on('arcontactus.init', function() {
if (arCuClosedCookie) {
return false;
}
arCuShowMessages();
});
jQuery('#arcontactus').on('arcontactus.openMenu', function() {
clearTimeout(_arCuTimeOut);
arCuPromptClosed = true;
jQuery('#contact').contactUs('hidePrompt');
arCuCreateCookie('arcu-closed', 1, 30);
});
jQuery('#arcontactus').on('arcontactus.hidePrompt', function() {
clearTimeout(_arCuTimeOut);
arCuPromptClosed = true;
arCuCreateCookie('arcu-closed', 1, 30);
});
var arcItem = {};
arcItem.id = 'msg-item-1';
arcItem.class = 'msg-item-facebook-messenger';
arcItem.title = 'Messenger';
arcItem.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>';
arcItem.href = 'https://www.facebook.com/congvietblog/';
arcItem.color = '#567AFF';
arcItems.push(arcItem);
var arcItem = {};
arcItem.id = 'msg-item-2';
arcItem.class = 'msg-item-zalo';
arcItem.title = 'Zalo Shop';
arcItem.icon = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 460.1 436.6"><path fill="currentColor" class="st0" d="M82.6 380.9c-1.8-.8-3.1-1.7-1-3.5 1.3-1 2.7-1.9 4.1-2.8 13.1-8.5 25.4-17.8 33.5-31.5 6.8-11.4 5.7-18.1-2.8-26.5C69 269.2 48.2 212.5 58.6 145.5 64.5 107.7 81.8 75 107 46.6c15.2-17.2 33.3-31.1 53.1-42.7 1.2-.7 2.9-.9 3.1-2.7-.4-1-1.1-.7-1.7-.7-33.7 0-67.4-.7-101 .2C28.3 1.7.5 26.6.6 62.3c.2 104.3 0 208.6 0 313 0 32.4 24.7 59.5 57 60.7 27.3 1.1 54.6.2 82 .1 2 .1 4 .2 6 .2H290c36 0 72 .2 108 0 33.4 0 60.5-27 60.5-60.3v-.6-58.5c0-1.4.5-2.9-.4-4.4-1.8.1-2.5 1.6-3.5 2.6-19.4 19.5-42.3 35.2-67.4 46.3-61.5 27.1-124.1 29-187.6 7.2-5.5-2-11.5-2.2-17.2-.8-8.4 2.1-16.7 4.6-25 7.1-24.4 7.6-49.3 11-74.8 6zm72.5-168.5c1.7-2.2 2.6-3.5 3.6-4.8 13.1-16.6 26.2-33.2 39.3-49.9 3.8-4.8 7.6-9.7 10-15.5 2.8-6.6-.2-12.8-7-15.2-3-.9-6.2-1.3-9.4-1.1-17.8-.1-35.7-.1-53.5 0-2.5 0-5 .3-7.4.9-5.6 1.4-9 7.1-7.6 12.8 1 3.8 4 6.8 7.8 7.7 2.4.6 4.9.9 7.4.8 10.8.1 21.7 0 32.5.1 1.2 0 2.7-.8 3.6 1-.9 1.2-1.8 2.4-2.7 3.5-15.5 19.6-30.9 39.3-46.4 58.9-3.8 4.9-5.8 10.3-3 16.3s8.5 7.1 14.3 7.5c4.6.3 9.3.1 14 .1 16.2 0 32.3.1 48.5-.1 8.6-.1 13.2-5.3 12.3-13.3-.7-6.3-5-9.6-13-9.7-14.1-.1-28.2 0-43.3 0zm116-52.6c-12.5-10.9-26.3-11.6-39.8-3.6-16.4 9.6-22.4 25.3-20.4 43.5 1.9 17 9.3 30.9 27.1 36.6 11.1 3.6 21.4 2.3 30.5-5.1 2.4-1.9 3.1-1.5 4.8.6 3.3 4.2 9 5.8 14 3.9 5-1.5 8.3-6.1 8.3-11.3.1-20 .2-40 0-60-.1-8-7.6-13.1-15.4-11.5-4.3.9-6.7 3.8-9.1 6.9zm69.3 37.1c-.4 25 20.3 43.9 46.3 41.3 23.9-2.4 39.4-20.3 38.6-45.6-.8-25-19.4-42.1-44.9-41.3-23.9.7-40.8 19.9-40 45.6zm-8.8-19.9c0-15.7.1-31.3 0-47 0-8-5.1-13-12.7-12.9-7.4.1-12.3 5.1-12.4 12.8-.1 4.7 0 9.3 0 14v79.5c0 6.2 3.8 11.6 8.8 12.9 6.9 1.9 14-2.2 15.8-9.1.3-1.2.5-2.4.4-3.7.2-15.5.1-31 .1-46.5z"></path></svg>';
arcItem.href = 'https://zalo.me/0985358618';
arcItem.color = '#2EA8FF';
arcItems.push(arcItem);
var arcItem = {};
arcItem.id = 'msg-item-6';
arcItem.class = 'msg-item-sms';
arcItem.title = 'SMS';
arcItem.icon = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M128 216c-13.3 0-24 10.7-24 24s10.7 24 24 24 24-10.7 24-24-10.7-24-24-24zm128 0c-13.3 0-24 10.7-24 24s10.7 24 24 24 24-10.7 24-24-10.7-24-24-24zm128 0c-13.3 0-24 10.7-24 24s10.7 24 24 24 24-10.7 24-24-10.7-24-24-24zM256 32C114.6 32 0 125.1 0 240c0 47.6 19.9 91.2 52.9 126.3C38 405.7 7 439.1 6.5 439.5c-6.6 7-8.4 17.2-4.6 26S14.4 480 24 480c61.5 0 110-25.7 139.1-46.3C192 442.8 223.2 448 256 448c141.4 0 256-93.1 256-208S397.4 32 256 32zm0 384c-28.3 0-56.3-4.3-83.2-12.8l-15.2-4.8-13 9.2c-23 16.3-58.5 35.3-102.6 39.6 12-15.1 29.8-40.4 40.8-69.6l7.1-18.7-13.7-14.6C47.3 313.7 32 277.6 32 240c0-97 100.5-176 224-176s224 79 224 176-100.5 176-224 176z"></path></svg>';
arcItem.href = 'sms:0985358618';
arcItem.color = '#1C9CC5';
arcItems.push(arcItem);
var arcItem = {};
arcItem.id = 'msg-item-7';
arcItem.class = 'msg-item-envelope';
arcItem.title = 'Gửi Email';
arcItem.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>';
arcItem.href = 'mailto:congvietblog@gmail.com';
arcItem.color = '#FF643A';
arcItems.push(arcItem);
var arcItem = {};
arcItem.id = 'msg-item-8';
arcItem.class = 'msg-item-phone';
arcItem.title = 'Gọi Ngay';
arcItem.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>';
arcItem.href = 'tel:0985358618';
arcItem.color = '#4EB625';
arcItems.push(arcItem);
jQuery('#arcontactus').contactUs({
items: arcItems
});
});
//]]></script>
Kết luận
Trong hành trình tối ưu hóa trang web của bạn, việc tạo nút liên hệ đa kênh siêu đẹp cho trang web WordPress không chỉ là một bước quan trọng mà còn là chìa khóa mở cánh cửa cho sự thành công kinh doanh. Đừng chờ đợi nữa, hãy bắt tay vào thực hiện ngay để khám phá những cơ hội mà nút liên hệ chất lượng mang lại.
Bằng cách cung cấp tiện ích tiếp theo nhanh chóng và thuận tiện, bạn không chỉ tạo điều kiện thuận lợi cho khách hàng liên hệ với bạn mà còn xây dựng một giao diện tương tác mượt mà, giúp tăng cường trải nghiệm người dùng. Điều này không chỉ giúp tối ưu hóa tỷ lệ chuyển đổi trên trang web của bạn mà còn tạo ra một cầu nối vững chắc giữa doanh nghiệp và khách hàng.
Tóm lại, việc tạo nút liên hệ đa kênh không chỉ là một cách để thể hiện tính chuyên nghiệp của trang web mà còn là chiến lược tối ưu hóa SEO quan trọng. Hãy đưa ra bước quyết định ngay hôm nay và trải nghiệm sự thay đổi tích cực trong cách khách hàng tương tác với trang web của bạn.
- Ẩn thông báo cập nhật WordPress khỏi tất cả người dùng ngoại trừ quản trị viên
- Hướng dẫn mua Hosting tại Hostinger giá rẻ từ A-Z
- 10 mẫu CV xin việc file Word – Download ngay
- Hướng dẫn lấy mã xác thực 2 yếu tố – 2FA trên Facebook
- Hướng dẫn hủy lời mời kết bạn Facebook mà bạn đã gửi
Nếu bạn thích bài viết này, vui lòng đăng ký Kênh YouTube của CongVietBlog để xem các video hướng dẫn về WordPress. Bạn cũng có thể tìm thấy CongVietBlog trên Facebook.