Create a pop-up form and add it to your website

1. Access your Email Marketing account

1. Log into you StayFi Account.
2. Click on Email Marketing on the left-side menu.

2. Add a pop-up form to one of your lists

1. Click Lists & subscribers, then click on the relevant list name.
   - If you want to import your subscribers to a new list, click on Create a list on the top-right corner.
2. Select Signup form builder from the left menu.

If your list already contains one or more signup forms, the most recently saved form will be loaded. To switch to editing your list’s pop-up form, click Select form type. In the dialog that appears, choose Pop-up form, then click Select.

3. Customize your pop-up form

Form

Under this tab, customize the sign up form displayed to potential subscribers. Note that this tab will need to be selected to access the Fields and Options sections, which we'll cover later in this document.

• Pop-up options – Adjust the overlay opacity, the timing for when the pop-up is displayed, and the close button color.
• Background – Set the pop-up’s background color.
• Heading and logo – Customize the heading text or optionally upload a logo image.
• Description – Add an optional description to your form and customize its font family, font size, and text color.
• Label – Set the font family, font size, and text color for labels.
• Button – Personalize your button by setting the text, font family, font size, background color, and text color.
• Checkbox – For forms with multiple options (select many) custom fields, multiple list opt-ins, or permission options, customize the checkbox font family, font size, and text color.
• Link – If your form includes policy links, you can adjust the font family, font size, and text color.

Fields

You can access this section while the 'Form' tab is selected.

If your subscriber list includes custom fields, they will appear below the default Name and Email fields. To add more custom fields, click Add new field.

Select the fields you want to include on your form, and check the Required box to make them mandatory. You can also reorder custom fields by using the drag handle on the left to move them up or down.

Success page

Under this tab, customize the message displayed to subscribers after form submission.

3. Save your pop-up form

Once you have finished customizing your form and are ready to add it to your site, follow the steps below. If you are simply updating an existing form, you will not need to update any code, simply click Save and then Yes, publish changes.

1. Click View code
2. In the dialog that appears, hover over the code then click Copy.
3. Paste the code into your website's HTML just before the closing </head> tag.
   1. Depending on how your site is built, you may need to download a plugin to insert the code.
   2. Pro tip: Include <meta name="viewport" content="width=device-width, initial-scale=1.0"> under the </head> tag of your site’s HTML to ensure optimal mobile rendering.
4. Click Save and publish to push changes live to your site once the code has been added.