# Sending emails to specific department for WordPress contact forms

{% @supademo/embed demoId="QrM6ME2cWH\_EP2X-JIrQF" url="<https://app.supademo.com/demo/QrM6ME2cWH_EP2X-JIrQF>" %}

Let's assume you have multiple departments within your company that handle different inquiries.

For instance, you might have a **Sales** department sales<img src="https://852124118-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fl6Kz0R6S7z3Fb6KLZYVE%2Fuploads%2FCrUL7KDPV8tOallqKOeJ%2Fimage.png?alt=media&#x26;token=b3311de0-a36b-47bc-b439-f5b386fe8856" alt="@ sign" data-size="line">company.com and a **Product support** department support<img src="https://852124118-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fl6Kz0R6S7z3Fb6KLZYVE%2Fuploads%2FCrUL7KDPV8tOallqKOeJ%2Fimage.png?alt=media&#x26;token=b3311de0-a36b-47bc-b439-f5b386fe8856" alt="@ sign" data-size="line">company.com.

When a user fills out the form you might ask the user if the inquiry is about sales or support.

Based on the selection you can then send it to the corresponding E-mail address.

There are multiple ways to accomplish this but the easiest way to do it is to add a dropdown named "department" and adding 2 items like so:

<div align="left" data-full-width="false"><figure><img src="https://852124118-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fl6Kz0R6S7z3Fb6KLZYVE%2Fuploads%2FPuhDTPBBqc8u2HgZMarG%2Fdefine-department-email-addresses-for-dropdown-element.png?alt=media&#x26;token=7fb3ed0f-2b3c-448e-9073-beea5cd7cef4" alt="Define each department email address for the dropdown element"><figcaption><p>Define each department email address for the dropdown element.</p></figcaption></figure></div>

Now you can set the "Send email to:" setting to retrieve the value from the dropdown by calling the **{department}** tag. This will either have the value "sales<img src="https://852124118-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fl6Kz0R6S7z3Fb6KLZYVE%2Fuploads%2FCrUL7KDPV8tOallqKOeJ%2Fimage.png?alt=media&#x26;token=b3311de0-a36b-47bc-b439-f5b386fe8856" alt="@ sign" data-size="line">company.com" or "support<img src="https://852124118-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fl6Kz0R6S7z3Fb6KLZYVE%2Fuploads%2FCrUL7KDPV8tOallqKOeJ%2Fimage.png?alt=media&#x26;token=b3311de0-a36b-47bc-b439-f5b386fe8856" alt="@ sign" data-size="line">company.com".

<div align="left" data-full-width="false"><figure><img src="https://852124118-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fl6Kz0R6S7z3Fb6KLZYVE%2Fuploads%2F9jHQlGoPv3VlciaNaBGo%2Fsetting-email-to-header.png?alt=media&#x26;token=e3990df5-8f55-43ba-810a-f8a1e8271921" alt="Set the dropdown field name tag as your E-mail to header for your Admin email."><figcaption><p>Set the dropdown field name tag as your E-mail to header for your Admin email.</p></figcaption></figure></div>

The above example works just fine, however it is good practice to not expose an E-mail address directly into the source code of a web page (to prevent spam, because of bots being able to index it).

This is where the build in **Secrets** system comes into play.

You can configure secrets like below. This will allow you to set the dropdown values to be **{@sales\_email}** and **{@support\_email}** which will not expose the E-mail address in the source code. But by calling **{department}** tag it will replace the underlaying value with the actual E-mail address server side.

First go to the "Secrets" tab, and configure your secrets like so:

<div align="left" data-full-width="false"><figure><img src="https://852124118-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fl6Kz0R6S7z3Fb6KLZYVE%2Fuploads%2FETuDs0K1wWUczh0dbQuw%2Fsecurely-configure-email-addresses-secrets-for-email-departments.png?alt=media&#x26;token=bdfd6ce7-3fe3-482f-9441-7bf7666d51f6" alt="Define email addresses under secrets for secure use"><figcaption><p>Define email addresses under secrets for secure use.</p></figcaption></figure></div>

After configuring the secrets, you can edit your dropdown and set the values to the secret tags like so:

<div align="left" data-full-width="false"><figure><img src="https://852124118-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fl6Kz0R6S7z3Fb6KLZYVE%2Fuploads%2F5H7zKOCvARGK1wihR5TN%2Fsetting-secret-tags-as-values-for-each-department-dropdown-items.png?alt=media&#x26;token=105bf99a-1a75-4100-8cb9-fb64faf3f62f" alt="Define secret tags as dropdown values for the department dropdown"><figcaption><p>Define secret tags as dropdown values for the department dropdown.</p></figcaption></figure></div>

Demonstration on how to configure this from scratch:

<div align="left" data-full-width="false"><figure><img src="https://852124118-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fl6Kz0R6S7z3Fb6KLZYVE%2Fuploads%2FaVipP1dF9QENCWyRoAfz%2Fdemonstration-on-how-to-define-secrets-for-a-dropdown-element.gif?alt=media&#x26;token=6c7ebd75-32c0-4d85-ae63-ce9b48a22459" alt="Demonstration on how to define secrets for a dropdown element."><figcaption><p>Demonstration on how to define secrets for a dropdown element.</p></figcaption></figure></div>
