How to Create a Pop-Up Using Squarespace and ConvertKit

In this tutorial, I'm going to show you exactly how I use that little image that we created in a previous tutorial (HOW TO CREATE AN IMAGE OF YOUR PDF LEAD MAGNET THAT GETS PEOPLE TO OPT-IN ) to make our pop-up  look a little bit more dynamic.

 I'm also going to show you how I use that as image as my lead magnet in the systems of ConvertKit and Squarespace which essentially sets up my whole sales funnel.

(Written instructions from this tutorial can be found below the video tutorial.)


This is a gear list that I put together and I'm giving it away as my lead magnet in this example. (Enroll below for the actual gear list)


Get My Gear List. Do you want to know what I use to build my business? I'm sharing my essential and favorite tools. (See Image)

Then there's a little image and a place for someone to opt-in to it.

Now this is going to be a pop-up opt-in.

You can set this up in ConvertKit by clicking Forms > New Form. 

Now we're going to jump into the Settings. Add your image, and then click the little text box. Fill in and populate what your lead magnet is. Super simple. Click Save.

Business Basecamp Gear List -

If you want to make sure that your brand color is matched, the way you do that is right here. You can change it all up. You can use a specific hex code key. That's a six digit number off the numeric kind of code, Click OK. This is the color for The (Not-So-Secret)Secret Series, and changing this button color is one way you can make sure everything looks consistent with your branding.


Go to Main Settings. Name and organize all of my stuff by the type of form that it is. (A little secret sauce for you!)

This is a pop-up and it is my Get My Gear List lead magnet so I will title it Pop-up: Get My Gear List. ( I will create another opt-in form for this exact lead magnet but it will be embedded in the post so I will label it Post: Get My Gear List) This allows me to track which form converts best. Again, this is just something that I'm going to see in the back-end for personal organizational purposes.



On the backend of ConvertKit it is technically a form to embed on my site. Even though it's a "pop-up", it's a form to embed on my site because I don't want to have ConvertKit use their landing page. I want to use my Squarespace site.

Then the next thing I want to select is "redirect to another page". I don't want to show a success message. I really like saying thank you personally.

Next we will select the correct nurture sequence to follow up with. Now this is also something that we're going to get into in another tutorial: Nurture Sequences. I like Nurture Sequences and I want to make this sequence mandatory for anyone who subscribes to this particular pop-up.


Screen Shot 2017-06-06 at 4.13.08 PM.png

Add your email headline and message the will be received once someone opts-in to your lead magnet. (Tip: be sure to note that if you "duplicate" a form, to change the headline.)

Add the incentive download. You always want to make sure that "auto confirm new members" is checked. This is a very important thing to have checked here at the bottom. (Otherwise things get sticky with tags and labels.)

Style is the next option you should see. This is where you can actually choose to display it as a pop-up or as a static non-moving form. This would be like in a blog post or on an actual sales page or opt-in. I want to set up a pop-up using ConvertKit on my Squarespace site, and the way you do this is by clicking the Modal option in the center.


That means the pop-up is going to come up and everything else is going to fade to dark in the back. It's only going to show up when someone has "exit intent", meaning if it looks like they're getting ready to exit the page, their mouse is moving to hoover up near the top, that's when it's going to pop-up. So it's not obnoxious. I don't love pop-ups but I do love pop-ups. I have a love hate relationship with pop-ups. I don't like to experience them. I like how they grow my list.

However, because I don't want to be obnoxious to people and I DO want them to come back and look at things on my site, this is a very important place right here at the bottom. What should we show to return visitors who have already subscribed? I want to hide the form. I'm not going to try and ask for email again if you've already put it in and you've already gotten the business year list. That makes a lot of logical sense, but if you don't know that you have that option, it could be a turn off to your visitors. Click the Save the Form.


Then I'm going to embed it onto my Squarespace website. Now the way I like to do it is through JavaScript. You have different options for WordPress. You can use Raw HTML if that's your preference, but JavaScript means if I make any changes in here in ConvertKit, it's automatically going to show up on my Squarespace site. If I use Raw HTML, it's not going to do that. All I have to do is simply copy, paste, jump onto the back into my Squarespace website, scroll to the bottom of where like I to put this is in the middle footer block. When I do that, it's going to give me my options.

If you're not familiar with Squarespace, Squarespace uses building blocks, so what I'm going to do is I'm going to select the code block in my footer.  Then I'm going to copy, paste the Javascript Code and click apply. Now it's going to be temporarily invisible. You're not actually going to see anything down here.  When I go to refresh, you're not actually going to see anything here at the bottom. If I go to my actual website, you're not going to see anything at the bottom. There's actually a code in there.  When I go to have exit intent, it's going to pop-up!

When it does, at this point you could enter in an email address, and the lead magnet gift would automatically show up in an inbox. After that, a Nurture Sequence would begin. You've got a pretty sweet funnel now!

That is how you set up a lead magnet pop-up using ConvertKit and Squarespace!


Get my full list of tools!