Transcript of How to Set Up a Scroll Box Opt-in With the Plugin Scroll Triggered Box
Hey there everybody.
So we are progressing in optimizing this little site to become an amazing lead magnet. And I wanted to – this is going to actually become more of a slider than a pop-up, but it’s a pop-up-esque feature. It works really well and it just could not be simpler to set up.
So let’s go into “Dashboard”. And the first thing we’re going to do is add this little free plug-in. So let’s go to “Plugins – Add New”. This is called “Scroll Triggered Boxes”. It’s very similar to a pop-up, it’s a little bit less invasive.
So I know a lot of you are really resistant to the idea of pop-ups and so I wanted to kind of bring you into it slowly. This is very effective, it has all the nice controls. It’s a snap to set up. Frankly, you’re going to have a lot of extra time if you had allocated an hour to this. So let’s – there’s “Scrolled Triggered Boxes”. We’ll do “Install Now”. So let’s go to “Active Plugin”. And it’s done, yay. There you can see it has appeared.
Next thing we want to do is to grab some code that creates our little opt-in boxes. So I’m going to go to “Appearance – Widgets” and grab that footer code again., And so this is, as you know very well, this is the code that creates our opt-in box. We’re doing this because, again, MailChimp only lets you have one opt-in form that you can put in a whole bunch of different places. If I was using Aweber or GetResponse or basically any other email service provider, I would create a brand new opt-in form for this so I could track it separately. But I can’t do that so we’re going to have to, you know, just deal.
Let’s go to “Add New”. We’re going to do “Text”. This is very important, you want “Text”, not “Visual”. Paste this in. We’re going to call this, just in case someone can see it, “Sign up”. Lovely.
And so now we are going to tweak our settings for this. We want it to appear everywhere, we want it to appear on the bottom right.
This is “% of page height”. Now when I first read that, I thought it meant that the box is going to be this tall. What that means is how far down on the page it is. Because we’ve got an opt-in box in the footer, you don’t want it to be a hundred percent. I find that eighty percent seems to work pretty well. Maybe seventy-five because these pages are a little bit shorter.
I don’t want the “Fade in”, I want the “Slide in” because I just like it. This is after they close the box, how long will it stay closed before it prompts them again to sign up? Let’s put that at two days. I do not want to auto-hide it, I want it to keep appearing. That’s fine as it is.
Let’s do “Background color”. Let’s make sure we can see “Background color”. Make it white. The border color should also be white. Lovely. Border width, I guess we’ll make it fifteen. Box width, I would say let’s start with three hundred. And so that’s all we have to do.
And let’s go “Publish” and see what we get here. So it has published.
Let’s go over to – so this is the blog main page. And there’s a lot of scrolling here, so it’s a good way to demo this. And, as you can see when I get down here, there it is.
Now clearly that could be – you know, I’d love to have a red button and maybe an image, but that’s just all it is. But it works, you know, there’s no reason to do anything more with it. It works right out of the box. And it’s a pop-up in – how long did that take? Was it even three minutes?
I like it a lot. It’s really simple, the conversion rates for it are great, it’s free. It’s awesome.
So that’s, you know, how to add a pop-up. Sorry it’s so short but I’m sure you’ll find something else to do with the rest of your hour. And there’s, of course, more resources and I’m going to reviewing a bunch of other pop-up plug-ins and so this is just the very first one. We’re going to do OptinMonster because that’s huge. Pippity is kind of a classic so let’s use that. And then, of course, if you’re using something besides MailChimp, Aweber has a pop-up feature, so does GetResponse.
Pretty much every email service provider has some kind of pop-up function. MailChimp actually does but theirs is so complicated to install that I just thought I’d be kind to all of us and not make you have to go through advanced coding, because it’s kind of tricky. As you can see, on the shorter pages here, this kind of pops up, basically, at the beginning.
So, yeah, you want to, you know, work with your page lengths and see when it comes up. See, that may be too low. So I might want to go in and edit this box and maybe have it show up at like seventy percent. Because I don’t want it to show up when they’re already seeing the footer header anyway. So a little tweaking.
You’ve certainly got lots of time to, you know, make it look pretty. And that’s really how easy it is. I’ll see you in the next video. Take care. Bye.