15

I'm using magento 2 and I would like to add a custom field to the contact form , how I would be able to do that ?

40

First, open the form.phtml file located in your theme.

/magento_root/app/design/frontend/VENDER_NAME/YOUR_THEME/Magento_Contact/templates/form.phtml, then add subject field to this contact form:

<div class="field subject required">
    <label class="label" for="subject"><span><?php /* @escapeNotVerified */ echo __('Subject') ?></span></label>
    <div class="control">
        <input name="subject" id="subject" title="<?php /* @escapeNotVerified */ echo __('Subject') ?>" value="" class="input-text" type="text" data-validate="{required:true}"/>
    </div>
</div>

Add the above field in the form.

As far as Magento is concerned, it doesn't care what fields we add to this form. It is written in such a way that it accepts all of the field posted for processing and send that out to the transactional e-mail form that you create. Now, go to MARKETING > Communication > Email Templates in the Magento Admin section. Click "Add New Template" and from the "Template" dropdown box select "Contact Form" then "Load Template". Under template content you will see:

{{trans "Name: %name" name=$data.name}}
{{trans "Email: %email" email=$data.email}}
{{trans "Phone Number: %telephone" telephone=$data.telephone}}
{{trans "Comment: %comment" comment=$data.comment}}

Add your new field before Name: {{trans "Name: %name" name=$data.name}} so that now it should looks like this:

{{trans "Subject: %subject" subject=$data.subject}}
{{trans "Name: %name" name=$data.name}}
{{trans "Email: %email" email=$data.email}}
{{trans "Phone Number: %telephone" telephone=$data.telephone}}
{{trans "Comment: %comment" comment=$data.comment}}

Enter a new name under "Template Name" to save your new Template and click on "Save Template". Now we need to tell Magento to use this new template for the Contact form. Go to STORES -> Settings -> Configuration -> General -> Contacts and select "Contacts". Under "Email Options", select your new template under the "Email Options" -> "Email Template" dropdown box. Click on "Save Config".

  • 1
    This is correct, instead of creating the template for the email in te database, I would override the template in my theme (/magento_root/app/design/frontend/VENDER_NAME/YOUR_THEME/Magento_Contact/email/submittted_form.html). It's just personal taste ;) – Stijn Duynslaeger - Echron Jan 16 '18 at 21:13
0

If you want to add extra field in contact form and send it with email,Go to vendor/magento/magento_contact/view/templates/frontend/form.phtml

<div class="field subject">
<label class="label" for="subject"><span><?= $block->escapeHtml(__('Subject')) ?></span></label>
<div class="control">
<input name="subject" id="subject" title="<?= $block->escapeHtmlAttr(__('Subject')) ?>" value="<?= $block->escapeHtmlAttr($this->helper(\Magento\Contact\Helper\Data::class)->getPostValue('subject')) ?>"class="input-text" type="text" />
</div>
</div>

Go to admin,Marketing->Email Templates->Click on "Add new Template"->Select Contact form->Click on "Load Template"

{{template config_path="design/email/header_template"}}
<table class="message-details">
<tr>
<td><strong>{{trans "Name"}}</strong></td>
<td>{{var data.name}}</td>
</tr>
<tr>
 <td><strong>{{trans "Subject"}}</strong></td>
<td>{{var data.subject}}</td>
</tr>
<tr>
 <td><strong>{{trans "Email"}}</strong></td>
<td>{{var data.email}}</td>
</tr>
<tr>
<td><strong>{{trans "Phone"}}</strong></td>
<td>{{var data.telephone}}</td>
</tr>
</table>
<p><strong>{{trans "Message"}}</strong></p>
<p>{{var data.comment}}</p>
{{template config_path="design/email/footer_template"}}

Save Your Template, Go to Stores->Configuration->General->Contacts->In "Email Options" select your template->Save Config

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.