# Subscribe form
A Subscribe form is a powerful tool to connect with your audience, build your mailing list, and drive engagement.
## How to add a subscribe form
{% hint style="success" %}
**Steps:**
1. In the FoxStudio editor, on the left Sidebar > Click **Add elements**, or press **E**.
2. Select **Forms** > **Subscribe form** or in **Quick add**, select **Subscribe form**.
3. Drag the Subscribe form onto your canvas.
{% endhint %}
## How to edit a subscribe form
{% hint style="success" %}
**Steps:**
1. **Select** the relevant subscribe form element in the editor.
2. Use the tools bar above the selected subscribe form element to quickly edit it.
All the formatting tools below can be found in the right-handsided **Inspector** panel.
{% endhint %}
### General settings
* **Placeholder**: Enter the text you want to appear inside the email input box (e.g., “Enter your email”).
* **Button label**: Enter the button label field with your preferred text, such as "Join Now" or "Get Updates".
* **Button icon**: Click on **+ Select icon** to add an icon to your subscribe button. Choose an icon from the library to enhance visual appeal.
* **Button style**: Apply a pre-designed button style as set in [global-styles](https://docs.foxecom.com/foxify-app/page-management/global-styles "mention").
* **Custom tags:** Add custom tags to subscribers collected through this form. These tags will automatically appear in the Customer profile > Tags section in Shopify when customers successfully subscribe.
#### Success
**Confirmation behavior:** Choose what happens after a customer successfully subscribes with 2 options:
* **Show message:** Display a custom confirmation message after the customer subscribes.
* **Redirect to URL:** Redirect subscribers to a specific page.
{% tabs %}
{% tab title="Show message" %}
{% endtab %}
{% tab title="Redirect to URL" %}
{% endtab %}
{% endtabs %}
### Design settings
{% hint style="success" %}
Target specific parts of the Subscribe form for customization:
* **Element container**: Overall form wrapper
* **Form input**: Email input field
* **Submit button**: Subscribe button
* **Submit button hover**: Button appearance on hover.
{% endhint %}
{% tabs %}
{% tab title="Element container" %}
* **Form layout**: Horizontal /Vertical
* **Input & Button height**: Adjust the height of the input field and button for better visual alignment.
{% endtab %}
{% tab title="Form input" %}
Adjust the text style of the form input text.
{% endtab %}
{% tab title="Submit button" %}
Style the submit button.
{% endtab %}
{% tab title="Submit button hover" %}
Adjust the button's colors when hovering.
{% endtab %}
{% endtabs %}
{% hint style="info" %}
**Pro tips** :thumbsup::
* Keep the placeholder text clear and actionable (e.g., “Subscribe for updates”).
* Use contrasting button colors to make the form stand out.
* Test the form on both **desktop** and **mobile devices** for responsiveness.
{% endhint %}
### Animations
{% content-ref url="../layout-and-styling/animations" %}
[animations](https://docs.foxecom.com/foxify-app/foxstudio/layout-and-styling/animations)
{% endcontent-ref %}
---
# 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/foxify-app/foxstudio/add-and-edit-elements/subscribe-form.md?ask=
```
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.
/Vertical 
