How to add a popup form to your Weebly website

A step-by-step guide to embedding a Flodesk popup form on your Weebly website.

Flodesk forms help you capture your visitors’ email addresses so you can grow your list and stay connected with your audience.

Popup forms appear on top of your website content and encourage visitors to subscribe to your newsletter, freebie, or updates. Once installed, the popup can appear across your entire site or only on specific pages.

This guide walks you through how to add your Flodesk popup form to a Weebly website.

Make sure you have:

• A popup form created in Flodesk

• Access to your Weebly website editor

The popup form works by adding a small piece of code (called the header code) to your website.

1. Log in to your Flodesk account.

2. Go to Forms.

3. Create a Popup form.

4. Customize the design, text, and settings.

When your form is ready, click Embed.

You will see the Header Code. Copy this code — you’ll add it to your Weebly site in the next steps.

If you want your popup to appear across your whole website, add the header code to your site settings.

1. Log in to your Weebly account.

2. Open your website editor.

3. Click Settings in the top menu.

4. Select SEO.

5. Paste the Flodesk header code into the Header Code field.

6. Click Save.

Your popup form can now appear across your entire website based on the display settings you configured in Flodesk.

If you want the popup to appear only on one specific page (for example, a landing page or About page), add the code to that page’s settings.

1. In Weebly, click Pages.

2. Select the page where you want the popup form to appear.

3. Click SEO Settings.

4. Paste the Flodesk header code into the Header Code field.

5. Save your changes.

Your popup will now display only on that page.

In the example below, we selected the “About” page where we want the pop-up form to appear.

To add a popup form to your Weebly website:

1. Create and customize a Popup form in Flodesk.

2. Click Embed and copy the Header Code.

3. Paste the code into your Weebly site:

• Site-wide: Settings → SEO → Header Code

• Single page: Pages → SEO Settings → Header Code

Once the code is added, your popup form will appear according to the display settings you chose in Flodesk.

Check the following:

• The header code was copied completely from Flodesk

• The code was pasted into the correct Header Code field in Weebly

• Your popup display settings allow it to appear on the page you're testing

• Your site changes have been saved and published

You may also need to refresh your browser or test in an incognito window.

Yes. Instead of adding the code site-wide, paste the header code into the SEO settings for a specific page. The popup will only appear on that page.

No.

• If you add the code site-wide, you only need to paste it once in the site settings.

• If you want the popup on specific pages, add the code to those individual pages.

Yes. Popup timing, triggers, and display behavior are controlled inside the Flodesk popup form settings.

For example, you can choose to show the popup:

• Immediately

• Time delay

• Scroll percentage

Yes. Flodesk popup forms are mobile-responsive, meaning they automatically adjust to display properly on phones and tablets.