How to add an inline Flodesk newsletter signup form to your Squarespace website

PIN TO SAVE FOR LATER!

Today, we’re walking you through how to add an embedded inline newsletter signup form to your Squarespace website in just a few easy steps.

Why we love Flodesk (& 50% off!)

Flodesk is an intuitive email marketing platform with beautiful pre-made templates that allow you to create and send emails in minutes. It’s by far the simplest email marketing platform we have ever used — and we recommend it to all out clients looking for a new provider.

You can try out Flodesk free for a month with their free trial. If you want to continue with the platform, we have an affiliate link that will save you 50% off your monthly subscription for the first year.

Use our code STYLEDSQUARE to get 30 days free AND 50% off your first year of Flodesk!

Note: you will need a Business Plan or higher to add a Flodesk embedded form

Step 1:

LOGIN TO YOUR FLODESK ACCOUNT & CLICK ON “FORMS” IN THE TOP NAVIGATION

Step 2:

CLICK “NEW FORM” BUTTON TO CREATE A NEW FORM

Step 3:

CLICK ON “INLINE” UNDER THE FORM TYPES & CHOOSE STYLE OF CHOICE

Step 4:

CHOOSE A SEGMENT OR CREATE A NEW SEGMENT

An email segment is the division of email subscribers into targeted groups.

Eg. general list, newsletter, freebie, etc.

Step 5:

CUSTOMIZE FORM WITH PERSONALIZED CONTENT & BRAND STYLES.

Step 6:

WHEN THE DESIGN OF THE FORM IS COMPLETE CLICK “NEXT”

Step 7:

CHOOSE YOUR PREFERENCE OF SETTINGS IN THE “CUSTOMIZE” TAB

Step 8:

IN “EMBED” TAB, CLICK COPY “HEADER CODE”

Step 9:

IN YOUR SQUARESPACE WEBSITE, GO TO:
SETTINGS > ADVANCED > CODE INJECTION > PASTE UNDER “HEADER” > CLICK “SAVE”

Note: you will need a Business Plan or higher to add a Flodesk embedded form

Step 10:

1. IN YOUR SQUARESPACE WEBSITE, NAVIGATE TO THE PAGE YOU’D LIKE TO ADD YOUR INLINE EMBEDDED FORM.

2. PASTE THE TEXT IN YOUR CODE BLOCK

Step 11:

1. NAVIGATE TO FLODESK & COPY “INLINE CODE”

2. ADD A CODE BLOCK ELEMENT TO YOUR PAGE

Tadahhh!

REFRESH YOUR BROWSER. YOU SHOULD NOW SEE YOUR EMBEDDED FORM!

Note: make sure to test form thoroughly to make sure everything is working smoothly.

WEBSITE TEMPLATE SHOWCASED: PARISIAN

More tutorials