# Contact form

<figure><img src="/files/vNONiXZjx754WVb5W9yH" alt=""><figcaption></figcaption></figure>

The Contact form section helps you stay connected with your customers effortlessly. Whether they have questions, feedback, or support requests, this form makes it simple for them to reach out. 📩

{% hint style="info" %}
Your contact form sends all submissions to the **sender email address** of your store. You can change the sender email address in the [**Notifications**](https://admin.shopify.com/settings/notifications) settings page of your Shopify admin.
{% endhint %}

## How to add a Contact form section to your Shopify store

{% hint style="success" %}
Steps:

1. In the theme editor **(Customize)**, click **Add section.**
2. Locate **Contact form.**
3. Make necessary changes.
4. **Save.**
   {% endhint %}

## How to edit a Contact form section

The form comes with default fields: **Name, Email, Phone - which cannot be deleted**.

Among them, the Email field is required for customers to fill in.

{% hint style="info" %}
Default wordings of the default fields can be changed in **Actions > Edit default theme content.**

![](/files/yevHRVsIpOyjfRqpirdf)
{% endhint %}

<figure><img src="/files/7SrmnjZEHBqkmDNySyuF" alt=""><figcaption></figcaption></figure>

In addition to the default fields, you can add [custom fields](#custom-field) to gather extra information or a [sidebar](#sidebar) next to the form.

<figure><img src="/files/eba4Ge47xxyw4XKRTZNd" alt=""><figcaption></figcaption></figure>

### Custom field

For each of the custom fields, you can customize the following elements to improve the user experience:

* **Field type**: Select the supported format for the field input.

  * Text: For short responses like names, subjects, etc.
  * Textarea: Ideal for collecting longer responses, such as inquiries or detailed feedback.
  * Phone: Collect customers' phone numbers for contact purposes.
  * Select (dropdown list): Allow customers to choose one from predefined options.

  If you select this field type, add the options below. Separate them by commas.

  <figure><img src="/files/TWzEDo1v6pH4m6Zd13lP" alt=""><figcaption></figcaption></figure>

  * Checkbox: For consent agreements, terms acceptance, or opt-ins.

  If you select this field type, define values for the checked option and unchecked option.

  <figure><img src="/files/Shn0UBfkMPCjT8JCqr8a" alt=""><figcaption></figcaption></figure>

  * Radio: Let the customer select a single option from a set of predefined choices.

  If you select this field type, add the options below. Separate them by commas.

  <figure><img src="/files/0hCdAe6JKAIOBC4u4ohf" alt=""><figcaption></figcaption></figure>

### Sidebar

You can add a **Sidebar** to your contact form to provide additional information such as business hours, contact details, and store locations.

<figure><img src="/files/zNMCy5jMH2tt5qw1E0Qw" alt=""><figcaption></figcaption></figure>

* **Position**: Choose whether the sidebar should appear (on the left or right side of the form).
* **Content**: Add the sidebar content to show customers what is it about.
* **Icon with text**: You can add up to 3 icon with text items to the sidebar.
* **Button**: Add a button with a custom link at the end of the sidebar.

***

<figure><img src="/files/6RW1JWuKNf9ovVFLkLXc" alt=""><figcaption><p><a href="https://apps.shopify.com/xflow?utm_source=foxecom&#x26;utm_medium=help_center_hyper&#x26;utm_campaign=banner">Install XFlow Back In Stock Automation FREE</a></p></figcaption></figure>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.foxecom.com/hyper-theme/theme-sections/contact-form.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
