# Forms

<table data-view="cards"><thead><tr><th align="center"></th><th data-hidden data-card-cover data-type="image">Cover image</th><th data-hidden data-card-target data-type="content-ref"></th></tr></thead><tbody><tr><td align="center"><strong>Newsletter</strong></td><td><a href="https://1172126658-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgoStNEbk9Q25TX38NhdE%2Fuploads%2FkuO1mnDjNts1br7IuCPX%2FFox-BG%20Light%20-%202025-11-18T101230.959.jpg?alt=media&#x26;token=e28f0026-19ae-4da1-99ba-38b8d969dc48">Fox-BG Light - 2025-11-18T101230.959.jpg</a></td><td><a href="#newsletter">#newsletter</a></td></tr><tr><td align="center"><strong>Contact form</strong></td><td><a href="https://1172126658-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgoStNEbk9Q25TX38NhdE%2Fuploads%2FDRTNozYQ78hDQhfYgOBw%2FFox-BG%20Light%20-%202025-11-18T101654.536.jpg?alt=media&#x26;token=c87cb7d5-57d5-4154-b5c4-000361a82691">Fox-BG Light - 2025-11-18T101654.536.jpg</a></td><td><a href="#contact-form">#contact-form</a></td></tr></tbody></table>

<details>

<summary>Newsletter</summary>

<figure><img src="https://1172126658-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgoStNEbk9Q25TX38NhdE%2Fuploads%2FJVAfnLmQHmGmBVSJl8rE%2Fimage.png?alt=media&#x26;token=24e2bf5f-909b-4736-9d15-574ee305ea89" alt=""><figcaption><p>An example of a Group block that contain a Heading and a Newsletter</p></figcaption></figure>

The **Newsletter** block allows you to easily add a subscription form to your store, enabling users to sign up for updates, promotions, or newsletters.&#x20;

{% hint style="success" %}
Newsletter submissions are stored on the **Customers** page of your Shopify admin.&#x20;
{% endhint %}

#### ⚙️ **Block settings**

<table><thead><tr><th width="275">Setting</th><th>Description</th></tr></thead><tbody><tr><td><strong>Text alignment</strong></td><td>Choose the alignment of the text within the block.</td></tr><tr><td><strong>Newsletter term</strong></td><td>Add a rich text term or agreement that appears under the subscription form.</td></tr><tr><td><strong>Width</strong></td><td>Set the width of the newsletter block.</td></tr><tr><td><strong>Custom width</strong></td><td>Set a custom width (in %) if you selected the <strong>Custom</strong> option for <strong>Width</strong>.</td></tr></tbody></table>

{% hint style="info" %}
You can change the form placeholder text and success messages in the **Edit default theme content > Blocks > Email signup**.

![](https://1172126658-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgoStNEbk9Q25TX38NhdE%2Fuploads%2FKPZSkhlto4mtD9nmB5cO%2Fimage.png?alt=media\&token=3f2f5aa2-31ec-4477-8f22-b3b5bd187c65)

![](https://1172126658-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgoStNEbk9Q25TX38NhdE%2Fuploads%2FLrB95XZQnSvrffGuYsuv%2Fimage.png?alt=media\&token=e473e9a7-8cf0-49b3-8482-2b96275c3c81)
{% endhint %}

</details>

<details>

<summary>Contact form</summary>

<figure><img src="https://1172126658-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgoStNEbk9Q25TX38NhdE%2Fuploads%2FPbNsS11K2vSmjiop6Abp%2Fimage.png?alt=media&#x26;token=60c09fa0-03d9-4db3-93f7-a96552cb06ad" alt=""><figcaption></figcaption></figure>

The **Contact form** block enables you to add a functional contact form to your site, allowing users to submit inquiries directly.&#x20;

{% hint style="success" %}
Contact form submissions from are sent to your **store's sender email address**. You can find or change this sender email in your Shopify admin by going to **Settings** > **Notifications**.&#x20;

If you want to collect and manage contact form submissions more extensively, consider using the [Shopify Forms app](https://apps.shopify.com/shopify-forms), which allows you to view submissions in your admin and set up email notifications for each submission.
{% endhint %}

#### ⚙️ **Block settings**

<table><thead><tr><th width="275">Setting</th><th>Description</th></tr></thead><tbody><tr><td><strong>Width</strong></td><td>Choose the width of the form. </td></tr><tr><td><strong>Horizontal gap (Column gap)</strong></td><td>Adjust the gap between form fields horizontally.</td></tr><tr><td><strong>Vertical gap (Row gap)</strong></td><td>Adjust the gap between form fields vertically.</td></tr></tbody></table>

{% hint style="info" %}
Change the required fields' label and success/error message in the **Edit default theme content > Blocks > Contact form**.

![](https://1172126658-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgoStNEbk9Q25TX38NhdE%2Fuploads%2FPQaaRatPt6lmaGUeU7Ig%2Fimage.png?alt=media\&token=61e09339-2452-4430-b47f-46f12b46cf70)
{% endhint %}

#### Custom field block

The **Custom field** block is a private block that allows you to add custom fields to the Contact form.&#x20;

{% hint style="success" %}
Under the **Contact form**, click to add a nested **Custom field** block to it.
{% endhint %}

<figure><img src="https://1172126658-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgoStNEbk9Q25TX38NhdE%2Fuploads%2FSjUOKQ8ZdOcgSeaLL99u%2Fimage.png?alt=media&#x26;token=55804cd7-1dd6-448b-ba05-3677182f1826" alt=""><figcaption></figcaption></figure>

</details>