Whatsapp saat ini merupakan sarana yang sanget efektif digunakan untuk komunikasi. Banyak sekali orang di indonesia bahkan di dunia menggunakan whaatsapp sebagai alat komunikasi. Sehingga Penggunaan Whatsaap saat ini mulai di gunakan untuk para pelaku toko online untuk menjaring calon pembeli.
Pada awalnya , kebanyakan website menggunakan chat melayang sebagai sarana komunikasi, akan tetapi, saat ini tidak sedikit website yang sudah beralih, atau bahkan menambahkan fiture chat ke whatsapp sebagai alternatif chat yang ada sebelumnya. Karena support menggunakan Whatsapp di anggap lebih cepat dan simple di banding dengan chat yang ada sebelumnya.
Bagaimana Cara Membuat Tombol WhatsApp Melayang pada Website
Kali ini kami akan berbagi tips untuk membuat Tombol WhatsApp Melayang pada Website dengan cara yang simple. Bagi anda pengguna wordpress tidak perlu pakai plugin. Hanya tinggal kopikan kode dibawah ini pada bagian footer.php.
<style>
@import url(https://fonts.googleapis.com/css?family=Roboto);.whatsapp{font-family:Roboto,Arial,Sans-serif;font-size:14px;font-weight:400;right:5%;position:fixed;bottom:0;z-index: 999;}a{color:#fff;text-decoration:none;transition:ease-in-out .2s}a:hover{box-shadow:0 1px 4px rgba(0,0,0,.12),0 1px 3px rgba(0,0,0,.24);color:#fff}.icons{background:#25d366;border-radius:10px 10px 0 0;display:block;height:42px;margin-bottom:20px;width:220px}.icons:hover{background:#128c7e}.icons span{display:block;left:5px;top:5px;transform:translate(0,10px)}svg{border-radius:10px;display:block;fill:#fff;float:left;height:42px;margin-right:5px;-webkit-transition:ease-in-out .175s;transition:ease-in-out .175s;width:42px}
</style>
<div class="whatsapp">
<a class="icons" target="_blank" href="https://api.whatsapp.com/send?phone=NomorTelephon&text=Caption"><svg viewBox="0 0 800 800"><path d="M519 454c4 2 7 10-1 31-6 16-33 29-49 29-96 0-189-113-189-167 0-26 9-39 18-48 8-9 14-10 18-10h12c4 0 9 0 13 10l19 44c5 11-9 25-15 31-3 3-6 7-2 13 25 39 41 51 81 71 6 3 10 1 13-2l19-24c5-6 9-4 13-2zM401 200c-110 0-199 90-199 199 0 68 35 113 35 113l-20 74 76-20s42 32 108 32c110 0 199-89 199-199 0-111-89-199-199-199zm0-40c133 0 239 108 239 239 0 132-108 239-239 239-67 0-114-29-114-29l-127 33 34-124s-32-49-32-119c0-131 108-239 239-239z"/></svg><span>Order Via WhatsApp</span></a>
<div>
Dari kode diatas, silahkan rekan rekan mengganti NomorTelephon dengan nomor Whatsapp tujuan. Sedangkan Caption adalah text atau kata kata default, ketika buyer akan menghubungi nomor whatsapp yang di isikan.
Tampilan di atas akan seperti ini
Selamat Mencoba Ya…!