Feedback php script. Custom feedback form: how to create online? How to make a beautiful HTML and PHP pop-up contact form with a phone number and sending an order by email
Hello dear reader, today I have prepared a delicious form for you feedback html, which works without reloading the page Ajax technologies+ a powerful trigger that will motivate your visitors to use the form. Readers of my blog very actively discussed my previous article on Landing Page, now we evaluate, look at the modified new form. All necessary source code and demo attached in the article , we will also analyze the structure of work and connection.
UPD: Fixed a bug with name encoding in the subject line. Now everything is displayed correctly. We thank the reader (Ekaterina Karacheva)
The format of the form itself also includes a handler file on php language, additionally needed for work jquery library and scripts, but about everything in order, I won’t load it for too long - let’s move on to the review and analysis of our feedback.
HTML feedback form - work structure
Our form looks like this:
What's the point here? There is such a form on the right side, but on the left side I made special block, which will encourage your visitor to enter their contact information immediately! The secret is simple: Do you see the date and time in the left block? Today's date will be displayed all the time, over time the range of these two hours is calculated from the present hour, let's say if your time now is 13:14, then the hour range will be: from 12 to 14. Look at how it works)))
The visitor will see: wow, there’s a discount today, and I was just on time, there’s also a discount! Must take it immediately! - This is our trigger.
I downloaded the source code of the html feedback form, looked at the demo - I think I’ve played enough)) Now about the most important thing, the principle of operation:
Validation of fields in the input form occurs in the handler file contact.php below in the listing program code You can see that a message about errors and the successful sending of a letter appears in the form itself, this is what it looks like after sending:
Form handler source code
Paste in line 52 your email, so all letters will be sent to the specified email.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 | < 1) { $error .= "Введите ваше сообщение. <".$tel."> ".$error." ";
}
}
?>
|
"; ) // Phone verification function ValidateTel($valueTel) ( $regexTel = "/^(7,12)$/"; if($valueTel == "") ( return false; ) else ( $string = preg_replace( $regexTel, "", $valueTel); ) return empty($string) ? true: false; ) if(!$tel) ( $error .= "Please enter a phone number.
"; ) if($tel && !ValidateTel($tel)) ( $error .= "Enter a valid phone number.
"; ) if(!$error) // Check message (length) if(!$message || strlen($message)< 1)
{
$error .= "Введите ваше сообщение.
";// This line sets a minimum restriction on the writing of letters. ) if(!?utf-8?b?". base64_encode($name) ."?="; $message ="\n\nName: ".$ name."\n\nPhone number: " .$tel."\n\nMessage: ".$message."\n\n"; $mail = mail(" [email protected]", $subject, $message, "From: ".$name_tema."<".$tel.">"."Reply-To: ".$email." "." X-Mailer: PHP/" . phpversion()); if($mail) ( echo "OK"; ) ) else ( echo "
Form performance
To receive letters to your Mailbox, change the line I mentioned above. I advise you to use gmail.com mail, there are no delays or jambs when receiving a generated letter from the form. I warned you, because... Readers had many questions (letters do not arrive at mail.ru). Be careful about this.
We fill in all the fields, please note that the phone number is entered with an 8 - I specifically wrote the number with an eight “89251122333” in the tooltip. When entering a character «+» An error message will appear. If someone needs it, it’s easy to add this to the handler «+» .
Completed form with test data
Letter on the mailbox
As you can see, we received the letter with all three fields that were filled out and sent. The header of the letter “Request from the site site” changes in the handler contact.php
Everything works fine, it will be nice to hear your feedback (constructive criticism) in the comments, if you have any difficulties and can’t cope with something, feel free to write to me on VK (you will find it in the contact details). I hope you liked the design and functionality of this symbiosis of a feedback form (ordering services, application) and a trigger calling for action. Good luck to everyone in your work and a positive attitude, bye))
Prepared with the support of
From the author: Greetings, friends. This article will be a continuation, in which we implemented sending form data to the server without reloading the page. Here we will continue this topic and learn how to accept data on the server and implement form submission to email(email). So, let's set up a feedback form and add the ability to send it by email.
Source files You can download the current article at .
In this lesson we will do everything as simply as possible and on our own. In particular, to send letters we will use a special PHP function called mail(), which was previously often used to send letters.
Let's start with the syntax of the mail function. This function has three required parameters and two optional (not required). Required parameters:
to — recipient’s email (you can also specify several addresses, listing them separated by commas);
subject — subject of the letter;
message — text of the letter.
Of the optional parameters, only the first one is almost always used, which is responsible for the letter headers: encoding, sender, letter type, etc.
Let's try sending an email using this function. Let's do this in the mail.php file, in which we accept data from the form. New code this file will be like this:
Your message has been sent
"; )else( echo "Error!
"; }< ? php $to = " [email protected]" ; // address of the recipient $subject = "Order a call back"; // letter subject $message= "Name: ($_POST["name"])\r\n"; // add name to text $message. = "Phone: ($_POST["phone"])"; // add phone number to text $headers. = "Content-type: text/plain; charset=utf-8". "\r\n" ; // set the encoding $headers. = "From: [email protected]" . "\r\n" ; // add the sender if (mail ($to, $subject, $message, $headers)) ( echo " Your message has been sent ) else ( echo " Error! |
This is the minimum code that will already allow you to generate a message for sending. Let's check how it works:
As you can see, the code works, in response we receive a message that the letter has been sent. Since we are working on a local server, letters are not actually sent by the mail() function; they are saved as a text file in a special folder. In Open Server this is the \userdata\temp\email\ folder. Let's open this folder and make sure that the letter is there, it will look something like this:
Great! There are a few things left that wouldn't hurt to fix in the JS script. For example, it is necessary to display a message not in plain text, but in HTML code, and also to clear the form fields after sending the message. The final JS code will be like this:
$(function())( $("#recall").submit(function(e)( e.preventDefault(); var data = $(this).serialize(); $.ajax(( url: "mail.php ", type: "POST", data: data, beforeSend: function())( $("#submit").next().text("Sending..."); ), success: function(res)( $ ("#recall").find("input").val(""); $("#submit").next().html(res); ), error: function())( alert("Error! "); ) )); )); ));
$(function()( $("#recall" ) . submit(function(e)( e. preventDefault(); var data = $(this) . serialize(); $. ajax (( url: "mail.php" , type: "POST" data : data , beforeSend : function () ( $("#submit" ) . next(). text ("Sending..." ) ; |
Create a feedback form
Creating a feedback form on the website
In the process of website promotion, along with studying visitor statistics, information about the website from the visitors themselves is of particular importance. One of the easiest ways to obtain such information is to place a page on the website with feedback form. The visitor leaves a message, and it will be sent to your email address or any other one you specify. In this case, the visitor does not need to use his own mail program, he does not even need to have his own e-mail.
The simplest example of this form is shown in Fig. 1. (This is a completely working sample, and you can use it to send me a thank you note.)
Fig.1. Simple feedback form
To place such a feedback form on a website, you only need basic information about HTML and the ability to operate two commands - Copy And Insert. Let's consider the sequence of actions to create a feedback form (Fig. 1) on the HTML page of the site.
1. Check that your hosting plan (the office where your site is hosted) supports PHP. If not, then you will most likely have to pay extra to switch to another tariff that supports this same PHP. You don’t have to look up the meaning of this abbreviation, since you don’t need knowledge of PHP.
2. Let's select the page on which we want to place the feedback form and paste the following code in the right place:As you can see, the entire form is created by the tag with attributes action=mail.php(indication to the site page where the script for processing the entered data is located) and method=post(method of sending data to the server). Individual lines created by tag with completely understandable attributes. The location of individual form elements, text, fonts, etc. you can change it in accordance with the design of your site. In the tag