Cara membuat contact form dengan PHP yang terkirim ke email | Form kontak merupakan salah satu element penting yang ada hampir pada setiap website. Form contact us / hubungi kami memungkinkan pengunjung untuk berkomunikasi dengan pemilik situs website tersebut.
Dengan menggunakan form kontak, pengunjung dapat dengan mudah mengirim permintaan maupun penawaran mereka untuk melakukan bisnis, memberikan opini, pendangan dan saran kepada administrator mengenai konten website, layanan atau produk.

Contact Form (Image: youtube.com)
Selain itu informasi yang disampaikan dapat dikirim kepada pemilik website ataupun administrator melalui email.
Seperti sudah kita singgung sebelumnya, form kontak bisa membantu pemilik website untuk menerima penawaran maupun permintaan bisnis dari pengunjung dan dengan begitu bisa lansung memberikan respon terhadap kiriman tersebut.
Singkatnya, form kontak memungkinkan pengunjung untuk menghubungi pemilik website dengan mudah dan cepat.
Membuat contact form dengan PHP yang terkirim ke email
Pada tutorial kali ini Jurnalweb akan memberikan cara membuat form kontak dengan PHP dan mengintegrasikannya ke dalam website Anda, sehingga cukup dalam 5 menit Anda sudah bisa memiliki di dalam website Anda.
– Baca juga: Tutorial Cara Upload Multiple File dengan PHP
Untuk memudahkan Anda dalam memahami, kami akan memisahkan script HTML dan PHP. Anda dapat menambahkan kode ini secara bersamaan pada website yang Anda inginkan.
Membuat tampilan contact form dengan HTML
Pertama kita perlu untuk membuat tampilan form kontak ini dengan menggunakan HTML, dimana kita akan membuat kolom untuk menuliskan nama, email, subjek dan isi pesan, serta sebuah tombol Kirim yang akan menjadi pemicu terkirimnya pesan.
<div class="mainContent">
<h2>Kontak Form PHP / <small><a href="http://www.jurnalweb.com">Jurnalweb.com</a></small></h2>
<div class="contactFrm">
<?php if(!empty($statusMsg)){ ?>
<p class="statusMsg <?php echo !empty($msgClass)?$msgClass:''; ?>"><?php echo $statusMsg; ?></p>
<?php } ?>
<form action="" method="post">
<h4>Name</h4>
<input type="text" name="name" placeholder="Nama Anda" required="">
<h4>Email </h4>
<input type="email" name="email" placeholder="email@example.com" required="">
<h4>Subject</h4>
<input type="text" name="subject" placeholder="Tulis subject" required="">
<h4>Message</h4>
<textarea name="message" placeholder="Tulis pesan Anda disini" required=""> </textarea>
<input type="submit" name="submit" value="Submit">
<div class="clear"> </div>
</form>
</div>
</div>
Script PHP untuk menangani kiriman data
Setelah tampilan form dibuat, tentu kita butuh script untuk menangani kiriman data dari form tersebut, untuk itu kita membutuhkan PHP untuk melakukan proses pengiriman data ke email si pemilik website.
Email dikirim akan di validasi terlebih dahulu dengan menggunakan fungsi FILTER_VALIDATE_EMAIL, setelah email dianggap benar maka pesan akan dikirim ke email dengan menggunakan fungsi mail().
$statusMsg = '';
$msgClass = '';
if(isset($_POST['submit'])){
// Get the submitted form data
$email = $_POST['email'];
$name = $_POST['name'];
$subject = $_POST['subject'];
$message = $_POST['message'];
// Cek apakah ada data yang belum diisi
if(!empty($email) && !empty($name) && !empty($subject) && !empty($message)){
if(filter_var($email, FILTER_VALIDATE_EMAIL) === false){
$statusMsg = 'Please enter your valid email.';
$msgClassk = 'errordiv';
}else{
// Pengaturan penerima email dan subjek email
$toEmail = 'email@namadomain.com'; // Ganti dengan alamat email yang Anda inginkan
$emailSubject = 'Pesan website dari '.$name;
$htmlContent = '<h2> via Form Kontak Website</h2>
<h4>Name</h4><p>'.$name.'</p>
<h4>Email</h4><p>'.$email.'</p>
<h4>Subject</h4><p>'.$subject.'</p>
<h4>Message</h4><p>'.$message.'</p>';
// Mengatur Content-Type header untuk mengirim email dalam bentuk HTML
$headers = "MIME-Version: 1.0" . "\r\n";
$headers .= "Content-type:text/html;charset=UTF-8" . "\r\n";
// Header tambahan
$headers .= 'From: '.$name.'<'.$email.'>'. "\r\n";
// Send email
if(mail($toEmail,$emailSubject,$htmlContent,$headers)){
$statusMsg = 'Pesan Anda sudah terkirim dengan sukses !';
$msgClass = 'succdiv';
}else{
$statusMsg = 'Maaf pesan Anda gagal terkirim, silahkan ulangi lagi.';
$msgClass = 'errordiv';
}
}
}else{
$statusMsg = 'Harap mengisi semua field data';
$msgClass = 'errordiv';
}
}
Mempercantik tampilan dengan CSS
Agar tampilan lebih menarik maka kita bisa menambahkan script berikut ini.
.mainContent {
width: 35%;
margin: 2.5em auto;
background: #fff;
padding: 2.5em;
}
.contactFrm h4 {
font-size: 1em;
color: #252525;
margin-bottom: 0.5em;
font-weight: 300;
letter-spacing: 5px;
}
.contactFrm input[type="text"], .contactFrm input[type="email"] {
width: 70%;
outline: none;
font-size: 0.9em;
padding: .7em 1em;
border: 1px solid #000;
-webkit-appearance: none;
display: block;
margin-bottom: 1.2em;
}
.contactFrm textarea {
resize: none;
width: 93.5%;
font-size: 0.9em;
outline: none;
padding: .6em 1em;
border: 1px solid #000;
min-height: 10em;
-webkit-appearance: none;
}
.contactFrm input[type="submit"] {
outline: none;
color: #FFFFFF;
padding: 0.5em 0;
font-size: 1em;
margin: 1em 0 0 0;
-webkit-appearance: none;
background: #006faa;
transition: 0.5s all;
border: 2px solid #006faa;
-webkit-transition: 0.5s all;
transition: 0.5s all;
-moz-transition: 0.5s all;
width: 47%;
cursor: pointer;
}
.contactFrm input[type="submit"]:hover {
background: none;
color: #006faa;
}
p.statusMsg{font-size:18px;}
p.succdiv{color: #008000;}
p.errordiv{color:#E80000;}
Tidak ada yang terlalu spesial dari script CSS ini, hanya ada atribut input[type=”text”], input[type=”email”] dan input[type=”submit”] yang digunakan untuk menargetkan secara khusus pada field dengan tipe teks, email ataupun submit.
DEMO | DOWNLOAD
Jika Anda tertarik untuk dengan form kontak dengan PHP ini, Anda bisa melihat DEMO dan download script nya disini.
Pada beberapa domain website, email akan masuk ke dalam spam, untuk menghindari jika terjadi hal demikian, Anda juga bisa menggunakan SMTP khusus seperti SMTP gmail.
Semoga artikel ini bisa bermanfaat bagi para pembaca yang baru mulai terjun di dunia online. Terima kasih.
Bisa Bagi ilmu tentang contact form sesuai dgn data di atas? gimana cara pengguna baru di html website. dan gimana menambahkan recaphtcha google. thanks
file di atas typenya *.html
klw di masukin ke dalam file php bagaimana caranya ..?
apa seperti itu..
trims
tinggal ubah menjadi .php dan ikuti aturan penulisan tag di PHP, bisa baca disini
kenapa punyaku error ya mas
dimensiindonesia.com/hubungi_kami.php
Setelah kami cek, sepertinya ada pembatasan fitur yang dilakukan oleh pihak hosting yang Anda gunakan. Mereka seperti mematikan fungsi mail().
Untuk itu sebaiknya tanyakan langsung kepada pihak hosting tentang masalah tersebut.
Mas boleh bantu test,,,
sakurajayafurniture.com/contact-form-email.php
saya coba tapi keluar tulisan Maaf pesan Anda gagal terkirim, silahkan ulangi lagi.:Dsalah dimana ya kira2,,, email to sudah saya isi juga
terima kasih
Sepertinya pihak hosting Anda memblokir fungsi mail() yang ada di PHP, solusinya silahkan tanya pada pihak hosting tentang hal tersebut
min apakah koding tersebut bisa langsung masuk ke inbox email kita?
Harusnya itu langsung masuk inbox
Makasih mas works 100%. Cuma kalo sya coba yahoo si pengirimnya gk mau.
Saya mencoba menggunakan phpmailer utk form contact us.
Namun setelah isHTML(true) ;
$body = $message;
Text area yg terkirim ke email penerimaan selalu bentuk nya plain text.
Bgm cara membuat jadi Html atau kalo kita kasih spacing atau enter dia juga ikut.
Mhn pencerahannya.
Terima kasih
mas selain php. mailer. buat di localhost pake apa lagi yah..
Kalau diterapkan di joomla 3x kenapa gak jalan ya?
Notice: Undefined variable: name in C:\xampp\htdocs\ubud\send_mail.php on line 26
Warning: mail(): Failed to connect to mailserver at “localhost” port 25, verify your “SMTP” and “smtp_port” setting in php.ini or use ini_set() in C:\xampp\htdocs\ubud\send_mail.php on line 42
*kenapa tu mas bro???
gan, knp ya udh sukses masuk tapi ga ada pesan berhasil atau nggak nya
thanks gan masukannya bermanfaat sekali.
mas, supaya bisa otomatis ke halaman utama blog atau ke url tertentu kalau form sukses terkirim bagaimana caranya???
Gan, cara manggil script php pengirim data dari file html nya gimana ya? masih bingung saya.
Apakah file html sama php nya satu folder, biar bisa bekerja.
Terimakasih
Download saja source nya bung, lalu coba sendiri. Cuma 1 file PHP saja
Permisi min waktu saya mencoba menggunakan versi demo dan sudah melakukan uji coba pengiriman dan mendapatkan pesan ” Pesan Anda sudah terkirim dengan sukses ! ” pada form tersebut, dan waktu saya cek email di pesan terkirim tidak ada riwayat saya habis melakukan sesuatu aktifitas mengirim pesan.
itu kira-kira penjelasanya bagaimana min ?, terima kasih.
Coba cek spam, biasanya kalau dari localhost masuk ke spam
Gan maaf, itu localhost nya harus aktif atau engga? terus harus buat dulu database tak? ane download SC nya pas di running file php nya malah ikut muncul di halaman web nya :D
Iya donk harus aktif
Mas, misalkan saya hilangkan subjeknya. kira kira pesan tersebut bisa masuk ke inbox mail saya gak ya?
Kalaupun bisa paling masuk spam
Terima kasih tutorialnya mas. Izin saya pake pada blog saya yah. Terima kasih
kenapa kok kaadang kadang gak bisa ?
itu nyimpen script php nya dimana ? apa bikin folder baru ?
mas tolong cek dong di web saya fillahsite.atwebpages.com knpa gabisaa dikirim
kenapa ga ada pembahasan file phpnya di beri nama apa taruh folder mana yaa? masih pemula nihh tolong bantuannya! jangan dibully!
kalo di “$toEmail = ’email@namadomain.com’; // Ganti dengan alamat email yang Anda inginkan” bisa di send di dua email gk bos? maaf masih newbie :)
yang saya ko ga ada tulisan sukses terkirim atau gagal?
dan di cek kotak masuk atopun spam ga ada?
kenapa ya suhu?
bagus kak
mau ngoba doang…
nice tutorial :)
gan ada video tutorialnya gk ane masih bingung ni….
Warning: mail() [function.mail]: Failed to connect to mailserver at “localhost” port 25, verify your “SMTP” and “smtp_port” setting in php.ini or use ini_set() in C:\xampp\htdocs\KOMEN\contact-form-email.php on line 36
ini kenapa ya disaat saya dah ikuti cara di atas pas saya coba eh kek gini solusi ini kenapa ya??? dimana yg salah