--- title: "Embed a Web Form in Chat" slug: "embed-a-web-form-in-chat" description: "Embed a web form (via iframe) in Glad App employing tools like Jotform and Formstack through the Office Hours & Throttle Message text box." updated: 2025-10-02T22:14:01Z published: 2025-10-02T22:14:01Z --- > ## Documentation Index > Fetch the complete documentation index at: https://help.gladly.com/llms.txt > Use this file to discover all available pages before exploring further. # Embed a Web Form in Chat | **REQUIRED USER ROLE** Administrator | **PERMISSION OVERVIEW** [View permissions by role](https://help.gladly.com/docs/managing-users-and-roles#roles-and-responsibilities) | | --- | --- | Embed a web form (via iframe) in Chat for a website or non-native mobile apps employing tools like Jotform and Formstack through the **Chat Unavailable Message** text box. For example, you can embed a form to collect a Customer's name, contact information, and message if chat is currently unavailable so you can reach out to them when you're available. ![Contact form requesting full name, email, and message submission for inquiries.](https://cdn.us.document360.io/7047b671-c4f2-4df0-bb0a-b9b511fd2452/Images/Documentation/webform_sample.webp) ## How form entries are received This depends on how the form is configured. It may be configured to receive the form details via email in Gladly or outside of Gladly. In most cases, it's best to receive this information in Gladly so details like a Customer's email address or phone number can be matched with a Profile in Gladly when the form is submitted. If the form is configured to send the form data as an email and it sets the Customer email address in the reply-to header, the data is sent to your email endpoint (i.e., *form@customer.com*, not *form@customer-com.gladly.email*). Then, it maps to the correct Customer Profile when it comes in (*form@customer.com* is already configured as an endpoint in Gladly). If you set the**Reply-To** header as *NAME *, the name will come into the Profile for a new Customer, along with the email. If there's not a match, a new Customer Profile is created. If you set it as *email@email.com*, the name will not come in, but the email will still be in the Customer’s Profile on Gladly. Please inquire with your form provider to find out what they support. ## Create a form Create the form using your desired web form tool, such as Jotform and Formstack. Make sure the form is publicly accessible from any browser. Once created, you'll need to create an iframe for the form. ### Create iframe A form is accessible in Chat using the ``` In the sample code above, the URL "https://form.jotform.com/220186080477153" is the source URL to access the form. Next, you'll need to embed the iframe code to Chat. ### Embed form in Chat 1. Click ![](https://cdn.us.document360.io/7047b671-c4f2-4df0-bb0a-b9b511fd2452/Images/Documentation/hamburger-menu-icon(2).svg) on the top left corner of the screen. 2. Click **Settings**. 3. Under the **Channels**category, click **Chat**. The Chat page will show you a list of Chats you currently have. 4. Hover over the Chat you want to edit, click ![](https://cdn.us.document360.io/7047b671-c4f2-4df0-bb0a-b9b511fd2452/Images/Documentation/kebab-icon-vertical.svg), then select **Configure**. 5. Scroll down to the **Text** section and find the **Chat Unavailable Message**field. 6. Add your iframe in the Message text box. The iframe code can be the entire contents of that message. It can be embedded among other [HTML tags](https://help.gladly.com/docs/glad-app-configuration-tips#chat-unavailable-message-html-or-plain-text) or a plain text message. | **Message with form and HTML tag** | **Message with HTML tag and no form** | | --- | --- | | ![Contact form with fields for name and email, and a message about missed communication.](https://cdn.us.document360.io/7047b671-c4f2-4df0-bb0a-b9b511fd2452/Images/Documentation/iframe-embed-sideick-form-example.webp) | `` |