Google Forms dan Zapier Webhook

Beberapa hari yang lepas ada satu soalan salah seorang rakan di group Facebook: Kedai Kopi WordPress iaitu post di seperti di bawah ini.

Umarul Fitri

Oleh itu, video kali ini saya akan ajar sedikit bagaimana anda boleh paparkan maklumat yang telah di isi dalam borang ke WordPress page.

Sebelum itu, terdapat beberapa isu sini:

  1. Jenis Borang
  2. Jenis Maklumat
  3. Cara nak embed (automation) proses ini

Untuk ini, saya telah pilih Google Forms sebagai platform untuk bina borang . Tujuan saya pilih ini adalah disebabkan ianya percuma dan tak teknikal sangat. Tak faham macam ner nak guna Google Forms dengan mudah? Sila rujuk tutorial saya di sini >> https://bloggerkickstart.com/tutorial-mudah-google-form/

Tapi kali ini anda akan belajar lebih detail sebab saya memilih cara yang lebih teknikal iaitu mengunakan Webook Zapier. Saya akan terangkan kenapa saya pilih cara ini yer dalam video tutorial bawah ini.

Apa itu Zapier

Zapier adalah web tool freemium untuk proses automasi melalui task/kerja yang dinamakan Zap. Freemium ini bermaksud ianya ada plan percuma dan pelan bebayar. Yang percuma adalah agak terhad tetapi untuk tutorial ini adalah memadai. Dengan Zapier anda boleh membina Zaps yang boleh automasikan bahagian perniagaan atau bahkan umum digunakan dalam kehidupan kita seharian sebagai contoh menerima notfikasi dalam bentuk SMS untuk event penting dan tugas ini boleh dilakukan berulang kali.

Kenapa Mengunakan Webhook Zapier

Ini ada di terangkan dalam video tetapi secara umumnya adalah disebabkan kita nak result yang INSTANT berbanding default iaitu 15 minit. Boleh rujuk yang ni

zaps frequency and billing

Selain itu, kita memerlukan tool untuk “filter” maklumat dari Google Forms. Ini disebabkan embed direct boleh je ke WordPress Page tapi masalahnya ianya akan embed semua maklumat termasuk maklumat sensitif. Oleh itu dengan menggunkan Webhook dari Zapier ini membenarkan kita untuk memaparkan maklumat yang berkenaan sahaja di WordPress Page nanti.

Oleh disebabkan ini.. saya kan ajar langkah demi langkah supaya anda boleh cuba nanti sendiri yer.

Objektif  Tutorial:

Untuk memaparkan maklumat yang telah “filter” dari borang iaitu Google Forms ke WordPress page.

Untuk tutorial kali ini anda perlukan:

  1. Google Account
  2. 1 Google Forms + 1 Google Spreadsheet Response + 1 Google Spreadsheet untuk emebed.
  3. Zapier Account (percuma)
  4. Chrome Add On Trigger and Send untuk Google Forms
  5. Page untuk memaparkan maklumat ini.

Untuk memahami ni.. sila fahami proses ini melalui slide di bawah ini

Klik Untuk  Download Slide
Proses adalah seperti berikut:

  1. Pelawat akan memasukan maklumat termasuk maklumat sensitif dalam borang mengunakan Google Forms
  2. Maklumat ini akan “syndicate” secara automatik ke dalam Google Spreadsheet Response
  3. Bina Zaps dan Webhook URL di Zapier
  4. Install Add On Trigger & Send untuk Google Spreadsheet Response
  5. Setkan Webhook URL di menggunakan Event Trigger >> Form Submition dengan Trigger & Send
  6. Set Zap semula supaya run automate sekiranya Webhook URL ini trigger dan tapis maklumat ke Google Sheet yang baru
  7. Run untuk pastikan semua bejalan lancar dan selepas itu pilih Publish di Web dan embed maklumat (pilih sheet yang berkenaan) dan anda akan dapat iframe code
  8. Tampal code itu di WordPress Page. gunakan bahagian TEXT.

Sekiranya agak mengelirukan, anda boleh tonton video ini di mana saya telah terangkan dengan lebih jelas. video ini agak panjang (21 minit).. so enjoy yer.. 🙂

 

 

Kesimpulan

Objektif tersebut berjaya dicapai tetapi beberapa isu seperti lag kemaskini di WordPress.

Menggunakan Webhook untuk dapatkan Instant Result boleh tetapi dalam kes ini masih terdapat “lag” untuk maklumat itu di kemaskini dalam WordPress page tetapi masih lebih laju daripada normal Zap. Selain itu, teknik ini adalah terhad iaitu 100 kali sahaja sebulan disebabkan menguna akaun percuma Zapier. Sekiranya perlu lebih banyak, mungkin anda boleh pertimbangkan dapat premium akaun iaitu bermula $20 sebulan.

 


Links

Borang >>  https://docs.google.com/forms/d/e/1FAIpQLSfcLHMVoU1DjHgF5QJQixKXoV4lmB5gPcf8HxqrMZ9hAW4POw/viewform

WordPress Page : https://bloggerkickstart.com/cara-nak-paparkan-maklumat-pendaftaran-melalui-google-form/

Tutorial Mudah Google Forms : https://bloggerkickstart.com/tutorial-mudah-google-form/

Google Forms: http://docs.google.com/forms

Google Drive: https://drive.google.com

Sekiranya anda post ini berguna, kongsikan dengan rakan anda yer. : )  Selamat mencuba.

Sila tinggalkan komen anda mengenai tutorial ini.

 

 

Leave a Reply

Your email address will not be published. Required fields are marked *

*