Copy đoạn code dưới đây chèn vào file functions.php của web hoặc tách code ra cho vào đâu tùy thích:
/* Code liên lạc */
add_action('wp_footer','custom_contact');
function custom_contact(){
?>
<div class="support-btns">
<div>
<a aria-label="Gọi hỗ trợ bằng số điện thoại" href="tel:0987127039" class="t-btn-support-contact t-btn-icon t-btn-icon--default" style="width:60px;height:60px;">
<svg fill="none" height="32" viewBox="0 0 24 24" width="32" xmlns="http://www.w3.org/2000/svg" class="text-white">
<path d="M21.1365 12H18.1365C17.7387 12 17.3571 12.158 17.0758 12.4393C16.7945 12.7207 16.6365 13.1022 16.6365 13.5V17.25C16.6365 17.6478 16.7945 18.0294 17.0758 18.3107C17.3571 18.592 17.7387 18.75 18.1365 18.75H19.6365C20.0343 18.75 20.4158 18.592 20.6971 18.3107C20.9784 18.0294 21.1365 17.6478 21.1365 17.25V12ZM21.1365 12C21.1365 10.8124 20.9014 9.63647 20.4449 8.5401C19.9883 7.44373 19.3192 6.44856 18.4763 5.61196C17.6333 4.77536 16.6331 4.11388 15.5333 3.66564C14.4335 3.21739 13.2558 2.99125 12.0682 3.00026C10.8806 2.99125 9.70299 3.21739 8.60319 3.66564C7.50339 4.11388 6.50318 4.77536 5.66021 5.61196C4.81725 6.44856 4.1482 7.44373 3.69163 8.5401C3.23506 9.63647 3 10.8124 3 12V17.25C3 17.6478 3.15804 18.0294 3.43934 18.3107C3.72064 18.592 4.10218 18.75 4.5 18.75H6C6.39782 18.75 6.77936 18.592 7.06066 18.3107C7.34196 18.0294 7.5 17.6478 7.5 17.25V13.5C7.5 13.1022 7.34196 12.7207 7.06066 12.4393C6.77936 12.158 6.39782 12 6 12H3" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"></path>
<path d="M21.1365 17.25V19.5C21.1365 20.2956 20.8204 21.0587 20.2578 21.6213C19.6952 22.1839 18.9321 22.5 18.1365 22.5H12.75" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"></path>
</svg>
</a>
<a href="tel:0987127039" class="sr-only"></a>
</div>
<a aria-label="Hỗ trợ bằng zalo" href="https://zalo.me/0987127039" rel="noopener" target="_blank" class="t-btn-support-zalo t-btn-icon t-btn-icon--default" style="width:60px;height:60px;">
<svg fill="none" height="15" viewBox="0 0 44 15" width="44" xmlns="http://www.w3.org/2000/svg">
<path clip-rule="evenodd" d="M22.8982 4.42198V3.62126H25.3673V14.8825H23.9546C23.3731 14.8825 22.9013 14.4261 22.8982 13.8621C22.8978 13.8625 22.8974 13.8625 22.8971 13.8628C21.9027 14.5693 20.6734 14.989 19.3457 14.989C16.0204 14.989 13.3242 12.371 13.3242 9.14205C13.3242 5.91311 16.0204 3.29542 19.3457 3.29542C20.6734 3.29542 21.9027 3.7148 22.8971 4.4213C22.8974 4.42164 22.8978 4.42164 22.8982 4.42198ZM12.6845 0V0.364901C12.6845 1.04605 12.5907 1.6018 12.1355 2.25416L12.0805 2.31515C11.981 2.42479 11.7476 2.68211 11.6365 2.82156L3.71075 12.4875H12.6845V13.856C12.6845 14.423 12.2109 14.8825 11.6273 14.8825H0V14.2373C0 13.4469 0.202058 13.0946 0.457364 12.7273L8.90678 2.56596H0.352279V0H12.6845ZM28.3618 14.8825C27.8763 14.8825 27.4813 14.4991 27.4813 14.028V0H30.1239V14.8825H28.3618ZM37.9379 3.22483C41.2861 3.22483 44 5.8624 44 9.11088C44 12.3624 41.2861 15 37.9379 15C34.5893 15 31.8758 12.3624 31.8758 9.11088C31.8758 5.8624 34.5893 3.22483 37.9379 3.22483ZM19.3457 12.5821C21.3025 12.5821 22.8883 11.0423 22.8883 9.14205C22.8883 7.24491 21.3025 5.70479 19.3457 5.70479C17.389 5.70479 15.8028 7.24491 15.8028 9.14205C15.8028 11.0423 17.389 12.5821 19.3457 12.5821ZM37.9379 12.5762C39.9063 12.5762 41.5037 11.0251 41.5037 9.11088C41.5037 7.19969 39.9063 5.6486 37.9379 5.6486C35.9663 5.6486 34.3717 7.19969 34.3717 9.11088C34.3717 11.0251 35.9663 12.5762 37.9379 12.5762Z" fill="white" fill-rule="evenodd"></path>
</svg>
</a>
<a aria-label="Hỗ trợ bằng telegram" href="https://t.me/lehuanpro" rel="noopener" target="_blank" class="t-btn-support-telegram t-btn-icon t-btn-icon--default" style="width:60px;height:60px;">
<svg fill="none" height="31" viewBox="0 0 36 31" width="36" xmlns="http://www.w3.org/2000/svg">
<path clip-rule="evenodd" d="M13.485 28.2498C12.4169 28.2498 12.5984 27.8465 12.23 26.8295L9.08899 16.4921L33.267 2.1485" fill="#C8DAEA" fill-rule="evenodd"></path>
<path clip-rule="evenodd" d="M13.485 28.2498C14.3092 28.2498 14.6734 27.8728 15.1335 27.4255L19.5295 23.151L14.046 19.8444" fill="#A9C9DD" fill-rule="evenodd"></path>
<path clip-rule="evenodd" d="M14.0456 19.8451L27.3325 29.6617C28.8487 30.4983 29.943 30.0651 30.3207 28.254L35.7291 2.76735C36.2829 0.547315 34.8829 -0.45959 33.4324 0.198932L1.67401 12.4448C-0.4938 13.3143 -0.481161 14.5238 1.27886 15.0626L9.42878 17.6064L28.2967 5.70281C29.1874 5.16268 30.0049 5.45307 29.3339 6.04856" fill="url(#paint0_linear_5631_250979)" fill-rule="evenodd"></path>
<defs>
<linearGradient id="paint0_linear_5631_250979" gradientUnits="userSpaceOnUse" x1="15.4023" x2="18.9251" y1="15.1637" y2="26.5589">
<stop stop-color="#EFF7FC"></stop>
<stop offset="1" stop-color="white"></stop>
</linearGradient>
</defs>
</svg>
</a>
<a aria-label="Hỗ trợ bằng facebook" href="https://www.facebook.com/lehuan0710" class="t-btn-support-facebook t-btn-icon t-btn-icon--blue" style="width:60px;height:60px;">
<svg fill="none" height="37" viewBox="0 0 38 37" width="38" xmlns="http://www.w3.org/2000/svg">
<path clip-rule="evenodd" d="M18.9995 0.866211C8.78357 0.866211 0.866211 8.31092 0.866211 18.3655C0.866211 23.625 3.03345 28.1695 6.5616 31.3093C6.85714 31.5743 7.03592 31.9409 7.05051 32.3365L7.14902 35.5453C7.18186 36.5689 8.24359 37.2331 9.18491 36.823L12.7824 35.244C13.0889 35.1097 13.4282 35.0843 13.7493 35.1714C15.4021 35.6251 17.1643 35.8647 18.9995 35.8647C29.2155 35.8647 37.1328 28.42 37.1328 18.3655C37.1328 8.31092 29.2155 0.866211 18.9995 0.866211Z" fill="white" fill-rule="evenodd"></path>
<path clip-rule="evenodd" d="M8.11101 23.6617L13.4384 15.2669C14.2849 13.933 16.1021 13.5995 17.3719 14.5455L21.6082 17.7027C21.9986 17.9927 22.5314 17.989 22.9182 17.6991L28.6396 13.3856C29.4022 12.8093 30.402 13.7191 29.8875 14.5238L24.5638 22.915C23.7173 24.2489 21.9001 24.5824 20.6303 23.6363L16.394 20.4792C16.0035 20.1892 15.4708 20.1929 15.084 20.4828L9.35892 24.7999C8.59631 25.3762 7.59651 24.4664 8.11101 23.6617Z" fill="#2339FF" fill-rule="evenodd"></path>
</svg>
</a>
</div>
<style>
@media all{
a{background-color:transparent;}
a:active,a:hover{outline-width:0;}
svg:not(:root){overflow:hidden;}
*,:after,:before{box-sizing:border-box;}
a{touch-action:manipulation;}
a{color:#334862;text-decoration:none;}
a:focus:not(:focus-visible){outline:none;}
a:hover{color:#000;}
}
/*! CSS Used from: Embedded */
a{color:#0a0a0a;}
a:hover{color:#0470db;}
a{transition:all .3s ease-in-out;}
a:active{color:#0fbe81;background-color:transparent;text-decoration:underline;}
a:hover{text-decoration:none;}
/*! CSS Used from: Embedded */
svg{vertical-align:middle;}
*,::before,::after{--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-transform:translateX(var(--tw-translate-x)) translateY(var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));--tw-border-opacity:1;border-color:rgba(236, 240, 244, var(--tw-border-opacity));--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-ring-inset:var(--tw-empty, );--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59, 130, 246, 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-blur:var(--tw-empty, );--tw-brightness:var(--tw-empty, );--tw-contrast:var(--tw-empty, );--tw-grayscale:var(--tw-empty, );--tw-hue-rotate:var(--tw-empty, );--tw-invert:var(--tw-empty, );--tw-saturate:var(--tw-empty, );--tw-sepia:var(--tw-empty, );--tw-drop-shadow:var(--tw-empty, );--tw-filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);--tw-backdrop-blur:var(--tw-empty, );--tw-backdrop-brightness:var(--tw-empty, );--tw-backdrop-contrast:var(--tw-empty, );--tw-backdrop-grayscale:var(--tw-empty, );--tw-backdrop-hue-rotate:var(--tw-empty, );--tw-backdrop-invert:var(--tw-empty, );--tw-backdrop-opacity:var(--tw-empty, );--tw-backdrop-saturate:var(--tw-empty, );--tw-backdrop-sepia:var(--tw-empty, );--tw-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0;}
.text-white{--tw-text-opacity:1;color:rgba(255, 255, 255, var(--tw-text-opacity));}
.t-btn-icon{align-items:center;border-radius:100px;cursor:pointer;display:flex;justify-content:center;transition:background-color .3s ease;}
.t-btn-icon.t-btn-icon--default{--tw-bg-opacity:1;background-color:rgba(248, 250, 252, var(--tw-bg-opacity));}
.t-btn-icon.t-btn-icon--default:hover{--tw-bg-opacity:1;background-color:rgba(236, 240, 244, var(--tw-bg-opacity));}
.t-btn-icon.t-btn-icon--blue{--tw-bg-opacity:1;background-color:rgba(0, 101, 238, var(--tw-bg-opacity));}
.t-btn-icon.t-btn-icon--blue:hover{--tw-bg-opacity:1;background-color:rgba(0, 59, 174, var(--tw-bg-opacity));}
.t-btn-icon.t-btn-icon--blue{--tw-text-opacity:1;color:rgba(255, 255, 255, var(--tw-text-opacity));}
.support-btns{position:fixed;right:1.5rem;bottom:1.5rem;z-index:50;display:flex;flex-direction:column;}
.support-btns> :not([hidden])~ :not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse));}
.t-btn-support-contact{--tw-shadow:0px 0px 12px rgba(0, 0, 0, 0.06);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);background:#ff7d1f!important;}
.t-btn-support-zalo{--tw-shadow:0px 0px 12px rgba(0, 0, 0, 0.06);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);background:#0068ff!important;}
.t-btn-support-telegram{--tw-shadow:0px 0px 12px rgba(0, 0, 0, 0.06);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);background:linear-gradient(203.2deg, #37aee2 21.67%, #1e96c8 70%);}
.t-btn-support-facebook{--tw-bg-opacity:1!important;background-color:rgba(35, 57, 255, var(--tw-bg-opacity))!important;}
</style>
<?php
}
Nguồn: codepen.io/truyenbeo