How to create an Inline Form in AVADA?

An inline form is inserted right on your website pages that asks for customer email or phone number.
To collect more leads and follow up later, creating an eye-catching inline form is very crucial. Now let's get started!

Step 1: Create an Inline Form

From the App Dashboard, go to Forms > click on the Create button. 



Select the type Inline > Select Inline Form template

A preview of Subscribe and Thank you page of the template will be shown. You need to click on the Select Template button to continue.

Step 2: Design the Inline Form

Here you will customize the content of the Subscribe and Thank you page for the form.



To edit, you can click on the element on the preview Inline Form or double-click on the corresponding fields at the Components tab on the left. 

2.1. General

- Font family: Select a font to display for the form
- Text Align: Select the display type of popup content: left, right or center align
- Background color: Select a color for the background of the form

2.2. Heading

Here customize the content displayed for the form's heading. 

- Content: Enter the text displayed for the heading
- Color: Select a color for the heading
- Font size: Customize the font size of the heading
- Font weight: Customize the density of the heading
- Letter Spacing: Customize the spacing between letters
- Line Height: Customize the spacing between lines

2.3. Body text

Here customize the display content for the inline form's body text

- Content: Enter display content for body text
- Color: Select a color for the body text
- Font size: Customize font size for body text
- Font weight: Customize the weight of the text
- Letter Spacing: Customize the spacing of letters
- Line Height: Customize the spacing between lines

2.4. Form

On the Form section, click on the Edit icon or double-click, select the fields you want to display on the Subscribe page of the inline form. 



- First name: Enter the text displayed in the first name placeholder



- Last name: Enter the text displayed in the last name placeholder



- Phone number: Enter the content displayed in the phone number placeholder



- Email: Enter the text to display in the email placeholder



- Button:

+ Button content: Enter the content to display on the button

+ Color: Select color for button text

+ Background color: Select a color for the button's background

Step 3: Trigger of the Inline Form

Here you will select where to display the inline form on your store frontend. There are two ways to choose a place to display the inline form. 



Method 1: Copy selector the position you want to display the inline form and paste it to the position field. 



Step 1: Go to one page > Right-click > Inspect > Enter the inspect mode

Step 2: Select the element you want to display in the inline form above/below. Right-click >  Copy > Copy Selector. 

Step 3: Copy the selector to the inline form position input then it should be good to go.



Learn more: How to choose a Custom Click Trigger for a popup?

Method 2: Copy and paste the code snippet below to your theme.

Step 1: Copy snippet code



Step 2: For Shopify stores, please go to Admin > Themes > Action > Edit code.



Step 3: Insert the snippet into the position you want to display the inline form > Click Save 



Where to show

Select the page to display the campaign

- All pages: Popup displayed on all pages
- Specific pages: popups are only visible on pages that satisfy the added condition. Enter the URL and select conditions for those pages. Click Add to add the condition.

Step 4: Settings

- Email validation: If checked, Use email validation for my campaign will allow only existing emails to submit popup. This to avoid spam emails.
- Tags: Add a tag to the contacts obtained by the popup
- Double opt-in: When you enable this when a customer subscribes, a confirmation email is sent to the customer.\
With the popup with Double opt-in enabled, the email contact received will have the status of Not confirm. When the customer clicks verify at the confirmation email, the status will be changed to Subscribe. 

Click on the Let me configure button to customize the Double opt-in. 



- Email: You can edit and preview the confirmation email here

- Toast: Customize the content for toast here. Toast will be displayed when the customer clicks on the Submit button of the inline form with double opt-in enabled. 



- Confirmation page: 

Customize the confirmation page here. The confirmation page will be shown after the customer clicks on the verification link in the recieved confirmation email. 



- Click Save & Next to continue

Step 5: Ready

- Campaign Name: Enter a name for the campaign



- Next,  clicking Save will display a popup for you to choose the status of the popup.

+ Keep as draft: Campaign will be saved but not displayed in the store

+ Go live: Allows popups to be displayed right on the store

View Inline Form report

Click the respective campaign at each campaign to view the report and edit the campaign. 



Report: Here the statistics about the campaign are shown. 

- Impression: The number of frontend popup impressions
- Conversion: Number of emails collected from the inline form
- Conversion rate: Conversion rate compared to impressions

Edit Inline Form

- Campaign status: Enable / disable campaign
- Click on the preview popup or Design button to be able to edit the display content of the inline form
- Click Edit trigger if you want to modify the trigger of the inline form
- Click Edit settings to modify the settings of the inline form

Updated on: 18/08/2021