The simplest form of sending data by email using HTML and PHP. Create a feedback form

Hello dear readers, today I want to tell you about how I create forms to obtain user contact information.

Today, , is part of the landing page structure. After all, this is one of the ways to accept an order or send a catalog of your products, having previously received the visitor’s e-mail.

I usually need three fields, and in most cases, I use this markup to create a contact form:

Get price

Try opening this code in your browser and see what you get, depending on what Internet browser you use, it should look something like this:

If you have any questions about markup, feel free to ask them in the comments, I will try to answer in detail, and I will not describe each element in the article so as not to increase its size. In addition, the elements are quite simple.


Let's style our form and make it readable:

/* Form styles */ #application ( width: 475px; margin: 0 auto; ) /* Input field styles */ #applicationName, #applicationEmail, #applicationTelephone ( width: 100%; height: 73px; background: none; margin -top: 25px; border: 1px solid #fff; text-align: center; font-size: 24px; , #applicationEmail:focus, #applicationTelephone:focus ( border: 1px solid #30ad64; ) /*Styles of text displayed in placeholder*/ ::-webkit-input-placeholder ( color: #efefef; font-family: "PT Sans ", sans-serif; text-shadow: 0 1px 1px rgba(0, 0, 0, .3); ) ::-moz-placeholder ( color: #fff; font-family: "PT Sans", sans-serif ; text-shadow: 0 1px 1px rgba(0, 0, 0, .3); /* Firefox 19+ */ :-moz-placeholder ( color: #fff; font-family: "PT Sans", sans- serif; text-shadow: 0 1px 1px rgba(0, 0, 0, .3); /* Firefox 18- */ :-ms-input-placeholder ( color: #fff; font-family: "PT Sans" , sans-serif; text-shadow: 0 1px 1px rgba(0, 0, 0, .3); ) ::placeholder ( color: #fff; text-shadow: 0 1px 1px rgba(0, 0, 0, .3); ) /*Button styles*/ .applicationButton ( margin-top: 25px; background: #30ad64 ; border: none; height: 73px; color: #fff; text-transform: "PT Sans", sans-serif; cursor: pointer; .applicationButton:hover ( background: #d68c18; )

If you want the button color to change smoothly, add the following line to .applicationButton and .applicationButton:hover:

Transition: .6s;

Where.6s is the animation time in milliseconds.
Now our form has acquired a beautiful appearance, now it looks like this:

Now we need to create the application.php file. It will receive the entered parameters from the form and send them to us by email.

Its structure is like a regular html file; it can be a page on which you write “Thank you, your application has been accepted. After processing the application, our managers will contact you"

That is, when the user clicks the button, he will be redirected to the application.php page. This is a full page and you should style it accordingly.

You will be contacted

You will be contacted body ( background: #22BFF7 url(img/zakaz.jpg) top -70% center no-repeat; ) setTimeout("location.replace("/index.html")", 3000); /*Change the current page address after 3 seconds (3000 milliseconds)*/

Call up the window and enter data for a test check of our form

Let me remind you once again that your hosting must support processing PHP files, otherwise our processor will simply not be executed and no letter will be sent to the specified email address. The result of a successfully completed feedback form

That's all for me, I tried to convey the meaning and operation of the script in the best possible way. If you have any questions, feel free to contact me in the comments or on VK (see contact details). I wish you easy and productive work.

The profitability of any online store primarily depends on how comfortable the conditions are created on the site. Any buyer wants to find what they are looking for as quickly as possible and at the same time spend a minimum of effort. Statistically, most customers don't like the checkout process. That is why, if you want to increase the number of sales, you need to simplify the ordering system on your website.

In online stores, in order to buy a product, the client must fill out an order form, which is installed on the site using special scripts, modules or plugins. When creating an order form, adhere to the following rules.

1. Simplicity is the key to effectiveness.

As practice shows, if a buyer encounters any problem when placing an order, he most often leaves the resource for fear of encountering this problem again. If your order form has a few simple steps and is easy to fill out, you are guaranteed consistent sales. It is worth noting that the main thing is not to overdo it with simplicity; always take into account the specifics of your project. The order form on the website must collect the minimum necessary information to complete the order.

2. Use clear examples.

A person always needs a clear example, especially when filling out an order form. Try to create a web form that even a complete beginner can fill out.

3. In total, show the progress of the order to your client.

The client should always see how many stages he has completed and how many still remain to be completed. is of particular importance from a psychological point of view. The classic ordering process takes place in 3-4 stages. The first stage is when the user creates an order list. The second stage - the buyer enters his contact information. The third stage is information verification. The fourth stage is the transaction.

4. Dispel all doubts of clients.

In our country, a law on the protection of personal data has recently come into force, but many users do not know about it. In the html order form, be sure to indicate the non-disclosure of personal information. This will significantly increase the trust of your customers.

5. No! registrations.

Almost all buyers have a negative attitude towards any registration, due to the fact that this process can take a long time (in their opinion). Therefore, even if you register on your website without confirming your profile, delete it or make the ordering process available to unregistered users. It is worth noting that in some cases registration, on the contrary, is necessary. For example, when you intend to create a quality customer base. In this case, register on the site through social networks. It's very simple.

All of the above rules and tips undoubtedly increase the efficiency of the order form on the site, but you should always remember that a lot depends on the specifics of the topic. Only by trial and error can you really increase website conversion.