Membuat Tombol Chat Wa Dan Sms Pribadi Ke Admin Blog

Tombol chat Whatsapp atau WA dan SMS eksklusif ke admin blog ini berkhasiat untuk blog yang menjual produk atau barang menyerupai online shop.

Dengan tombol ini konsumen tidak perlu input nomor kontak admin untuk memesan barang baik dengan WA atau SMS. Chat WA atau SMS konsumen akan eksklusif masuk ke admin blog, sehingga lebih memudahkan konsumen dalam memesan barang.

Tentunya tombol ini dapat berjalan saat konsumen memakai hp untuk mengakses halaman.

Untuk demo silahkan lihat pada halaman ini (sekalian order juga boleh hehehe).

DEMO

Jika Anda memang sedang memerlukan tombol menyerupai ini, silahkan copy arahan di bawah ini.

Silahkan copy arahan di bawah ini dan simpan di atas </head>

 <b:if cond='data:blog.pageType == &quot;item&quot;'>
 <style type='text/css'>
 /*<![CDATA[*/
 .btn{padding:10px 16px;margin:0;font-size:16px;line-height:1.3333333;border-radius:6px;text-align:center;white-space:nowrap;vertical-align:middle;-ms-touch-action:manipulation;touch-action:manipulation;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border:1px solid transparent;font-weight:500;text-decoration:none;display:inline-block}
 .btn:active:focus,.btn:focus{outline:0}
 .btn:focus,.btn:hover{color:#333;text-decoration:none;outline:0}
 .btn:active{outline:0;-webkit-box-shadow:inset 0 3px 5px rgba(0,0,0,.125);box-shadow:inset 0 3px 5px rgba(0,0,0,.125)}
 .btn-lg{padding:10px 16px;font-size:18px;line-height:1.3333333;border-radius:6px}
 .btn-purple{background-color:#8E24AA;border-bottom:2px solid #6A1B9A;-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;color:#fff;}
 .btn-purple:active,.btn-purple:focus,.btn-purple:hover{background-color:#6A1B9A;color:#fff}
 #cara_belanja{margin-top:30px;background:#F3E5F5;padding:15px 15px 5px;border-radius:3px!important;}
 #carabelanja:target{display:block;margin-top:-80px;height:80px;visibility:hidden}
 #cara_belanja h4{font-size:16px;font-weight:600;color:#8E24AA;margin:0;line-height:1}
 #cara_belanja p{font-size:14px;font-weight:400;display:block;margin:10px 0;line-height:1.2}
 #cara_belanja a{margin-bottom:10px;margin-right:10px}
 #cara_belanja svg{width:24px;height:24px;vertical-align:-15%;}
 /*]]>*/
 </style>
 </b:if>

Kemudian simpan arahan HTML ini di edit HTML di bawah postingan.

 <b:if cond='data:blog.pageType == &quot;item&quot;'>
 <div id='cara_belanja'>
 <span id='carabelanja'/>
   <h4>Cara Belanja Di KIOSIANA</h4>
   <p>Silahkan pesan item ini dengan menghubungi Contact Toko yang tertera di sidebar kanan (untuk device mobile ada di bab bawah), harap disertakan Kode Item atau Nama Item saat order barang. Barang dikirimkan sehari sesudah transaksi selesai. Atau silahkan pesan eksklusif via tombol Whatapps dan SMS di bawah ini. Admin toko akan eksklusif merespond pesanan Anda.</p>
 <a class='btn btn-purple btn-lg' expr:href='&quot;https://api.whatsapp.com/send?phone=6281312815xxx&amp;text=Saya%20pesan%20&quot; + data:post.title'><svg viewBox='0 0 24 24'>
     <path 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' fill='#fff'/>
 </svg> Pesan Sekarang</a>
 <a class='btn btn-purple btn-lg' expr:href='&quot;sms://+6281312815xxx?body=Saya%20pesan%20&quot; + data:post.title'><svg viewBox='0 0 24 24'>
     <path d='M17.25,18H6.75V4H17.25M14,21H10V20H14M16,1H8A3,3 0 0,0 5,4V20A3,3 0 0,0 8,23H16A3,3 0 0,0 19,20V4A3,3 0 0,0 16,1Z' fill='#fff'/>
 </svg> SMS Sekarang</a>
   </div>
 </b:if>

Silahkan ganti arahan 6281312815xxx dan +6281312815xxx dengan nomor hp admin yang dipakai untuk WA dan SMS.

Dengan arahan di atas, maka pesan yang dikirim akan menyerupai berikut: "Saya pesan bla bla bla". bla bla bla yakni nama item atau nama produk yang dijadikan judul postingan.

Kalimat lainnya silahkan sesuaikan.

Selamat mencoba.
Sumber https://www.kompiajaib.com/

Share this post