Ahmad Dawami
Langkah Pertama
Silahkan buat dulu contact form di Google Forms, silahkan masuk ke https://docs.google.com/forms/ lalu buat form baru dengan memilih form Contact Information.
Buat form ini hanya berisi Nama, Email, Alamat, Kode Pos, Telp/HandPhone, ID Barang, Jumlah dana, Komentar dan pastikan semuanya required. Sehingga menjadi seperti di bawah ini.
Kemudian silahkan catat ID FORM yang tertera di address bar browser Anda yang biasanya tampak seperti berikut.
Kemudian klik Responses dan klik ikon Create Spreadsheet. Pilih Create a new spreadsheet lalu click Create. Kemudian biarkan halaman baru untuk spreadsheet responses terbuka, Anda bisa merubah title spreadsheet-nya. Pada Responses inilah pesan yang dikirim melalui form akan masuk.
Kemudian klik ikon gear (setting) di pojok kanan atas lalu hilangkan centang pada Limit to 1 response lalu Save.
Kemudian klik ikon 3 titik vertical (more) di pojok kanan atas lalu pilih Get pre-filled link. Setelah terbuka halamannya, silahkan klik kanan dan View Page Source.
Silahkan cari dan catat kode-kode berikut:
1. Cari aria-label="Name" kemudian catat code berikut id="i.desc.1273213442" dan name="entry.1737440414"
2. Cari aria-label="email" kemudian catat code berikut id="i.desc.1349265833" dan name="entry.25388406"
3. Cari aria-label="Alamat" kemudian catat code berikut id="i.desc.1332511248" dan name="entry.1063412485"
4. Cari aria-label="Kode Pos" kemudian catat code berikut id="i.desc.1853541783" dan name="entry.22422082"
5. Cari aria-label="No HandPhone" kemudian catat code berikut id="i.desc.1594148033" dan name="entry.1085393874"
6. Cari aria-label="ID BARANG" kemudian catat code berikut id="i.desc.6180708" dan name="entry.955621245"
7. Cari aria-label="Jumlah Dana" kemudian catat code berikut id="i.desc.887990004" dan name="entry.2891405"
8. Cari aria-label="Komentar" kemudian catat code berikut id="i.desc.186491945" dan name="entry.1213061265"
9. Cari name="draftResponse" kemudian catat code berikut value="[,,"5551902092149518xxx"]" dan
10. Cari name="fbzx" kemudian catat code berikut value="555190209214951xxxx"
Langkah Kedua
Silahkan simpan kode HTML di bawah ini untuk menampilkan Contact Form di blog Anda. Anda bisa menggunakan halaman static untuk menyimpan Contact Form ini (pada postingan HTML).
Kustomisasi:
1. Silahkan ganti http://success.goomsite.net/ dengan URL halaman thanks blog Anda sendiri.
2. Silahkan ganti 1-4lcPqtCKo014Um6VTNKVNZf5drjFQ99dBpJ8PVhi9w dengan ini dengan yang Anda dapatkan tadi di Langkah Pertama.
3. Silahkan ganti kode yang seperti entry.2891405xxx dan yang lainnya sesuai dengan aria-label dengan kode-kode yang Anda cari dan catat tadi pada Langkah Pertama. Begitu pun untuk value untuk kode name="draftResponse" dan name="fbzx" silahkan diganti juga dengan kode-kode yang Anda cari dan catat tadi pada Langkah Pertama.
Langkah Ketiga
Maka semua user yang telah mengisi form, akan langsung masuk dalam database penjual serta email penjual. Contoh database penjual
Jika masih kurang mengerti, silahkan hubung saya di WA: 081241105658, Facebook: https://www.fb/bmatindas atau lewat email: basrym@gmail.com (tanpa dikenakan biaya)
Silahkan buat dulu contact form di Google Forms, silahkan masuk ke https://docs.google.com/forms/ lalu buat form baru dengan memilih form Contact Information.
Buat form ini hanya berisi Nama, Email, Alamat, Kode Pos, Telp/HandPhone, ID Barang, Jumlah dana, Komentar dan pastikan semuanya required. Sehingga menjadi seperti di bawah ini.
Kemudian silahkan catat ID FORM yang tertera di address bar browser Anda yang biasanya tampak seperti berikut.
https://docs.google.com/forms/d/1-4lcPqtCKo014Um6VTNKVNZf5drjFQ99dBpJ8PVhi9w/editKemudian klik Responses dan klik ikon Create Spreadsheet. Pilih Create a new spreadsheet lalu click Create. Kemudian biarkan halaman baru untuk spreadsheet responses terbuka, Anda bisa merubah title spreadsheet-nya. Pada Responses inilah pesan yang dikirim melalui form akan masuk.
Kemudian klik ikon gear (setting) di pojok kanan atas lalu hilangkan centang pada Limit to 1 response lalu Save.
Kemudian klik ikon 3 titik vertical (more) di pojok kanan atas lalu pilih Get pre-filled link. Setelah terbuka halamannya, silahkan klik kanan dan View Page Source.
Silahkan cari dan catat kode-kode berikut:
1. Cari aria-label="Name" kemudian catat code berikut id="i.desc.1273213442" dan name="entry.1737440414"
2. Cari aria-label="email" kemudian catat code berikut id="i.desc.1349265833" dan name="entry.25388406"
3. Cari aria-label="Alamat" kemudian catat code berikut id="i.desc.1332511248" dan name="entry.1063412485"
4. Cari aria-label="Kode Pos" kemudian catat code berikut id="i.desc.1853541783" dan name="entry.22422082"
5. Cari aria-label="No HandPhone" kemudian catat code berikut id="i.desc.1594148033" dan name="entry.1085393874"
6. Cari aria-label="ID BARANG" kemudian catat code berikut id="i.desc.6180708" dan name="entry.955621245"
7. Cari aria-label="Jumlah Dana" kemudian catat code berikut id="i.desc.887990004" dan name="entry.2891405"
8. Cari aria-label="Komentar" kemudian catat code berikut id="i.desc.186491945" dan name="entry.1213061265"
9. Cari name="draftResponse" kemudian catat code berikut value="[,,"5551902092149518xxx"]" dan
10. Cari name="fbzx" kemudian catat code berikut value="555190209214951xxxx"
Langkah Kedua
Silahkan simpan kode HTML di bawah ini untuk menampilkan Contact Form di blog Anda. Anda bisa menggunakan halaman static untuk menyimpan Contact Form ini (pada postingan HTML).
<span style="font-size: large;">Silahkan isi form di bawah ini. Kami akan mengirimkan detail informasi pembayaran ke alamat email</span> <span style="font-size: large;">anda.
</span><iframe id="iframe_uexxnchh" name="iframe_uexxnchh" onload="if(typeof sent_uexxnchh!='undefined'){window.location='http://success.goomsite.net/';}"></iframe>
<br />
<form action="https://docs.google.com/forms/d/1-4lcPqtCKo014Um6VTNKVNZf5drjFQ99dBpJ8PVhi9w/formResponse" id="ss-form" method="POST" onsubmit="sent_uexxnchh=true" target="iframe_uexxnchh">
<div class="styled-input">
<div class="styled-input-in">
<label>Name Lengkap <span style="color: red;">*</span></label>
<input aria-label="Name" dir="auto" id="i.desc.1273213442" name="entry.1737440414" required="required" title="" type="text" value="" />
<span class="span1"></span><span class="span2"></span>
</div>
</div>
<div class="styled-input">
<div class="styled-input-in">
<label>Email <span style="color: red;">*</span></label>
<input aria-label="email" dir="auto" id="i.desc.1349265833" name="entry.25388406" required="required" title="Masukkan alamat email anda dengan benar" type="Email" value="" />
<span class="span1"></span><span class="span2"></span>
</div>
</div>
<div class="styled-input">
<div class="styled-input-in">
<label>Alamat <span style="color: red;">*</span></label>
<input aria-label="Alamat" dir="auto" id="i.desc.1332511248" name="entry.1063412485" required="required" title="Masukkan alamat anda dengan benar" type="Alamat" value="" />
<span class="span1"></span><span class="span2"></span>
</div>
</div>
<div class="styled-input">
<div class="styled-input-in">
<label>Kode Pos <span style="color: red;">*</span></label>
<input aria-label="Kode Pos" dir="auto" id="i.desc.1853541783" name="entry.22422082" required="required" title="Masukkan kode pos tempat tinggal anda" type="Kode Pos" value="" />
<span class="span1"></span><span class="span2"></span>
</div>
</div>
<div class="styled-input">
<div class="styled-input-in">
<label>Telp/HandPhone <span style="color: red;">*</span></label>
<input aria-label="No HandPhone" dir="auto" id="i.desc.1594148033" name="entry.1085393874" required="required" title="Masukkan nomor handphone anda dengan benar" type="No HandPhone" value="" />
<span class="span1"></span><span class="span2"></span>
</div>
</div>
<div class="styled-input">
<div class="styled-input-in">
<label>ID BARANG <span style="color: red;">*</span></label>
<input aria-label="ID BARANG" dir="auto" id="i.desc.6180708" name="entry.955621245" required="required" title="Masukkan ID BARANG dengan benar" type="ID BARANG" value="" />
<span class="span1"></span><span class="span2"></span>
</div>
</div>
<div class="styled-input">
<div class="styled-input-in">
<label>Jumlah Dana <span style="color: red;">*</span></label>
<input aria-label="Jumlah Dana" dir="auto" id="i.desc.887990004" name="entry.2891405" required="required" title="Masukkan jumlah dana yang telah ditransfer" type="Jumlah Dana" value="" />
<span class="span1"></span><span class="span2"></span>
</div>
</div>
<div class="styled-input wide">
<div class="styled-input-in">
<label>Komentar</label>
<textarea aria-label="Komentar" aria-required="true" cols="0" dir="auto" id="i.desc.186491945" name="entry.1213061265" required="required" rows="8"></textarea>
<span class="span1"></span><span class="span2"></span>
</div>
</div>
<input name="draftResponse" type="hidden" value="[,,"5551902092149518152"]" />
<input name="pageHistory" type="hidden" value="0" />
<input name="fbzx" type="hidden" value="5551902092149518152" />
<button class="btn btn-default" name="submit" type="submit">Kirim</button>
</form>
Kustomisasi:
1. Silahkan ganti http://success.goomsite.net/ dengan URL halaman thanks blog Anda sendiri.
2. Silahkan ganti 1-4lcPqtCKo014Um6VTNKVNZf5drjFQ99dBpJ8PVhi9w dengan ini dengan yang Anda dapatkan tadi di Langkah Pertama.
3. Silahkan ganti kode yang seperti entry.2891405xxx dan yang lainnya sesuai dengan aria-label dengan kode-kode yang Anda cari dan catat tadi pada Langkah Pertama. Begitu pun untuk value untuk kode name="draftResponse" dan name="fbzx" silahkan diganti juga dengan kode-kode yang Anda cari dan catat tadi pada Langkah Pertama.
Langkah Ketiga
CSS Style
#ss-form .styled-input{width:45%;margin:1rem 0 1rem;padding:0;position:relative}
#ss-form .styled-input-in{position:relative}
#ss-form .styled-input.wide{width:100%}
#ss-form .styled-input label{font-weight:700;font-size:16px}
#ss-form input,#ss-form textarea{padding:.8rem 1rem;border:1px solid #ddd;width:100%;font-size:1rem;background:#fafafa;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
#ss-form input~.span1,#ss-form textarea~.span1{display:block;width:0;height:2px;background:#e43636;position:absolute;left:50%;-webkit-transition:width .4s ease-in-out;transition:width .4s ease-in-out}
#ss-form input~.span2,#ss-form textarea~.span2{display:block;width:0;height:2px;background:#e43636;position:absolute;right:50%;-webkit-transition:width .4s ease-in-out;transition:width .4s ease-in-out}
#ss-form input~span{bottom:0}
#ss-form input:focus,#ss-form textarea:focus{outline:0}
#ss-form input:focus~.span1,#ss-form textarea:focus~.span1,#ss-form input:focus~.span2,#ss-form textarea:focus~.span2{width:50%}
#ss-form textarea{width:100%;min-height:10em}
#ss-form .btn{text-transform:uppercase;font-size:14px;font-weight:800;letter-spacing:1px;border-radius:0;padding:0 25px;height:51px;line-height:51px;color:#333;background-color:#fafafa;border:1px solid #ddd;cursor:pointer;margin:10px 0 0;background-image:none}
#ss-form .btn-default:hover,#ss-form .btn-default:focus{background-color:#e43636;border:1px solid #d93312;color:white;outline:0}
#iframe_uexxnchh{display:none}
Jika masih kurang mengerti, silahkan hubung saya di WA: 081241105658, Facebook: https://www.fb/bmatindas atau lewat email: basrym@gmail.com (tanpa dikenakan biaya)
