explore

branding

web design

photography

warm coffee, sharp pencils, & good reads 

welcome to the blog

business

life

How to Add a Flodesk Pop-Up Form to Your Shopify Website

This video has been so highly requested and I am stoked to finally have this recorded and out in the world to help you add that final touch to your Shopify website.

Today we’re going over how to add a Flodesk pop-up form to your Shopify website, step by step, and taking you through all the coding hard parts (which I promise are really easy).

If you’re more of a visual person and love seeing how I do it all with a screenshare video, just click on the video below.

If you’re more of the reading instructions type, let’s get started –

Adding a Flodesk Pop-Up Form in Shopify

  1. Login to Flodesk
  2. Click “Forms”
  3. Click “+ Create New”
  4. Select the form you want and click “Customize”
  5. Design your form to fit your brand
  6. Once you’re done, click “next”
  7. Answer the following questions, clicking “continue” after each one
  8. Once you’re on the “Embed” section, click the black “copy” button
  9. Login to Shopify
  10. Click “Online Store”
  11. Click the drop down titled “Actions”
  12. Click “Edit Code”
  13. On the left, find the file titled “theme.liquid” and click to open it
  14. Search for the ending head tag which looks like this –“</head>”. The beginning head tag looks like this “<head>” and will be towards the top of your file. Follow that down until you see the ending head tag.
  15. Paste the copied code right above the ending head tag.
  16. Click “save”
  17. Refresh your site to see your new pop-up in action!

A couple of notes –

  • You can definitely have both an inline form and a pop-up form on your website. If your inline form code is already above the ending head tag just go ahead and place your pop-up form code right below the inline form code and above the ending head tag.
  • I know that Flodesk mentions that you need to add this code to every page, but the way that Shopify works and where we’re adding it refers to the theme as a whole so adding it in once is all that’s needed. No matter where someone lands first on your site, they’ll see your pop-up.

 Get 50% off Flodesk!

If you’re still on the free trial of Flodesk and haven’t upgraded yet, you can snag 50% off the subscription price with code KRISTENFULCHI, bringing the monthly plan down to $19 a month!

Leave a Reply

Your email address will not be published. Required fields are marked *