➡️Form

A contact form for potential clients to reach out.

📍Location: src/components/form.php


🦄 Styles:

👉Desktop design: public/styles/index.css

👉Responsive: public/styles/responsive.css

📑To configure the contact form you can start with the .env file

📍Location:Template_Wedding_Photography/.env

📬Configuring Your .env File for Email Sending

👉To send emails using the contact form, you need to configure both the SMTP settings in the .env and the send_email.php files.

Here’s how to configure the SMTP server for both Gmail and Hotmail:

👉For Gmail:

  1. SMTP_HOST: This is the SMTP server for Gmail. Set it as "smtp.gmail.com".

  2. SMTP_USER: Enter your Gmail email address here. Example: "your-email@gmail.com".

  3. SMTP_PASS: This is your app-specific password, not your regular Gmail password. Follow the Google instructions to generate an app-specific password.

  4. SMTP_SECURE: Set this to "tls" to ensure a secure connection.

  5. FROM_EMAIL: This should be the same as your SMTP_USER or the email address you want to use as the sender.

  6. FROM_NAME: Set the name you want to display as the sender. Example: "Morena Photography".

// Gmail example
SMTP_HOST="smtp.gmail.com"
SMTP_USER="your-email@gmail.com"
SMTP_PASS="your-app-specific-password"
SMTP_SECURE="tls"
FROM_EMAIL="your-email@gmail.com"
FROM_NAME="Morena Photography"

👉For Hotmail:

  1. SMTP_HOST: This is the SMTP server for Hotmail. Set it as "smtp.office365.com".

  2. SMTP_USER: Enter your Hotmail email address here. Example: "your-email@hotmail.com".

  3. SMTP_PASS: This is your Hotmail password.

  4. SMTP_SECURE: Set this to "starttls" to ensure a secure connection.

  5. FROM_EMAIL: This should be the same as your SMTP_USER or the email address you want to use as the sender.

  6. FROM_NAME: Set the name you want to display as the sender. Example: "Morena Photography".

Here’s an example configuration for Hotmail:

SMTP_HOST="smtp.office365.com"
SMTP_USER="your-email@hotmail.com"
SMTP_PASS="your-hotmail-password"
SMTP_SECURE="starttls"
FROM_EMAIL="your-email@hotmail.com"
FROM_NAME="Morena Photography"

🚀Customizing the Email Template Design

If you want to customize the design of the emails sent through your contact form, you can edit the email_design.php file included in the template.

  1. Locate the email_design.php file in the email_config folder: This file contains the HTML structure and design of the emails.

  2. Edit the Design: Open the email_design.php file in your code editor and make the necessary changes to match your preferred style.

By modifying this file, you can personalize the appearance of your emails to better align with your brand or specific design requirements.

🎈Customizing the Success Message Template

After a form is successfully submitted, a success message is displayed to the user. You can customize this message by editing the succesful_msg.php file.

  1. Locate the succesful_msg.php file in the email_config folder: This file is responsible for generating the message shown after a successful form submission.

  2. Edit the Success Message: Open the succesful_msg.php file in your code editor and modify the content as needed to reflect the message you want users to see.

By editing this file, you can tailor the success message to provide a more personalized experience for your website visitors.

Last updated