Cara embed google forms responsive di blog – Hari ini saya kesulitan dalam memasang google formulir di salah satu halaman blog saya. Google formulir tersebut rencananya saya pakai untuk halaman request tutorial dengan maksud supaya memudahkan pengunjung apabila ingin request artikel tutorial secara langsung. Meskipun saya tidak yakin apakah ada yang menggunakannya atau tidak. Haha
Terinspirasi dari salah satu website yang saya kunjungi. Web tersebut menyediakan tombol request artikel. Sehingga saya mulai berpikir kayaknya bagus juga kalau saya menyediakan fasilitas serupa di blog saya. Mungkin saja bisa bermanfaat! Maka terpikirlah untuk menggunakan fasilitas google forms ini.
Namun setelah saya pasang di blog, ternyata layoutnya tidak responsif. Setelah saya buka lewat mobile hanya tampil setengah dari layout aslinya. Maka mulailah saya searching artikel di mbah google dan nemu artikelnya kompi ajaib yang modifikasi google form sebagai contact blog. Sebelumnya saya pernah mengikuti cara tersebut dan berhasil, jadi saya pikir hari ini juga akan berhasil. Namun sayang sekali langkah saya terhenti ketika mencari kode yang diperlukan untuk embed google forms tersebut.
Dalam tutorial tersebut kita disuruh untuk mencari kode aria-label="Name", aria-label="Email", comments dll setelah View Page Source. Namun setelah saya cari kode kode pertama yakni aria-label=”Name”, saya tidak menemukannya. Begitu juga untuk email dan comments, saya pikir mungkin saja google telah memperbarui google form atau letak kode tersebut nyelip entah dimana.
Terpaksa saya mencari lagi alternatif lain. Ada beberapa artikel mulai dari embed google map dll sudah saya coba cermati kodenya namun saya tidak paham. Akhirnya saya berlabuh di quora, disitu ada pertanyaan yang menanyakan hal yang sama dengan saya. Salah satu jawabannya saya praktekkan dan akhirnya berhasil juga.
Untuk membuat google forms menjadi responsive kita hanya perlu mengubah lebar layoutnya menjadi 100% seperti kode berikut.
<iframe src="YOURFORMHERE" width="100%" height="800" frameborder="0" marginheight="0" marginwidth="0">Loading...</iframe>
Perhatikan kode embed google form secara default adalah seperti ini.
<iframe src="https://docs.google.com/forms/d/e/1FAIpQLSd1Cg_c4CXG6si2Yi1071U3mYdHLFk2xkMaK4tSS8BVKcwKGA/viewform?embedded=true" width="760" height="500" frameborder="0" marginheight="0" marginwidth="0">Memuat...</iframe>
Silahkan ganti tulisan “YOURFORMHERE” dengan url google forms kamu, contohnya seperti yang saya tandai warna merah di atas. Apabila kamu bingung dimana cara mendapatkan kode embednya silahkan masuk di google form pilih formulir yang telah dibuat kemudian klik “Kirim”.
Setelah itu akan muncul popup silahkan klik pada simbol embed seperti gambar berikut.
Bagaimana mudahkan? Sekian artikel tentang cara embed google forms supaya responsive di blog, semoga ada manfaatnya.
