how to create a pop up in shopify

hey team welcome back i hope everyone is,doing well now today we're going to,follow on from our last pop-up form,tutorial,however this time we're going to cover,how you can use clavio,to create a free pop-up form for your,shopify,store now by creating pop-ups on your,shopify store,you can quickly capture your visitors,attention and drive sign-ups,engagement and also promote special,offers as soon as visitors,land on your website okay now before we,launch into today's tutorial consider,subscribing if you haven't done so,already,and that way you'll stay updated with,actionable videos and tutorials,designed to equip you with the skills,knowledge and tools,to grow your small business online and,without wasting any more time let's go,ahead and create a free pop-up form,for your shopify store with clavio,okay so let's get started first things,first what we need to do,is log into our shopify store now today,what we're going to do,is connect to an application called,clavio,now clavio is an all-in-one email,marketing,service and what we're going to do is,connect clavio,with shopify and then create a pop-up,with,clavio and that's going to allow us to,create a free pop-up form,for our home page and that is the focus,for today's beginners tutorial,so what we need to do is navigate over,to apps,then simply navigate over to shop for,apps,here we want to come down to the search,bar and type in clavio,and then hit search and then come down,and locate,clavio simply click add app,and then scroll down and click install,at,here we need to go ahead and create an,account simply add your email,create a password and then click,continue with integration,then simply add your brand information a,lot of this information will be,automatically generated based on the,information you provided to,shopify over here you want to make sure,that you add,your sender email address now this can,be related to your brand it doesn't need,to be a proper email address at the,moment,you can change this later however this,is your email address where your emails,will be sent,from then come down and click continue,here you have the option to design your,email templates,now for the purpose of this tutorial,what we're going to do is skip this,part however if you want to watch a,complete clavio tutorial for beginners,that covers everything from email,marketing to landing pages,to email automation then feel free to,watch the tutorial up above that will,take you through the complete clavio,tutorial however today we're just going,to focus on the pop-up,form so come down and click continue and,then just simply head over to your email,inbox the email that you use to sign up,to clavio,and verify your email we're going to go,ahead and do that now,and then once you've confirmed your,email you will arrive on your clavio,dashboard here what we want to do is,actually navigate over to lists,and segments here what we want to do is,create,a list simply navigate up to create list,and then come down to list and then come,up here and add a list,name for the purpose of this list it's,going to be our subscribers,that sign up to our pop-up form the,pop-up form that we're going to create,with clavio so the name is going to be,pop-up,subscribers then come down and click,create,list and then head over to create a sign,up form,then simply click create sign up form,and then under create form come down,to type and select pop-up then over here,we have the option to create a pop-up,from scratch,or we can come down and scroll through,all these different pre-made templates,that we can build from now if you're a,complete beginner i recommend scrolling,through,all these different pre-made templates,and then selecting one,and customizing it the way that you like,so for us we're going to come down,and let's see find one that works best,for us i like the look,of let's go with this one here and i'm,going to select this pre-made template,and then simply name your form for us,we're going to call this pop-up,and then come down and click a,subscriber list for us we're going to,select,pop-up subscribers this is the list we,created for this pop-up form,whenever someone signs up to this pop-up,form they're going to be added to,the pop-up subscribers list that we,created,so click on the list that you created,and come down and click create form,and this is where we can go ahead and,create our pop-up form,now clavio's builder is very,straightforward and easy to use,basically you have access to these,blocks that you can simply drag and drop,onto your pop-up form or really any,template that you're building and you,can create your form like that,for example if i wanted to add an image,i could simply,click this image block and drag that,over to my form,and place that where i like for example,i could place it under,this bit of text and as you can see that,simply adds the image block you can do,this with any block simply drag,and drop on the left hand side you can,see all these different editing options,for example i can change,the block style i can change the image,click,action for example if a visitor clicks,on the image i could send them to a,product,page however i'll leave that blank and,up here i can add an,image however for the purpose of this,pop-up i want to keep it quite simple so,to do that i'm going to come down,and i'm actually going to remove this,block element by clicking delete,block and then back over here i can,select any of these other block elements,however what i want to do is navigate,over to my form and get rid of this,section here,as i want to keep my form very simple,and then what i want to do is change,this text by simply clicking on the text,element,and coming up here and changing this,text i'm going to change it to,get 20 off and then i'm going to,navigate up to the formatting options,and come down,and change the size to 48. i'm happy,with that now with the text down here,i want to change that to sign up and get,20,off your first order i'm happy with that,and as you can see,all your changes will be automatically,saved then navigate over,to back and i'm happy with that there's,a few more things i want to change for,example i want to change the text on,this button,i want to navigate over to button text,and change this to,get my discount and then down here,there's a few more style settings for,example button style and block styles,you can change that,if you like and next to action we have,submit form,below this we have list to submit when a,subscriber,submits this form their information is,going to be sent to our pop-up,subscribers list below that we have,after submit,show success message if we like or we,can go,go to url or close form now if you click,show success message you can navigate,over to success message over here,and you can change your success message,if you like however what we want to do,is actually remove the success,message you can keep it if you like but,for the purpose of this tutorial we're,just going to remove,the success message navigate back to,subscriber form come back down to the,button,and on the left hand side what i want to,do after submit,is show success message no i want to,remove that to,close form and then two more things we,want to do is we want to change some of,the information,on this block and then we want to change,the background image,come down and click your email and then,come down,and change the label text for us we're,going to change this to subscribe,now and then below this we have,placeholder text currently it is set on,email address i'm happy with email,address that's quite straightforward,and then simply head back now what we,want to do is navigate over to,styles under styles you can see that we,have a background,image what we want to do is replace this,background image by selecting,replace here what we're going to do is,upload an image,by selecting browse files,and as you can see i've added the new,background here i like the look of that,that looks,awesome now what we want to do is,navigate over to,behaviors and then under display timing,what we want to do is select,loading delay under loading delay what,we want to do is select,show when visitor is exiting the page so,for example if a visitor lands on our,home page,and they start navigating up to the exit,on the screen,then this pop-up will appear i also want,to click,show 60 seconds after page load,for us what we want to do is select 5,seconds so now this pop-up will show 5,seconds after the page has loaded,you can also come down and show this,option here show after scrolling,60 of the page and you can change that,if you like display frequency,down here we want to keep this selected,don't show again after submit form,or go to the url action however if a,visitor closes this form without,submitting the form,then what we want to do is show this,after 30 days,and i'm happy with that then below this,we have devices,show on desktop and mobile you can,select desktop or mobile only,but we'll keep that as desktop and,mobile then below targeting we want to,make sure that don't show two existing,clavio profiles,is selected basically if a visitor has,already signed up then this,pop-up will not appear and i'm happy,with,that we also have options for url and by,location,but i'm happy with my form what i'm,going to do is now navigate up to,publish and congratulations when you,receive a message like this sign up,forms are successfully installed on your,site,you've just created and installed your,pop-up form and it should work,on your website come down and click,publish,now the last thing we want to do is,navigate back to clavio,and then come down to flows and then,navigate over to,create flow and then up here we're going,to name this flow,welcome pop-up subscribers then come,down and click create,flow here what we want to do is create a,trigger for when people are added to,this list so click list over here and,then come down,and choose the list this is the list we,created pop-up subscribers,so every time that a subscriber gets,added to this list,then this flow will be activated and,what we want to do is send a welcome,email,with the 20 off code that we created,that enticed people to sign up to our,pop-up,form i hope that makes sense then come,down and click,done then navigate over to email and,drag that over here,so basically every time someone signs up,to our pop-up form,they're going to be automatically sent,this email and this email is going to,have that promotional,code so come down and we want to edit,this automated email by clicking edit,and then come down and edit the subject,here what we want to add is,here's your 20 discount code and then go,ahead and add preview text if you like,what we're going to do is click save,changes,and then come down and click select,template and then come down here and,select a pre-made email template if you,like,for us what we're going to do is select,basic and then come down and click,one column and then here we have options,to go ahead and use the drag and drop,block builder,to build out our new welcome email so,this is the email,that's going to have our discount code,and it's going to be automatically sent,to subscribers when they sign up to our,pop-up form,so what i'm going to do is quickly just,edit this i'm going to add an image here,and then selecting this image i already,uploaded earlier,i'm happy with that then what i'm going,to do is come down here to this text and,i'm going to edit the text,firstly what i'm going to do is simply,highlight all this text and delete it,then navigate up here and highlight this,text what i want to do is center a line,and then type in welcome to epic coffee,beans,and then below this i'm going to add the,20 off,promotional code and then down here i'm,going to change the code,color by clicking color and i'm going to,select,brown and this is a basic email they,will receive,with the code when they signed up to the,pop-up again you can go ahead and play,around with all the different blocks,styles and elements but for us what,we're going to do is click,save content and then once you're happy,with your email,details just simply navigate up to done,and then come down,and click draft and then click live then,click exit,and congratulations just like that,you've created a pop-up form,and an email flow so the email flow,basically gets triggered,when someone signs up to your subscriber,list,through the pop-up they will get sent,this email with the discount code in,their email,inbox it's very straightforward i hope,that makes sense,now what we're going to do is go ahead,and check out our pop-up,form live on our website firstly i'm,going to click,save and exit and then head over to my,live,website and congratulations just like,that you've created your pop-up form,as you can see we have our pop-up form,that has appeared,after five seconds of the website being,loaded,now with this pop-up form what i'm going,to do is go ahead and enter my email,and then show you what the welcome email,looks like,remember we created that welcome email,flow,after someone subscribes to this pop-up,form so what i'm going to do is add my,email address,and then click get my discount and,remember we removed,the success message however you can keep,that if you want,and just design it the way that you like,and now what i'm going to do is head,over to,my email inbox and find the email with,this,code and as you can see just like that,in my inbox i've got here's your 20,discount code if i come down here i can,see,this promo code down here so just like,that guys it's very straightforward to,create a,pop-up form through clavio for your,shopify store,i hope you got value from this just,remember to take the time to create your,pop-up,form and your email flow however that is,everything we wanted to cover in today's,shopify and clavio tutorial,and there we have it that is it for,today's tutorial guys you can now start,engaging with your visitors,on your shopify store with pop-ups from,klaviyo,now if you have any questions about this,tutorial make sure to pop them down,below,and with that said thank you so much for,watching this tutorial all the way,through to the end,if you got value make sure you leave a,like subscribe and with that,i will see you in the next video take,care guys,you

Congratulation! You bave finally finished reading how to create a pop up in shopify and believe you bave enougb understending how to create a pop up in shopify

Come on and read the rest of the article!