ساخت فرم تماس با ما

آخرین بروز رسانی: دی ۲۰, ۱۳۹۶

برای خواندن کامل مطلب به سایت سر بزنید . آنجا کد ها و تصوایر کاملا خوانا ترند !
https://www.webyar.net/

ایجاد فرم تماس با ما بدون افزونه

ایجاد فرم تماس با ما

همانطور که می دانید، امروزه در همه ی سایت ها فرم تماس با ما برای ارتباط کاربران با مدیریت سایت وجود دارد. فرم تماس با ما باعث بهبود رابط کاربری سایت  و همچنین افزایش اعتماد کاربران به سایت می شود. در نتیجه صفحه ی تماس با ما را می توان یکی از مهم ترین صفحات یک وب سایت دانست، به همین علت تیم طراحی سایت وب یار در نظر دارد ساخت فرم تماس با ما با php را به شما عزیزان آموزش دهد. پس در ادامه ما را همراهی کنید.

مراحل ساخت فرم تماس با ما و ارسال به ایمیل با php

برای ایجاد فرم تماس با ما به دوفایل زیر نیازداریم:

۱-contact.php که کدهای html در آن قرار می گیرد،

۲- send_contact.php که کدهای php را در آن قرار می دهیم.

توجه داشته باشید که این قطعه کد بر روی هاست انجام می شود و برای اجرا بر روی لوکال هاست باید یکسری ویرایشات در بعضی از فایل ها انجام گیرد.

کد html برای ساخت فرم تماس با ما

قطعه کد زیر را در فایل contact.php قرار دهید.

<html>     <body>         <form action="send_contact.php" method="post">             subject: <input type="text" name="subject"><br>             message:  <textarea name="message" cols="50" rows="4" id="detail"></textarea><br>             name:    <input type="text" name="name"><br>             email:   <input type="text" name="email"><br>             <input type="submit" value="Submit" name="submit">         </form>     </body> </html>

 

کد بالا یک فرم ساده ایجاد می کند و اطلاعات را می گیرد و به فایل send_contact.php ارسال می کند.

اجرای کد بالا به صورت زیر می باشد.

 

ساخت فرم تماس با ما

 

کد php برای ساخت فرم تماس با ما

برای تکمیل ساخت فرم تماس با ما کدهای زیر را هم در فایل send_contact.php قرار دهید.

<?php   if (isset($  _POST['submit'])) {     $  to = "you@you.com";     $  subject = $  _POST['subject'];     $  message = $  _POST['message'];     $  name = $  _POST['name'];     $  email = $  _POST['email'];       $  body = "From: $  name\n E-Mail: $  email\n Message:\n $  message";       echo "Data has been submitted to $  to!";     mail($  to, $  subject, $  body); } else {     echo "error!"; } ?>

 

توجه:در خط سوم آدرس ایمیل خود را قرار دهید.

نتیجه کار به صورت زیر می باشد.

ایجاد فرم تماس با ما برای سایت

 

اما مشکلی که روش بالا دارد این است که برای ارسال محتویات از فرم اول به فرم دیگر، بعد از کلیک بر روی دکمه ارسال، صفحه مرورگر دوباره بارگذاری می شود تا نتیجه عملیات را نمایش دهد. از آنجایی که کاربران تمایل زیادی برای بارگذاری اجباری و مجدد یک صفحه ندارند استفاده از روشی که باعث بارگذاری مجدد صفحه تماس با ما نشود، هم منطقی و هم کاربر پسندتر است. برای جلوگیری از بارگذاری مجدد از زبان ajax استفاده می کنیم. در ادامه همراه ما باشید تا این روش را نیز به شما آموزش دهیم.

مراحل ساخت فرم تماس با ما و ارسال به ایمیل با php  وajax

کدhtml زیر را در فایل contactform.php قرار دهید.

<html>   <head>   </head>   <body>     <form id="contactform" action="" method="post">       <label>Name:</label><input id="name" type="text" name="name" /><br><br>       <label>Email:</label><input id="email" type="text" name="email" /><br><br>       <label>Message:</label><textarea id="message" name="message"></textarea><br><br>       <input id="submit" type="button" value="send" />       <div id="success" style="color: red;"></div>     </form>   </body> </html>

 

کدphp زیر را در فایلsendemail.php قرار دهید.

