This tutorial will show you how to create a form that can ‘fly’ into a web page from the top, right, bottom, or left. Use this tool to create engagement with visitors to your website.

 

Hello everybody. This is Jimi Blevins coming at you with another tutorial.

Today we’re going to create a “Fly-In Email Lead Capture” form using the Bloom plugin from Elegant Themes. So I’m already in the Bloom page on the dashboard. All I need to do is come over here and click on, “New Opt-In,” and today we’re going to build a “Fly-In” form. Most of these settings are very similar for each one of these forms.

ScreenshotHotToCaptureEmailsW:AFlyInOptIn

 

So we’ll call this one, “Fly In Form,” and then we’ll go ahead and put in our integration. We’ve picked MailChimp, the account that we’ve already added in there. We want to grab our mailing list, so everybody that signs up for this form, they’re gonna get dropped into that mailing list.

ScreenshotHotToCaptureEmailsW:AFlyInOptIn2

 

So next step: Choose a template. There are lots and lots of great options to choose from, and of course ultimately customizable so you can configure it however you want. I’m just going to leave it on all the default settings.

 

Here we have the title, “Subscribe To Our Newsletter.” Here’s your “Opt-in Message,” this is your little bit of text to kind of encourage people to join in.

ScreenshotHowToCaptureEmailW:AFlyInOptIn3

 

We have our image settings, set on “Slide Up,” we can hide it on mobile if we want to. Here we can pick our “Background Color,” and we’ve also got font choices for the header font, text colors, square corners, rounded and we can also put a border on there.

 

“Form Orientation,” we can switch it so it’s on the right or the left.

ScreenshotHowToCaptureEmailsW:AFlyInOptIn4

 

Of course at any time if you’re going through this, you just hit this eyeball over here then it’s going to pop up the form and just kind of give you a quick preview.

 

ScreenshotHotToCaptureEmailsW:AFlyInOptIn5

 

So here’s the text that we want in the field for email. Here’s our: button text- “Subscribe,” “Form Orientation.”

 

Whether you want to round your corners on your forms, the color of text you want in there, if you want background colors, what color you want your button and then we’ve got our edge style and footer text. Then, of course, our “Success Message,” and any “Custom CSS” that you want.

 

Again, I just left it on the “Default Settings” but you know knock yourself out, go HAM and see what you can create with this.

 

So we can do our “Fly-in Orientation” I have it flying from the right. Let’s have it slide right. We’ll trigger it after a time delay, but let’s drop this down to 5 seconds, since it’s a tutorial, you probably don’t want to wait 20 seconds for it to load up.

ScreenshotHotToCaptureEmailsW:AFlyInOptIn6

 

So these “Load In Settings,” this is what triggers the form popping up. Right now I have it set where if they’re on a page after five seconds, it’s going to pop up. We can also have it set to do it after a certain amount of inactivity, we can have a trigger when they get to the bottom of a post, (which is already setup), we can trigger after scrolling; they want to scroll a certain amount of the page before it pops up, after purchase, trigger on a click, once per session; (that way it doesn’t keep popping up and annoying people), and can auto close on subscribe.

 

ScreenshotHotToCaptureEmailsW:AFlyInOptIn7

 

Now we get to our “Display On” settings, and this is where we actually want the form to display. What I’m going to do is, I’m going to put it on our “Blog Page.” I want it to display on “post.” You can see that brings up all these different categories.

 

ScreenshotHowToCaptureEmailsW:AFlyInOptIn8

 

can check off the categories I don’t want to show it. I’m going to leave it up on everything.

 

Now I come down to “Display On These Pages,” “Do Not Display On These Posts,” “Display On These Posts,” this allows you to really dial in where you want the form to pop-up and where you don’t. I’m going to go ahead and save this, and that will pop us back out into the main page.

 

ScreenshotHowToCaptureEmailsW:AFlyInOptIn9

 

Drop back into the website, and I’m just going to click on a blog page. Our form should pop up within five seconds just to show us. There it is, slid in beautifully, “Subscribe To Our Newsletter,” and pop my email address in there, “You Have Successfully Subscribed,” and then it drops out.

 

ScreenshotHowToCaptureEmailsW:AFlyInOptIn10

 

So that covers: “How To Put In Your Opt-In Form Using The Bloom Plug-In.”

 

Once again, my name is Jimi Blevins and thank you so much for watching.

Let's Get Started!

Enter your email address below to begin setting up your account.

You've completed the first step!

Connect With Us For More Epic Tutorials And Blog Posts

Connect With Us For More Epic Tutorials And Blog Posts

Accompany us on our journey of creation, design, and inspiration worldwide. 

Connection Successful... Welcome To The Wonderful World Of Mozaic Technology!