How to make a Canva Website to collect emails

a lot of you asked me ronnie can i create a canva website that also collects email addresses well the answer is that today as of june of 2022 canva doesn't allow you to do this but the good news is that in this video i'm going to show you a simple nine step process that will allow you to create a google form a canva website and mix them together to collect people's email addresses all right i have my express already let's do this alright so step one of this process would be to have both your google form and your canva website copy ready to go okay this is super important i believe copywriting is always a crucial ingredient in any marketing messaging i have decided to create my website and my google form for promoting my brand new canva master course i've been working very hard on updating the canva master course on udemy and it is almost ready so i want people to give me their email addresses so that when the course is live on udemy i can message them and they can purchase the course if they have never purchased it before or if they are already enrolled in the course they can revisit the course because it's going to be a brand new course okay so this is the project i'm going to be using as an example you know me i like to use real life examples so for this project i figured out that i needed a website with four pages okay i want to keep the text to a bare minimum and this is what i have okay so this is the bare text so let me go over this very quick with you i will have a home page which will be the landing page where people will arrive when they log on to this specific url and the home page is going to say it's coming soon discover run is fully updated canva master course and then i will have a button or call to action right there on the first page that says get on the list okay my second page is gonna give a bit more information in context it says a complete makeover it took me forever but i'm almost done updating my best selling canva course on udemy and then i have a couple of bullet points and then i want people to understand exactly what they will learn in this course so i have a third page for that with the content of the course and then the last page is my main call to action which by the way is the same button and same cta as on my first page but i want to repeat it because this is where i want people to click okay so it's uh the text is very basic it says don't miss it click on the button and leave me your name and email via the form to be notified when the course is live so that will be all the copy for my canva website and then we also need to create that google form that will allow us to gather people's email addresses and don't worry i'm going to show you step by step how to create that google form but we need it to come up with the copy so i'm not going to go over everything you will discover that when i actually create the google form but that's the copy ready for that as well step number two is to prepare all the visuals you will need for your landing page if you do that beforehand then you won't spend too much time looking for images once you're designing your website so what i've done here i have actually uploaded all the visuals that i will need for this website in a specific folder okay it's called website ronnie so that when i'm designing in the canva editor i can go to this specific folder and access all of my visuals there now that will work only if you are a canva pro user if you're not a canva pro user no worry no stress at all you can still do this you just have to upload all of your visuals via the uploads button there will be no way of like storing them into a folder because folders are only for canva pro users so that is step two basically prepare all of your visuals let me take a cup of coffee we're getting there step number three is to start from the appropriate template okay because why reinvent the wheel when canva has so many good website templates so for that i'm just going to type in website in my main bar right here and select this one right here with the little website icon like 1366 by 768 pixel so i'm going to click here so from the result page the way i usually go about finding and picking the right template is i go with my guts okay i scroll down and i see if something catches my attention i envision a very clean website with a photo of me so this one immediately catches my attention i'm gonna preview this website by clicking on the three little dots and i'm gonna click on preview the website if you click on it it will automatically open it in the editor at this stage i just want to double check that this website has what i need basically for my website my four pages that i need okay so i see some stuff that i could use i like this i like this hierarchy of text i like this style of button so i'm gonna click on customize this template okay this will open the template and load every single page of the template in the editor you can see it's a new canva website because there is no space between the two pages here or any of the pages per se so a lot of you guys also have told me in the comments i don't have this new publish as a website feature well if you still don't have this feature don't panic it is normal because canva hasn't officially launched canva website yet i'm pretty sure canva is going to roll out the canva website soon so you should all be able to follow along all right so i have the first template i'm going to come back to my search right here because i feel like i will be needing a second template there is something i couldn't find in this specific template that is the page three that i want to design that cover is kind of like the table of content of my course i didn't see any page it would allow me to do this quickly with this specific template so i'm gonna click this time on a filter right here in the left column i'm gonna click on business and start filtering i would love to display the full table of content of my course in a page in one single page so looking here under business if i can find something that could help me do that oh i really like this one right here so let me preview this template it's just actually one single page it's a one-page website but it does have these blocks with the colors one two three four five six seven eight which could work my course has nine sections but two sections are kind of part of the same section so this could definitely work so i'm gonna start this template but also open this in a new tab okay so now i have this website right here and this other website right here so that was step number three select the right template or templates for your canva website step number four will be to customize these templates and really design my own website in canva and this is probably the step that is going to take most of your time because you will need to design every single page of your website but you already have your copy you already have your visuals so it shouldn't take too long because you've already done the heavy lifting and it also depends how much you want to customize these templates so me i'm going to skip this part because i don't want this tutorial to be too long because i have this tendency to make very long tutorials and i don't want to waste any of you guys's time so this time i'm going to skip this step but i'm going to show you the final website and i'm going to explain how i got to there okay so this is the final website i have transformed this first page right here by simply getting rid of the photo i detached it from the background i deleted it and i basically style these text boxes so they look like my brand colors and brand fonts okay and i added my visual right here again this is page number one my home page i have my button my call to action okay it says get on the list and i have used two canvas stickers one to highlight that this is a fully updated course because this is what the entire project is about i want my audience to know i have updated a course which has been selling a lot on udemy so it's a complete brand new course so i want to focus on that word updated because in my opinion it is very important and i've used a canvas sticker so to find these kind of stickers you can simply uh go to your elements right here and search for doodle stickers or doodle sticker and filter by graphics okay so once you filter by graphics this is what you should see and then you can easily find one that kind of looks like the one you're looking for click on the three little dots and see more and there you go you will find all of these cool stickers and i recently discovered that stickers now work with websites so i went ahead and used these stickers to bring some creativity some fun into my website also you will notice that i put a guide right here in the middle and i make sure that every text box right here or my photos stay on their side of this middle line because if they don't then you will have some problems when you view the website from a mobile phone okay so the canva websites are fully responsive which is great but they will need to respect some specific placement i would say for your text boxes your images so that they look great on mobile as well so page two right here is my complete makeover so i have the thumbnail of my previous course or my current course on udemy the canva master course which is becoming now the older version and i have put a preview of the new thumbnail for the course that i just designed last friday okay so and i added this sticker right here behind the thumbnail to kind of continue these hearts flowing right here so yeah let me show you i'm gonna bring this forward so that you can see it's just a sticker that i found in canva but to make this original i pushed it behind my thumbnail so it seems like the hearts keep flowing okay so i have my copy right here with my four bullet points that kind of explain people what's new with the course then on the next page it is the transformation of this website right here remember the second template that i found in the library this one right here so i pretty much i selected everything i copied it command c control c and then i just came into my kind of a website document right here and i paste it and then i just style every single box so that they are on brand i am using a brand kit right here because i'm using a canva pro account which is ronnie's brand kit that also matches the visual identity of the course so here there's nothing clickable it's just purely a informative page and then the last page don't miss it so i've centered everything in the middle this time don't miss it my copy and then the button which is the same button as on the first page i made it a little bit bigger because this one is kind of like the main one get on the list i added another sticker okay so this one to find it i believe i searched for tap sticker yep so tap sticker you get these kinds of like little fingers tapping or cursor pointing and clicking so i use that because i want to see people that this is actually a button and this is where they need to click or tap in order to access my google form all right and then at the bottom here i added another page so this is actually a page another page of my website so if i go to all my pages you will see page five with this weird-looking thumbnail right here it's actually a page that i reduced i reduced the dimensions of this page you see with this handle right here you can actually make your sections or your pages larger or smaller so i made it as small as i could on like as small as canva allows me to go because i only needed to have this text box right here that says back to top i really like to add these kinds of buttons in the footer of my websites to allow people to simply click and go back to the top of the website they don't have to scroll all the way back so it's just like a something to make the experience a little bit easier on the user and you would see i used one of the visuals that i had prepared and i used it twice so i flipped that photo so this is the original and then this one is just a copy and i flipped horizontally so i have this effect pointing to the button and that's all there is to it really so i spare you all the designing of this because you will be creating your very own website step number five is to make sure everything is on brand so again what i did here i used my brand kit because i'm using my canva pro account i created my brand kit which is actually a brand identity i developed for the course that i was updating so i went ahead and used that so three dominant colors and then three neutral colors nothing really fancy here the main color is obviously the yellow right here that i use for my personal brand and then making sure it is on brand also means to create some consistency in your website so respect the text hierarchy okay so your main title is in prompt black 54 so make sure all of your main titles respect this text hierarchy here i had to make it slightly smaller you see it's not 54 it's 48 because otherwise 54 would have been very big right here but people cannot really tell because the difference is not that big and they still look good so uh sometimes you have to make little compromises like this one what does it mean also to remain on brand the style of the photos you will see i used a black and white style on every single photo that i used so that is mainly because i wanted to match the aesthetic of my course thumbnail but also i feel like the black and white is a really good mix with the yellow background so i like this kind of contrast between the yellow and the black and white photos so i went ahead and made sure that every single color photo was indeed black and white so i applied the same filter on these two photos as well so that's pretty much what there is to it so that was step number five making sure everything is on brand now let's move over to the second important document we need to design and that is our google form okay so to create your google form you will obviously need your google form copy so start with this have your google form copy ready and then head over to your google drive i am here on my google drive homepage just a reminder google drive is completely free to use just go to drive.google.com and you can start and you can have access to google sheets google docs google forms all of this good stuff all right so what i want to do is to use the plus button right here and create a google form see so just click on google form so from there you will arrive on this basic google form page i would say with the basic form already started for you so yeah you will have to simply start adding your questions adding your sections we will be adding a header as well so let me show you how google forms work if you never made a google form before it is relatively simple so for example we have here the first box with the main title of my form so this should say i'm gonna copy my text right here this is your form title and then you have your description so go ahead and paste that description as well so that's why you need to have audio copy ready so you can just copy and paste it so that's pretty much good like i'm happy with the first box like the introduction to my form now i can start adding my questions so you see an untitled question so you can click here and the first question that i have if you go back to your copy right here is my first name so i just need to collect people's first names okay short answer that's good and then google gives you the option to make that question uh mandatory always turn that on so for such a form i do believe that you need at least people's first and last name but also their email addresses and you will also need some sort of consent at the bottom mentioning that people agree to give you their email address and agree to receive an email from you that will protect you from any future problem basically so to add another question just click on the plus button that says add question so i'm gonna go ahead and create all of my questions here i'm gonna skip forward because this step is quite boring now for this last question right here where i ask people are you okay with us sending you an email i'm gonna choose multiple choice answer and then customize each of the options right here all right i have pasted all of my copy here i have my form ready okay it doesn't look great so far there's no visual and doesn't look on brand so i'm gonna start tweaking just uh to remind you every single question is a required one so it's a mandatory question and yeah so just make sure yours are mandatory as well otherwise people won't fill up that specific field and you will end up with some missing information all right so the next thing you want to do is to head over this little customized theme button right here at the top of your form so once you click here you will see a couple of styling options first you will see the first section here says header so google forms actually allow you to add a custom header so what we are going to do in a minute is to go back to canva design that header that would look on brand and come back and upload that header to my google form but before that i just want to style this a little bit more you see you can choose a theme color and the last button right here allows you to add a custom color which is perfect because i want to add my yellow here so for that i'm going to go back to my website right here i'm going to click on the background and click on the button right here the yellow color you see and then i can by hovering over this button right here i can see the hex code of my color ffe816 so heading back ffe816 and then enter and then boom magically you have styled your google form right here and you can also play around with these other options right here so you can have a lighter background middle or a more like yellowish background just gonna go for the middle one and that's pretty much all the styling options you have within google form so what we are going to do right now is head back over to canva and create our form header okay guys i have done a little bit of research for you and i figured that the perfect dimensions for google form headers is 1600 by 400 pixels okay so remember these dimensions and for creating our google font header document we are going to use the custom size button right here so 1600 by 400 pixel create a new design okay so this will create a design with the exact dimension of my google form header so by now you know that you can upload a custom header to your google form you have seen how to create the right dimensions for your document in canva so that your google form header will have the perfect size and now it's really a question of you designing that perfect header you can see here if you click on the templates button that you have a couple of templates as well so you could go with a template me i decided to go ahead and use something very similar to my course visual identity again so the way i created this header right here very simple i used a grid okay that covered the entire header then i used this visual right here i dropped it in the grid and now i have this base which is the same basis here uh all i had to do to use my custom fonts to create my main title subtitle and i use one of the visuals from the folder with all my assets remember website runny so i use this image right here got rid of the background because i'm using my pro account use background remover but you can really create your very own header up to your taste so once you have everything ready here you can download this page one of your document just go to your share button download just make sure you choose the png or the jpeg format i like to use png so you download that and then you head back over to your google form and you upload your header so this is what the google form will look like with the header uploaded and i can see it looks very good i have all of my questions i have my custom color my branded color here in the background and also some highlight right here okay at this stage i feel like i need to show you how you will actually collect the emails via this form and i figured the best way to show you is to actually fill up that form that i created so there we go i'm gonna add my first name last name and email address okay i'm gonna agree to this and submit this answer okay so i have received this uh your response has been recorded perfect so now if i come back to my google form i can see that there is one more response right here says responses 11 previously it said 10. so if i click here i can see my responses and i can uh browse through them individually or i can have a summary with some data and all of that good stuff uh if i click on individually i can flip through all of them so if i find the last entry on this form the one i just entered right now this is how i could collect this email address so i could simply select and copy it or if you want to do this at scale i highly recommend that you export your data into a spreadsheet by clicking on this little icon right here so let me show you how the spreadsheet would look like it would look something like this and you will have your different columns here representing the different data points that you collected with your form so from here you can select one or multiple columns copy that and import that data into your email management software of preference for me personally i use mailchimp but there are a ton of different softwares out there that allow you to import data import email addresses via different methods and one of it is to copy paste the data from a spreadsheet you can also import a csv file etc etc but i thought it would be interesting to give you a peek under the hood so that you understand what's going on in the background right here with your google form so once you get to this step you are almost ready my friend so it's time for the last sip of coffee and let's wrap up this project and by the way if you find this video useful smash that like button because i have worked very hard on preparing this tutorial for you guys because you've asked for it so i worked my butt off to really put it together so go ahead and hit the like button subscribe to the channel as well if you haven't done so yet all right we are almost there step number eight is to simply grab the url of this google form and use that in my call to action on my website so where do you find the url well very easy click on the send button and then from here you will click on the second tab right here the link one you can shorten that link so you have a shorter link and you copy that okay now i'm gonna head back to my website i'm gonna click on the button right here and use the link button and paste that okay i already had the link pasted but basically you paste the link in your button little trick right here make sure if you have like me a button which is made out of a shape and a text box make sure you paste your link on both the shape and the text box these are two different elements and you want all of the surface all of the all of this button to be clickable so make sure you have your text box but also your shape with that link okay so do that for this button right here and for the last button in the last page or any of the calls to actions that you have on your own website and then also one thing don't forget if you have done the same little trick as me right here to add a last page with the back to top button make sure you add a link to this text box right here as well otherwise people will see back to top they will click on that and nothing will happen so make sure you select that text box go to your link button and this time you won't paste a url but you will select a page from your document so if you scroll down a bit you will see a section that says pages in this document click on the first one that says page one and then hit enter that is very important don't forget to hit enter i've seen this question as well before like hey ronnie i paste my url but then there is no apply button if you paste a url or if you choose a page to which you want to jump to with the button just hit enter and that is as good as apply or confirm or anything there is no such button anymore so just hit enter all right we are almost good to go guys we are in the final step which is to publish your website but before we do so we need to make sure everything looks on point so for that you are going to use this very useful feature which says preview right here so click on preview and canva will allow you to preview your website from uh different devices okay so this is the desktop preview looks great i can test my buttons i can see that this one works let's click on this one as well and it should open my google form so i can see that everything is working here which is great but now let's really test this further and see how it looks on mobile so you see i can select between desktop tablet and mobile i'm really interested to see how this looks on mobile and this is where remember i told you like respect the alignment and don't cross the middle of the page because if you do everything will look broken but if you do respect that by putting a guide in the middle of your page making sure your text boxes your images they stay on their side it should look like this so i have the first page the home page then i have two thumbnails the stickers are working complete makeover my bullet points my course structure and you see how this page with all the different blocks is nicely aligning that's the beauty of using a pre-made template because it's been made by a designer and tested and then i have the last one right here my last call to action my last uh button or my last sticker is working indicating this is a button this works as well go to my google form and my back to top button is working as well so we are now ready to publish this website and once you are just click on the publish as a website i'm going to click here so this is what you should see you have basically three different options i'm not gonna go in details over these again i have created another video about this the link will be right here for you to discover this other video but for now i'm just going to publish this as a free domain okay so you can publish as a free domain purchase your own domain via canva or use an existing domain that you already own i'm going to go for the free domain click on continue and i'm going to tweak this slug right here the slug is what comes after the slash so my website will be ronniehermosa.my.canva.site slash and then i'm going to rename this i'm going to say 2022 canva master course okay so it says updating the url will break any external link ignore that message which is completely fine i can add a favicon right here if i want to so i can change this little icon right here oh okay i'm gonna use this little guy right here that's my traditional profile picture click on done okay and you can see now it is previewing right here and you can give your website a proper name okay so i'm gonna call this uh ronnie's canva master course 2022. next you have a box to write a description so in this box i'm just going to quickly write get on the waiting list for ronnie's 2022 version of the canva master course okay that's good enough i will not tick any of these boxes i'm just going to publish this website canva will prepare my website and once it's ready give me a url and that would be it we should have our website ready to go and ready to collect emails so let's give this a try i'm going to click on that button right here all right so this is the link to my website it looks great this is the published website and remember this was a real life project i literally just finished the production of this course last week so it's almost ready and you can use the link in the description and in the pinned comment to leave me your email via the google form that we just created so once it's ready i will send you an email and you can check it out if you're already enrolled in my udemy course or if you're not yet enrolled in that course you will have an opportunity to buy it at a very good price so make sure you leave me your details via this google form and phew we are done guys the coffee is no more we have completed the ninth step of this process and i really hope that by now you have your very own website ready to collect people's email addresses make sure to subscribe to the channel give us a like if you like this video and also i will leave you a playlist right here with some other videos on how to create your website with canva make sure you check out the website you sign up for the course and i will see you in the next video

Channel: Design with Canva

Views: 24,253

Keywords: how to create a website in canva, canva free website, create a website in canva, create a website with canva, create website for free, design website with canva, free website canva, free website with canva, how to create a website for free with canva, how to create a website with canva, how to create website for free in canva, how to make a website with canva, landing page in canva, website in canva, website that collects emails

Id: b2MRCWwnB1A

Length: 31min 1sec (1861 seconds)

Published: Thu May 19 2022