Cara Membuat Link Chat Whatsapp di Blog

Cara Membuat Link Chat Whatsapp Pada Blog – Pada kesempatan kali ini Admin Terkreatif akan memberikan tutorial baru mengenai cara membuat widget link chat wa pada sebuah blog. Biasanya widget chat whatsapp ini di gunakan pada sebuah website toko online atau mereka yang mempunyai web bisnis online. Tetapi tidak dipungkiri bisa juga dipasang pada blog biasa. Cara memasang api Whatsapp dalam website biasanya dilakukan agar memudahkan para visitor atau pengunjung untuk menghubungi admin secara langsung melalui aplikasi pesan instan Whatsapp. Memang ada banyak aplikasi pesan instan seperti line, telegram, WeChat, dan lain-lain. Akan tetapi menurut Saya, aplikasi Whatsapp cenderung lebih simple, mudah digunakan dan pengguna wa sangat banyak. 

Cara Membuat Link Chat Wa

Cara buat cukup mudah, Widget Whatsapp yang dihubungkan ke link WA tersebut apabila diklik maka akan menuju atau direct ke chat langsung ke nomor yang dituju. Berikut ini merupakan contoh link api whatsapp yang sudah saya pakai.

Url Chat Whatsapp
https://api.whatsapp.com/send?phone=6282266024747&text=Hallo%20Admin%20Terkreatif%0APerkenalkan%0ANama%20%3A%0AAlamat%20%3A%0AOrder%20%3A

Dan berikut ini adalah link defalut Whatsappnya:
https://api.whatsapp.com/send?phone=6282266024747

Disini kalian tinggal mengganti nomor handphone yang ada sesuai nomor milikmu. Dua angka terdepan (62) itu merupakan kode negara Indonesia jadi angka pertama 0 diganti dengan 62 yah guys. Setiap negara mempunyai kode nomor telepon yang berbeda-beda yang merupakan kode telepon internasional,artinya berlaku dalam skala internasional.

Cara membuat pesan otomatis pada link chat whatsapp

Agar memudahkan klien atau visitor yang ingin menghubungi melalui pesan WA, maka harus dibuat chat teks secara otomatis. Menggunakan default teks ketika akan mengirim pesan membuat isi pesan akan lebih tertata serta tujuan atau keperluan yang ingin ditanyakan sudah ada. Kalian bisa melihat contoh url link wa seperti yang di atas. Cara membuat format custom teks untuk memulai chatting bisa Kamu lihat tutorialnya dibawah ini. 

Dibagian ini merupakan chat defalut yang bisa Kalian ubah sesuai dengan kebutuhan anda.
Hallo%20Admin%20Terkreatif%0APerkenalkan%0ANama%20%3A%0AAlamat%20%3A%0AOrder%20%3A

Sehingga dari url diatas, pesan teks akan secara otomatis muncul seperti ini
Hallo Admin Terkreatif
Perkenalkan
Nama :
Alamat :
Order :

Di dalam url tersebut berisi kode-kode diantara satu kata dengan kata yang lainnya. Berikut ini penjelasannya.
kode %20 adalah untuk spasi antar kata
kode %0A adalah untuk enter atau baris baru
kode %3A adalah untuk tanda titik dua (:)
kode %3B adalah untuk tanda titik koma (;)

Nah silahkan kalian gunakan kode %20, %0A,atau %3A sesuai dengan format kebutuhan kalian. Untuk saran saja untuk membuat auto chat pada wa usahakan jangan gunakan teks yang terlalu panjang, lebih baik gunakan teks yang simpel dan memudahkan klien untuk menghubungi pihak admin melalui format teks yang sudah tersedia tersebut.

Apabila kalian ingin mengubah teks di whatsapp menjadi huruf tebal atau miring, kalian bisa menggunakan format berikut ini.
_tulisan_ untuk huruf miring
*tulisan* untuk huruf tebal

Sehingga penggunaan dalam membuat link WA akan seperti di bawah ini
https://api.whatsapp.com/send?phone=6282266024747&text=Hallo%20Admin%20Terkreatif%0APerkenalkan%0A*Nama*%20%3A%0A*Alamat*%20%3A%0A*Order*%20%3A

Cara membuat widget chat whatsapp di dalam blog

#1 Buat link chat whatsapp
#2 Buka dashbor blogger
#3 Pilih Theme dan klik Edit HTML
#4 Letakkan script dari widget WA dibawah ini tepat sebelum kode ]]></b:skin>

.float{
 position:fixed;
 width:60px;
 height:60px;
 bottom:80px;
 right:20px;
 background-color:#25d366;
 color:#FFF;
 border-radius:50px;
 text-align:center;
  font-size:30px;
 box-shadow: 2px 2px 3px #999;
  z-index:100;
}

.my-float{
 margin-top:16px;
}

#5 Save theme dan pilih menu Tata Letak lalu klik "tambahkan gadget / add a gadget"
#6 Pilih "HTML/Javascript" dan salin kode dibawah ini.

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
<a href="https://api.whatsapp.com/send?phone=6282266024747&text=Hallo%20Admin%20Terkreatif%0APerkenalkan%0ANama%20%3A%0AAlamat%20%3A%0AOrder%20%3A" class="float" target="_blank">
<i class="fa fa-whatsapp my-float"></i>
</a>

#7 Ganti nomor HP dengan punya kalian dan teks biarkan otomatis atau ganti teksnya sesuai dengan yang Kamu butuhkan.

Demo

Demikian tutorial kali ini mengenai cara membuat link chat whatsapp dengan memasang widget chat WA di blog. Apabila ada alternatif tutorial cara membuat widget wa lainnya akan Saya share lagi pada kalian semua. Dan terakhir jika kalian masih merasa bingung dengan cara-cara diatas bisa langsung berikan komentar dibawah. Terima Kasih