membuat Contact Form di Dreamweaver

Selasa, 23 September 2008

Bagikan kepada teman anda tentang artikel ini :
Pada Tutor ini saya akan memberikan informasi cara membuat Contact Form dengan Dreamweaver dan langkah pembuatan secara detail agar informasi yang dikirim user bisa masuk pada inbox Email anda. Ikuti dengan seksama agar tidak ada satu proses yang terlewat karena bisa menyebabkan kegagalan pada proses sending data ke Email anda.

Catatan: sebelum kita mulai sebaiknya anda mendownload PHP Form to Email Script dan unzip pada root directory website Anda. nama file nya FormToEmail.php.

1. buka Dreamweaver, pilih File > New New Document Dialog Box akan terbuka.
2.
pada daftar Blank Document , pilih HTML, lalu click Create to create a new HTML document.
3.
pada kotak judul di atas toolbar Document , ketik Contact Form sebagai judul dokument anda.

Dreamweaver Page Title

4. pilih File > Save, tempatkan file nya pada directory komputer anda. beri nama ContactForm.htm.
5. sekarang kita akan pergi utk memasuka Form pada halaman web , pilih Insert > Form . A Form dialog box akan terbuka. pada Action text box masukan FormtoEmail.php (file ini yang akan mengantarkan file pada directory web anda).rubah Method "to POST" lalu pada NAME masukan ContactForm pada text box.

Dreamweaver Contact Form

6. langkah selanjutnya tempatkan form objects pada halaman. pada kesempatan ini saya temptakan Name and Email Address, dan masukan juga Text Area utk Comments. setelah selesai pada bagian luar form objek lalu pada bagian atas menu pilih Insert >Form > Label. pada Code Window klik Diantara LABEL Tags dan type Name:. selanjutnya pada bagian top menu plilih lagi Insert > Form > Text Field. Name the Text field name pada properties box yang ada di bagian bawah.

Dreamweaver Text Field

ulangi langkah yang tadi dam masukan beberapa Label yang lain, Text Field dan name email.

7.
buat beberapa Label dan type pada Comments. setelah itu masukan Text Area, pergi ke Inset > Form > Text Area pada baian atas menu.beri Nama Text Area comments pada Properties box di bagian bawah dan beri Character Widthdengan nilai 50 dan Number Lines dengan nilai 10.

Dreamweaver Text Area

8. masukan button. pada top menu Insert > Form > Button. Form anda akan terlihat seperti ini :.

Adobe Dreamweaver Form

9. sekarang kita butuh mengedit FormtoEmail.php file. bauka file tsb di Dreamweaver. bagian yang pertama harus kita edit yaitu $my_email.

Dreamweaver Form to Mail

Rubah email address menjadi emil addrees anda. pada bagian lain akan berubah seperti ini :

Adobe Dreamweaver Form to Mail

ini adalah tempat dimana visitor akan menekan SUBMIT button.

10. Upload semua file pada web server anda dan selesai. anda telah berhasil mengerjakan Contact Form .


Selamat Mencoba
Terima kasih telah berkunjung ke Blog ini, Ada pertanyaan? Hubungi: silupi.021 @ gmail.com. Silakan tinggalkan komentar Anda di bawah ini. Terima kasih dan berharap Anda menikmati ...

0 komentar:

Posting Komentar