# Email signup

This section can include an optional image to enhance the visual appeal, increase brand awareness, and encourage customers to join your mailing list.\
With customizable layout, background options, and flexible content placement, it’s ideal for building your email marketing channel and fostering customer engagement.

<figure><img src="/files/9ItilU36pCQmbaQJ2cF5" alt=""><figcaption></figcaption></figure>

### **1, How to add section in theme editor:**

{% stepper %}
{% step %}
In your theme editor (**Customize**), scroll to the bottom of the template and select **Add section**.
{% endstep %}

{% step %}
In the list, locate and select **Email signup** section. The section will now be added to your page, ready for customization.
{% endstep %}
{% endstepper %}

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

### **2, Section settings:**

The **Section settings** allow you to control the layout, image display, background colors, and alignment.

* **Layout**: Choose whether to display an image alongside the Email signup form:

{% tabs %}
{% tab title="Image left" %}
The image appears to the left of the email signup form.
{% endtab %}

{% tab title="Image right" %}
The image appears to the right of the email signup form.
{% endtab %}

{% tab title="No image:" %}
Hides the image, displaying only the email signup form.

*<mark style="color:red;">(Screenshot)</mark>*
{% endtab %}
{% endtabs %}

* **Image**: Select the image that will appear in the section *if "**Image left"** or "**Image right"** is chosen in **Layout**.*
* **Image height**: Adjust the height of the image with options: **Adapt to image**: Retains the image’s original size. **Small**, **Medium**, **Large**, **Full screen**: Adjusts the height progressively from small to full screen.
* **Content alignment**: Set the alignment of the content on desktop to **Left**, **Center**, or **Right**.

### 3, Block settings:

The Email signup section includes several block types for customizing headings, descriptions, captions, and the email form itself.

* **Heading block**: Add a heading for the section. Adjust the heading font size with options from **Small** to **Extra extra large**.
* **Text block:** Add a description to provide more information under the heading.
* **Caption block:** Add additional content to the section with a caption. Choose from **Uppercase** or **Subtitle** for the caption style.
* **Email form block**:

{% hint style="info" %}
**Note:** *After customer added their email address to the Email signup section, their email address displays on the* [***Customers***](https://admin.shopify.com/customers) *page of your Shopify admin.*&#x20;
{% endhint %}

* **Show name field**: Enable this option to add a Name field above the Email field, allowing you to collect customer names in addition to their email addresses.

{% hint style="info" %}
**Note**: *When the **Show name field** option is enabled in the Email form block: Customers are required to provide both their name and email address. Their name will appear in the **Customers** page of your Shopify admin. To view more details, click on the customer’s name to access their profile, where you’ll see their email address. This setup helps you better identify your subscribers and personalize future email marketing efforts.*
{% endhint %}

* **Submit button text**: Enter the text that will appear on the submit button for the email form.
* **Button style**: Choose a style for the submit button with options for **Solid** or **Outline**.


---

# 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://help.byinspiredlabs.com/section/email-signup.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.