PHPackages                             craftcms/contact-form - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Mail & Notifications](/categories/mail)
4. /
5. craftcms/contact-form

ActiveCraft-plugin[Mail & Notifications](/categories/mail)

craftcms/contact-form
=====================

Add a simple contact form to your Craft CMS site

3.1.0(2y ago)296430.4k↓47.2%91[15 issues](https://github.com/craftcms/contact-form/issues)[4 PRs](https://github.com/craftcms/contact-form/pulls)15MITPHPPHP ^8.0.2CI passing

Since May 16Pushed 1mo ago16 watchersCompare

[ Source](https://github.com/craftcms/contact-form)[ Packagist](https://packagist.org/packages/craftcms/contact-form)[ RSS](/packages/craftcms-contact-form/feed)WikiDiscussions 3.x Synced 1w ago

READMEChangelog (2)Dependencies (4)Versions (34)Used By (15)

Contact Form for Craft CMS
==========================

[](#contact-form-for-craft-cms)

This plugin allows you to add an email contact form to your website.

Requirements
------------

[](#requirements)

This plugin requires Craft CMS 4.0.0+ or 5.0.0+.

Installation
------------

[](#installation)

You can install this plugin from the Plugin Store or with Composer.

#### From the Plugin Store

[](#from-the-plugin-store)

Go to the Plugin Store in your project’s Control Panel and search for “Contact Form”. Then click on the “Install” button in its modal window.

#### With Composer

[](#with-composer)

Open your terminal and run the following commands:

```
# go to the project directory
cd /path/to/my-project.test

# tell Composer to load the plugin
composer require craftcms/contact-form

# tell Craft to install the plugin
php craft plugin/install contact-form
```

Usage
-----

[](#usage)

Your contact form template can look something like this:

```
{% macro errorList(errors) %}
    {% if errors %}
        {{ ul(errors, {class: 'errors'}) }}
    {% endif %}
{% endmacro %}

{% set submission = submission ?? null %}

    {{ csrfInput() }}
    {{ actionInput('contact-form/send') }}
    {{ redirectInput('contact/thanks') }}

    Your Name
    {{ input('text', 'fromName', submission.fromName ?? '', {
        id: 'from-name',
        autocomplete: 'name',
    }) }}
    {{ submission ? _self.errorList(submission.getErrors('fromName')) }}

    Your Email
    {{ input('email', 'fromEmail', submission.fromEmail ?? '', {
        id: 'from-email',
        autocomplete: 'email',
    }) }}
    {{ submission ? _self.errorList(submission.getErrors('fromEmail')) }}

    Subject
    {{ input('text', 'subject', submission.subject ?? '', {
        id: 'subject',
    }) }}
    {{ submission ? _self.errorList(submission.getErrors('subject')) }}

    Message
    {{ tag('textarea', {
        text: submission.message ?? '',
        id: 'message',
        name: 'message',
        rows: 10,
        cols: 40,
    }) }}
    {{ submission ? _self.errorList(submission.getErrors('message')) }}

    Send

```

The only required fields are `fromEmail` and `message`. Everything else is optional.

### Redirecting after submit

[](#redirecting-after-submit)

If you have a `redirect` hidden input, the user will get redirected to it upon successfully sending the email. The following variables can be used within the URL/path you set:

- `{fromName}`
- `{fromEmail}`
- `{subject}`

For example, if you wanted to redirect to a `contact/thanks` page and pass the sender’s name to it, you could set the input like this:

```
{{ redirectInput('contact/thanks?from={fromName}') }}
```

On your `contact/thanks.html` template, you can access that `from` parameter using `craft.app.request.getQueryParam()`:

```
Thanks for sending that in, {{ craft.app.request.getQueryParam('from') }}!
```

Note that if you don’t include a `redirect` input, the current page will get reloaded.

### Displaying flash messages

[](#displaying-flash-messages)

When a contact form is submitted, the plugin will set a `notice` (Craft 4) or `success` (Craft 5+) flash message on the user session. You can display it in your template like this:

```
{% if craft.app.session.hasFlash('success') %}
    {{ craft.app.session.getFlash('success') }}
{% elseif craft.app.session.hasFlash('error') %}
    {{ craft.app.session.getFlash('error') }}
{% endif %}
```

### Adding additional fields

[](#adding-additional-fields)

You can add additional fields to your form by splitting your `message` field into multiple fields, using an array syntax for the input names:

```
Message
{{ submission.message.body ?? '' }}

Your phone number

What services are you interested in?
 Design
 Development
 Strategy
 Marketing
```

If you have a primary “Message” field, you should name it `message[body]`, like in that example.

An email sent with the above form might result in the following message:

```
• Name: John Doe
• Email: example@email.com
• Phone: (555) 123-4567
• Services: Design, Development

Hey guys, I really loved this simple contact form (I'm so tired of agencies
asking for everything but my social security number up front), so I trust
you guys know a thing or two about usability.

I run a small coffee shop and we want to start attracting more freelancer-
types to spend their days working from our shop (and sipping fine coffee!).
A clean new website with lots of social media integration would probably
help us out quite a bit there. Can you help us with that?

Hope to hear from you soon.

Cathy Chino

```

By default, there’s no restriction on which keys can be included on `message`. You can limit which fields are allowed using the `allowedMessageFields` setting in `config/contact-form.php`:

```