Categories
Laravel

Laravel – Custom contact form and send email

Laravel custom contact form and send email are another routine functionality that is a requirement of more or less every website. In this article, I am going to demonstrate how you can easily create a contact form and mail function in Laravel with email sending.

Laravel is well known PHP Framework, providing multiple solutions for a problem. This is one of the main reasons of the popularity of the PHP framework. Most popular solutions cover this framework routine functionality such as authentication, sessions, routing, send email and caching.

Creating custom contact form in Laravel

  • Configure Laravel Project
  • Install HTML and Form Package
  • Configure Project Database
  • Create Database Table Using Migrations
  • Create ContactUs Model
  • Create Page Route contact
  • Create ContactUs Controller
  • Create contact Page View
  • Sending Email Function

Configure Laravel Project

Install and configure your Laravel project by using the Composer create-project command in your terminal: composer create-project laravel/laravel laraveldemo –prefer-dist “laraveldemo” is your project directory.

Install HTML and Form Package

To create custom contact form in Laravel, I will use laravelcollective/html package for contact us Forms and HTML. Launch the SSH terminal and login to your server using the Master Credentials and go to your project root directory. Run command composer require laravelcollective/html

After successful installed HTML and Forms package laravelcollective/html, goto config/app.php file and add Autoloaded Service Provider and Class Alias.

Configure Project Database

Now configure your project database connection, Find .env file in your project root directory, Open .env and add database access credentials there.

Create Database Table Using Migration Command

Go to your SSH terminal and Run artisan make:migration create_YOUR_TABLE_NAME_table command to create the database migration for creating the Contact Us model.

Contact us migration has been created, go to database/migration/2020_04_02_180504_create_contact_us_table.php and update up method public function up() with database fields like below.

Now run the artisan migrate command to generated database table contact_us with all (id, name, email, message, created_at, updated_at) fields.

Create ContactUs Model

Go to your SSH terminal and Run make:model MODEL_NAME command to create ContactUS model.

After successfully created the ContactUS model, go to App directory and Find file app/ContactUS.php and add the following code in the file.

Create Page Route contact

Now, We will go to create the route “contact-us” (Contact Us page URL). Go to routes/web.php and add the following code to the route:

Create ContactUs Controller

After setup page the routes, I will go to create a controller to handle the requests from the routes. Go to your SSH terminal and Run make:controller CONTROLLER_NAME command to create the controller.

Go to app/Http/Controllers directory and find and Open ContactUSController.php and add the following code.

Create contact Page View

Now I am going to create contact us Page View layout of the contact form. Go to resources/views/ and create a file contactus.blade.php. Place the following code in this blade (view) file.

Form output like below picture.

Sending Email Function

Custom contact us form is now functional. On submitting the form, the data will be stored in the database. I will now make the form email send function.

Now create another blade (view) file, resources/views/email.blade.php and add the following code in email blade.

Now go to project directory, Find .env file, Open .env and add SMTP email access credentials there.

Now SMTP email the configuration is done, update app/Http/Controllers/ContactUsController.php with the following code.

Laravel custom contact us form is now ready for deployment. This module save the data in the database and send email it to the given email address as well. To test the Contact Us form, go to the application and click on launch application (remember to add /contact-us to the URL). Thanks.

Thank you for carefully read my article If you have any query please Leave your query on following comment section or contact with us. Please LIKE and SHARE