Tombol Order WhatsApp Tampil Hanya di Handphone
7 Sep 2017 - - 1
Pertanyaanya:
Bagaimana cara mengatur supaya tombol order whatsapp hanya akan tampil jika dibuka melalui handphone atau smartphone saja, dan akan disembunyikan saat dibuka melalui laptop?
Untuk menjawab pertanyaan tersebut, kita bisa dengan memadukan tombol order whatsApp dengan kode css responsive, untuk masalah ini saya anggap template blog anda sudah responsive, dan hal ini bisa anda cek di dalam kode template blog anda akan ada kode seperti dibawah ini:
<head>
<meta content='width=device-width, initial-scale=1, maximum-scale=1' name='viewport'/>
Dibagian kode CSS nya juga akan ditemukan kode seperti ini:<meta content='width=device-width, initial-scale=1, maximum-scale=1' name='viewport'/>
@media only screen and (max-width:
Itu artinya blog anda sudah responsive dan anda bisa melanjutkan dengan mengikuti pembahasan ini, pertama silahkan tambahkan div id pada kode berikut:
<div id="orderwa">
<a href="https://api.whatsapp.com/send?phone=6285640335006&text=Saya%20Mau%20Order"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEim4o0wj4YRSMC2Lq3jNRfP6HezNP_TzdTmwAPlxNfBMZUcgcYhI7qEMul1vxMB3M0ibCjPXnE9EEq_bSZf29dDOiQTl5e_pR3WpbJlgq_61yMF_hWaj95trU8M3zRcqip-_7vl6U-k5wc/s1600/order+lewat+whatsapp.png"/></a>
</div>
Kemudian pada CSS template anda, silahkan anda tambahkan kode css berikut:
#orderwa{display:none;}
Sedangkan untuk css responsivenya silahkan anda tambahkan #orderwa {display:block;} sebagai contoh:
@media only screen and (max-width: 500px)
{ #orderwa {display:block;} }
{ #orderwa {display:block;} }
Untuk hasilnya, silahkan anda coba halaman ini dengan menggunakan handphone/ smartphone dan juga laptop anda, akan akan melihat tombol order whatsApp dibawah ini:
Demikian, selamat mencoba semoga berhasil.
Terimakasih, anda telah membaca postingan dengan judul "Tombol Order WhatsApp Tampil Hanya di Handphone", semoga postingan ini bermanfaat untuk anda, budayakan berkomentar setelah membaca ya. 😊
whoah this weblog is fantastic i like reading your articles.
BalasHapusStay up the good work! You understand, a lot of individuals are looking around
for this information, you can aid them greatly.