Growthus
Nextjs
Contact Page

Contact Page

Page Title

To edit the page title for the Contact page, you can modify the code in the app/contact/page.jsx file. Locate the following code snippet and make the necessary changes:

<PageHero
  pageTitle={
    <>
      <span>Let’s start a </span> <br /> <span> project together. </span>
    </>
  }
/>

Update the text inside the <span> elements to customize the page title according to your preferences.

Contact Form

The Contact form is generated from the components/Contact/ContactForm.jsx file. To customize the Contact form, you can make changes to the code within that file.

  1. To make the form functional, you will need to handle form submission and implement the desired behavior, such as sending the form data to a server or displaying a success message.
  2. Add necessary form validation, such as checking if the email field is filled and if the entered email is valid.
  3. You can use third-party libraries or frameworks to handle form submission and validation, or you can implement your own custom logic.

Please note that configuring the subscription form requires both frontend (HTML, CSS, JSX) and backend (form submission handling) development skills. If you are unfamiliar with web development, it may be helpful to consult with a developer or study relevant documentation and tutorials.

Contact Address

The contact address data is generated from the data/data.js file. Follow these steps to customize the contact address:

  1. Open the data/data.js file.

  2. Locate the const contactFormData section within the file.

  3. Edit the parameters within the contactFormData object according to your needs:

    • image: Update the image path for the contact address section.
    • Email: Change the email address of the company.
    • phone: Modify the phone number of the company.
    • address: Update the address details. You can add or remove address entries by modifying the objects within the address array. Customize the values for the name and location properties to match your desired contact address entries.

Here's an example of the code structure:

export const contactFormData = {
  image: "/images/contact/contact.png",
  Email: "info@growthus.com",
  phone: "+96099969996",
  address: [
    {
      name: "London",
      location: "1421 San Pedro St, Los Angeles, CA 90015",
    },
    {
      name: "Japan",
      location: "1421 San Pedro St, Los Angeles, CA 90015",
    },
  ],
};

Contact experts

The contact experts' data is also generated from the data/data.js file. To customize the contact experts, follow these steps:

  1. Open the data/data.js file.

  2. Locate the const contactFormData section within the file.

  3. Add or modify the objects within the experts array to include the details of your contact experts. Each expert should have the following properties:

    • name: The name of the expert.
    • image: The image path for the expert's photo.
    • designation: The designation or role of the expert.
    • phone: The phone number of the expert.
    • email: The email address of the expert. Here's an example of the code structure:
  experts: [
    {
      name: "Marvin McKinney",
      image: "/images/contact/contact-person1.png",
      designation: "Founder and CEO",
      phone: "+96099969996",
      email: "info@example.com",
    },
    {
      name: "Floyd Miles",
      image: "/images/contact/contact-person2.png",
      designation: "Co-Founder and CTO",
      phone: "+96099969996",
      email: "info@example.com",
    },
    {
      name: "Kristin Watson",
      image: "/images/contact/contact-person3.png",
      designation: "Co-Founder and CTO",
      phone: "+96099969996",
      email: "info@example.com",
    },
  ],

To add more experts, you can repeat the code snippet for each expert inside the experts array. Here's an example:

experts: [
  {
    name: "Marvin McKinney",
    image: "/images/contact/contact-person1.png",
    designation: "Founder and CEO",
    phone: "+96099969996",
    email: "info@example.com",
  },
  {
    name: "Floyd Miles",
    image: "/images/contact/contact-person2.png",
    designation: "Co-Founder and CTO",
    phone: "+96099969996",
    email: "info@example.com",
  },
  {
    name: "Kristin Watson",
    image: "/images/contact/contact-person3.png",
    designation: "Co-Founder and CTO",
    phone: "+96099969996",
    email: "info@example.com",
  },
  // Add more experts here
  {
    name: "John Doe",
    image: "/images/contact/contact-person4.png",
    designation: "Marketing Manager",
    phone: "+96099969996",
    email: "info@example.com",
  },
  {
    name: "Jane Smith",
    image: "/images/contact/contact-person5.png",
    designation: "Sales Representative",
    phone: "+96099969996",
    email: "info@example.com",
  },
];

Repeat the structure of the object for each additional expert and customize the values for the name, image, designation, phone, and email properties accordingly.

BlogsBusiness Policy