Memasang Tombol Whatsapp Melayang di Halaman Blog
Memasang Tombol Whatsapp Melayang di Halaman Blog - Kamu yang mempunyai bisnis online atau online shop di blog tentunya wajib memanfaatkan fitur chat dari whatsapp ini, sebab saat ini whatsapp merupakan salah satu aplikasi chat yang paling banyak digunakan banyak orang.
Dengan adanya tombol whatsapp ini tentunya akan memudahkan klien/pengunjung yang ingin bertanya langsung dengan anda pemilik blog tanpa harus menunggu lama (fast respon) sehingga customer anda akan merasa puas dengan pelayanan yang kamu berikan.
Untuk memasang tombol whatsapp di blog tidaklah sulit hanya perlu dua langkah, maka kamu sudah bisa melihat icon tombol whatsapp melayang fixed pada halaman blog.
Pertama letakan kode ini di atas </body> atau <body> silahkan sesuaikan.
<a class='fixed-whatsapp' href='https://api.whatsapp.com/send?phone=628xxxxxxxxxx' rel='nofollow noopener' target='_blank' title='Whatsapp' />Silahkan ganti tanda marking kuning dengan nomor telp anda.
Selanjutnya kita tambahkan CSS ini di atas]]></b:skin> dan perhatikan posisi yang saya tandai ini. Kode tersebut untuk mengatur posisi melayang whatsapp pada halaman blog antara KIRI-KANAN sesuaikan dengan selera anda.
/*Tombol Chat WhatsApp*/
.fixed-whatsapp{position:fixed;bottom:20px;right:20px;width:50px;height:50px;z-index:9999}.fixed-whatsapp:before{content:"";background-repeat:no-repeat;background-size:34px 34px;background-position:center center;width:50px;height:50px;background-image:url("data:image/svg+xml;charset=utf8,%3csvg viewBox='0 0 24 24' width='32' height='32' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3e%3cg%3e%3cpath style='fill:%23ffffff' d='M16.75,13.96C17,14.09 17.16,14.16 17.21,14.26C17.27,14.37 17.25,14.87 17,15.44C16.8,16 15.76,16.54 15.3,16.56C14.84,16.58 14.83,16.92 12.34,15.83C9.85,14.74 8.35,12.08 8.23,11.91C8.11,11.74 7.27,10.53 7.31,9.3C7.36,8.08 8,7.5 8.26,7.26C8.5,7 8.77,6.97 8.94,7H9.41C9.56,7 9.77,6.94 9.96,7.45L10.65,9.32C10.71,9.45 10.75,9.6 10.66,9.76L10.39,10.17L10,10.59C9.88,10.71 9.74,10.84 9.88,11.09C10,11.35 10.5,12.18 11.2,12.87C12.11,13.75 12.91,14.04 13.15,14.17C13.39,14.31 13.54,14.29 13.69,14.13L14.5,13.19C14.69,12.94 14.85,13 15.08,13.08L16.75,13.96M12,2A10,10 0 0,1 22,12A10,10 0 0,1 12,22C10.03,22 8.2,21.43 6.65,20.45L2,22L3.55,17.35C2.57,15.8 2,13.97 2,12A10,10 0 0,1 12,2M12,4A8,8 0 0,0 4,12C4,13.72 4.54,15.31 5.46,16.61L4.5,19.5L7.39,18.54C8.69,19.46 10.28,20 12,20A8,8 0 0,0 20,12A8,8 0 0,0 12,4Z'%3e%3c/path%3e%3c/g%3e%3c/svg%3e");background-color:#00C853;position:absolute;top:0;left:0;border-radius:100%;box-shadow:0 1px 1.5px 0 rgba(0,0,0,.12),0 1px 1px 0 rgba(0,0,0,.24)}Save Template.
Untuk lebih jelas tampilan whatsapp melayang tonton video di bawah ini
Itulah Cara Memasang Tombol Whatsapp Melayang di Halaman Blog, selamat mencoba!
Jejak Unik
Kumpulan Informasi Unik Menarik Dari Berbagai Belahan Dunia. www.jejakunik.com