How to Customize or Add Contact Form in Magento

This article will guide you to add contact form in your Magento contact page. Since many of you are having problems on why your contact form is not working. Just follow this instruction follows:

Step 1. Adding a Transactional Email

If you are already in your Dashboard, go to System > Transactional Emails

click Add New Template and provide relevant data into important fields such asĀ Template *, Locale *, Template Name *, Template Subject *, and Template Content *.

transactional emails

Template content here:

Name: {{var data.name}}

E-mail: {{var data.email}}

Telephone: {{var data.telephone}}

Comment: {{var data.comment}}

and click Save Template.

Note: This will be the format when your customer is reaching you through your contact form.

Step 2. Adding Information on Contact Under Magento System

Under System > Configuration > General > Contact

You will see this fields below

system contact magento

  • Enable Contact Us: Yes
  • Send Emails To: [email protected]
  • Email Sender: General Contact
  • Important: General Contact settings can be found by following System > Configuration > General > Store Email Addresses

    Provide your correct email information such as Sender Name and Sender Email

  • Email Template: Template1

Template1 represents the template we created in Step1

Of Course, Click Save Config

Step3. Adding Contact form Block into your page

Go to CMS > Pages > Add New Page

Adding relevant information into important fields..

  • Page Title *: Contact Us
  • URL Key: contact-us
  • Store View: All Store Views (default)

Click Content tab and paste this code

{{block type="core/template" name="contactForm" form_action="/contacts/index/post" template="contacts/form.phtml"}}

Click Save Page

After that you can more or less access your contact page by visiting http://your-site.com/contact-us/

Optional Notes

Some of Magento Templates has a built it function to auto generate Contact Us link in your nav menu, if not, you need to hard code it it order for it to work. As default, you can also directly go to http://your-site.com/contacts/index/

You may also encounter sending error or 404 error when testing email form, you can edit

/public_html/app/design/frontend/base/default/template/contacts/form.phtml

or

/public_html/app/design/frontend/YOURTHEME/default/template/contacts/form.phtml

by changing Form action value to

<form action=”/contacts/index/post/” id=”contactForm” method=”post”>

I hope you will find this article useful. Thank you for visiting.

 

How to Customize or Add Contact Form in Magento4.14/5 (82.86%) 42 votes
About

Elvin is one of the contributors of InnoveDesigns.com. He has been creating Wordpress Plugins, Magento Extensions, & Mobile Applications. If you find this article useful, please Follow him on .

Published under Magento, Web Development Guide