<?php $  name = $  _POST['name']; $  email = $  _POST['email']; $  message = $  _POST['message']; $  to = "you@you.com"; $  subject = 'the subject'; $  message = "From: $  name\n E-Mail: $  email\n Message:\n $  message"; $  headers = 'From: youremail@domain.com' . "\r\n";   if (filter_var($  email, FILTER_VALIDATE_EMAIL)) { // this line checks that we have a valid email address mail($  to, $  subject, $  message, $  headers); //This method sends the mail. echo "Your email was sent!"; // success message }else{ echo "Invalid Email, please provide an correct email."; } ?>

 

کدajax زیر را نیز در فایل contactform.php در قسمت head قرار دهید.

<script src="https://code.jquery.com/jquery-latest.js"></script>     <script>             $  (document).ready(function() {                 $  ('#submit').click(function() {                     $  ('#submit').attr('value', 'Please wait...');                     $  .post("sendemail.php", $  ("#contactform").serialize(), function(response) {                         $  ('#success').html(response);                         $  ('#submit').attr('value', 'SEND');                     });                     return false;                 });             });     </script>

 

ایجاد فرم تماس با ما با php و ajax

همانطور که می بینید صفحه مجددا بار گذاری نشده است.

اکنون شما قادر به ساخت فرم تماس با ما برای سایت تان هستید. با عضویت در کانال @webyar_net می توانید از جدیدترین آموزش های تیم طراحی سایت وب یار مطلع شوید.

نوشته ساخت فرم تماس با ما اولین بار در طراحی سایت اصفهان | سئو سایت اصفهان پدیدار شد.

طراحی سایت اصفهان | سئو سایت اصفهان

پربازدیدترین اخبار
طراحی سایت اصفهان

طراحی سایت اصفهان |طراحی سایت حرفه ای | سئو تضمینی سایت طراحی سایت اصفهان تیم طراحی سایت و سئو سایت وب یار به آدرس http://www.webyar.net ، بامجوز رسمی از نظام کامپیوتر کشور و دارای نماد اعتماد و نماد ساماندهی و با ۱۶ سال دانش تخصصی در زمینه طراحی وب سایت ,سئوسایت در گوگل و امنیت […]

طراحی سایت

طراحی سایت در اصفهان   طراحی سایت و سئو سایت در اصفهان   تیم طراحی سایت و سئو سایت وب یار به آدرس ، بامجوز رسمی از نظام کامپیوتر کشور و دارای نماد اعتماد و نماد ساماندهی و با ۱۶ سال دانش تخصصی در زمینه طراحی وب سایت , سئو سایت در گوگل ، ارسال […]

روسیه بزرگترین کشور دنیا با نژادی قدرتمند، فرهنگی متمایز و مناظر نفسگیر همواره توریست های زیادی را به خود جذب می کند. شاید حالا که سفر به قسمت هایی از این کشور بدون ویزا برای ایرانیان فراهم شده است بتوانیم با معرفی جاذبه های گردشگری و توریستی روسیه به شما اطلاعاتی درباره این کشور پهناور […]

زمان فعالیت دفتر وب یار در ایام نوروز                  یا مقلب القلوب و الابصار یا مدبرالیل و النهار                                                                                            یا محول الحول و الاحوال حول حالنا الی احسن الحال حلول سال نو و بهار پرطراوت را که نشانه قدرت لایزال الهی و تجدید حیات طبیعت می باشد را […]

Mozilla Firefox آخرین نسخه از مرورگر وب محبوب فایرفاکس می باشد که اخیرا منتشر شده است.‏ این مرورگر به صورت کامل از HTML5 پشتیبانی می‌کند. نسخه جدید فایرفاکس برای مدیریت ساده‌ تر تب ها و پنجره ها ارتقا فوق العاده ای داشته است و اکنون در این نسخه شما ابزار های مختلفی را برای استفاده […]

Contacts + Pro نرم افزاری محبوب و کاربردی به همراه امکان برقراری تماس و ارسال پیام در اندروید ، که می تواند در اپلیکیشن هایی چون واتس آپ، فیس بوک، توییتر و اپلیکیشن های دیگر به شما امکانات زیادی جهت مدیریت مخاطبان ارائه کند. نرم افزار امکان مدیریت کامل و همه جانبه بر روی مخاطبین […]