GetResponse: How to Create a Landing Page From Scratch

Squeeze Page

Hey guys, yvonne here at and in this video i want to show you how to create a 52.68 conversion rate landing page in get response. Now we will be creating a page that looks like this um, so it’s gonna this is an example that unbounds gave us, and we have already created numerous pages like that in unbounce, as i have here, click funnels and thrive themes.

Okay, so we’ll, be doing the same thing, but this time in get response. If you’re brand new and you haven’t tried out get response. Yet i do give you a 30 day free trial. Via my affiliate link, i’ll link it in the at the bottom.

It’s, getresponse, so check it out. If you haven’t already. That being said, uh we’re gonna click on menu when you first sign in or log in to your get response account and then click on landing pages, and we’re gonna build everything from scratch.

So let’s; click on create landing page. Now you could select a template and just build some stuff out. We’re, going to start completely from scratch, so we’re, going to click on show templates and we’re, going to select something here and then we’ll just delete everything and start with a blank Page so we can select this one here, let’s enter the landing page name, let’s, say youtube paid ad courses, let’s! Click next, and now it’s.

Building out the template. Now we can’t delete everything. So let’s just quickly. Do that, so i’m, going to select the specific element and click delete, select the element and click delete. Now. One thing you should note is that get response, isn’t meant to be a landing page builder.

It’s more so of an autoresponder. So a landing page builder is just a compliment to the autoresponder okay, so it can get buggy. Sometimes uh so over here let’s, see we’re looking for this option here.

So this is the section we’re gonna just drag it up a bit after we delete all these parts trying to delete it. So we can start from scratch to give you guys a complete idea and there at the very bottom.

We have to drag this up. Okay, so see what i mean, it gets a little buggy here we have to select it quite a few times. So let’s. Go back to our page. This is what we’ll, be mimicking once again. So the first thing we’re going to do is let’s, create our logo on the top left corner of this page okay.

So we’re going to move this logo here now. This is an image, so they already have it for us. We can delete this as well and then here are all your kind of tools. Okay, so you have the new section which we’ll, be adding.

You have the drag and drop product box. You can add products, you have text, you have image, you have a button. We’ll, be using most of these here, so that’s. What we’ll be doing, but just know this is your kind of toolbox right.

So let’s start off by adding an image. So we’re going to drag it over here. Let’s, make it smaller. It’s a bit too big and then let’s. Add another section, because this looks a bit awkward, so this is the section.

So let’s add another. One right here looks like it: didn’t go through okay, so let’s. Add the section there then, and then we’ll, do that so that it actually shows up because it it wasn’t uh, adding it to the bottom only to the top.

For some reason i don’t know why. So this is our image. Okay, but obviously we want to replace it with our logo. So i’m, going to select this option here and i already added some images here. So i already added my logo, but what you can do is you can click on add files select your file, your image, your logo, whatever it is from your you know, file manager and you’ll.

Just add it automatically here. So i’m going to click use here, because i already have this logo and then here it is now we can make it smaller, bigger and then the cool thing i do like about so so there are a few things i do like about.

Get response right, and that is that you have certain tools at your disposal which allows you to not have to go into photoshop. So, for example, you can crop this logo. If, if i wanted to, i could go in and crop it and only show my name, for instance, which is awesome, because, unlike unbounce and get response and thrive themes where you have to have a complete image ready you don’t have to do That with a get response, okay, so that’s, pretty cool now, obviously i don’t want to crop anything here.

So i’m, going to select this box instead and that box will allow us to adjust the size and select also where we want the name to be like what the field is. Okay, so that’s. The difference between these two options – you can also move this wherever you want to.

So you have some flexibility here. The other cool thing is you can again, you can change the image, but then you also have some options here. You can add, you know the border size, the shadow color. You can put a link to this image, obviously or to the logo.

So, for example, to this we could say, link url. We could say So if someone clicks the logo, they’re. Going to go to my website – and you can also add these cool effects here, so you can add, you know different variations.

Obviously, on a logo, it’s, not going to look too good, but but i just want to show you that you do have some options you can play around with here, which is again it’s, pretty cool because you don’t have to go back into photoshop and do the change right so that’s.

The one thing i do like about um getresponse, so let’s. Do that that looks about right. Maybe if we move it up a bit here, we can crop this bottom part a little bit right there. Okay, so that looks good um logo size looks okay.

The only thing is, it does look like it’s, a bit cut off. So let’s, go ahead and sorry, let’s um. So we’re gonna double click that logo and then let’s expand a little bit. So we’re going to uncrop. This part here like that, and now we should be good to go okay, so that looks good if you want to increase the size.

Obviously you just drag that right. We don’t want to make it too big. So i think that looks about right, maybe a little bit smaller yeah. So, unlike on balance, you can’t uh change. The dimensions of this, like i can’t, make it exactly 120 by 54, for example.

I have to actually drag this and you know hide out, but that’s. Okay, that’s. Why it’s! It’s, a bit cheaper right because it’s um. You know it’s, not like a specific landing page builder. It’s more of an autoresponder okay.

So we have this part here. Let’s. Add the next section now. So what i’m to do is i’m going to copy this text. Come back here, uh! Let & # 39! S increase this by quite a bit. Let’s, add another section here and now it does allow us to add a section uh, let’s, make this a little bit bigger and now let’s.

Add text, and now we’re, going to copy the text here now with. Oh, it doesn’t. Let us right click. So what i’m going to do is ctrl v instead and unlike thrive themes or unbounce, where it pasted everything in that same format, we have to reformat it okay, so we’re just going to increase the size here.

I believe that size was 34.. I believe it was 34.36. Let’s, try 36.! We can increase the width here so here right. For example, i’m, promoting my video, which reveals how to promote affiliate products on google ads with no disapprovals and high conversion rates.

Just an example, we’re, going to double click it again. So if you want that little option to show up, you have to double click on the element, so we’re, going to double click. It have this come up increase the line height, make it look a bit similar to this and let’s change the uh font as well.

So the font here is, i believe, it’s, uh latto or it’s. Open sans, i think it’s open sense. So if you can’t find your font here. What we’re going to do is click on, add new font, and then we can add it from over here.

So this is a whole collection, now a whole library of fonts and let’s, see if we can find open. Am i going the wrong way? Maybe cdfghj k, l, m n, o okay, it’s, going the wrong way. English is not my first language, i’m.

Sorry, my friends uh. I think it was open sans right. Okay, let’s. Do that. That looks good. That looks exactly like that, which is perfect. The only thing is, i think it is 34 actually, so we’re going to reduce that size a little bit perfect.

Let’s center, it okay and now this looks pretty much exactly as we have it here. Yeah i can’t, find anything else. We should edit um how to promote affiliate products. Let’s, underline that. Let’s! Let’s, bold, that let’s underline this and let’s underline that.

Okay, that looks good. The only thing is this looks a bit grayish, okay, so let’s, make it more black that looks better. Okay cool, so let’s. Add this text now here and let’s. Go in back here i’m, going to ctrl c okay on my windows, click the mac button and see on your mac.

If you’re using mac, just a little shortcut faster way of doing it, we’re, going to remove that extra space there remove that extra space there and there you go. That actually looks pretty good. I don’t.

Think we have to make many changes here for this piece of text. It is helvetica so now that we added that font here we should be able to select it from our library here. So we can do that. That looks about right.

Okay, so now we can go ahead and let’s, add our form so uh we’re, gonna add a static form and that’s. Gon na include the form and the button okay, so we have to increase it now again, not not super big fan of these landing pages here they have because you have to kind of oops.

You have to kind of eye all this, that’s. Okay, so see over here there’s no limit, so we have to make sure it fits ourselves. Yeah it doesn’t. Let us so we kind of have to hide out increase it by a little bit here.

Yeah. Almost that looks about right. Okay, maybe reduce this one by a little bit, something like that. Yeah that looks good okay. So let’s move this up a little bit. Let’s, move that, like that, and that looks pretty good to me.

The other one is a bit smaller, but that’s, okay, okay! So we have. We can drag this now, this whole thing and we’re gonna just center. It here um, maybe make these a little bit smaller, like that. I’m gonna use the arrow keys so that i don’t have to rely on my mouse accidentally going uh more than the area i wanted to.

So i’m gonna use my up arrows here and just drag that up a little bit: [ Music ]. That looks good. I’m pretty happy with that. I’m, pretty happy with how that looks. Uh, this doesn’t, really look centered and that’s, because this doesn’t look centered! So let’s center that so i’m, going to look for that green see that little green line that’s, going to indicate that it’s centered.

So i’m, going to keep dragging until it is, and i’m gonna drag. This use the up arrows and i’m gonna use that okay, that looks good. I’m, pretty happy with how it looks. We just have to add a background here and we have to let’s.

Add that arrow and let’s, make the color of the button blue. I don’t. Think green fits here too much right. So what i’m going to do. Is i’m going to use this chrome extension called colorzilla, so just type in colorzilla, chrome extension and drag it over the color that didn’t quite work.

Let’s, try it again! Okay, there you go so now. It copied the color code, so we can come back in here. Let’s. Select this button and we’re, going to paste that color code. Here we’re, going to remove that extra number sign.

Okay, so we can’t remove that one. So let’s, remove the one we added click enter nope, let’s. Try it again see so so see what i mean by a little bit. Buggy it doesn’t um, it doesn’t. Do the best job at this yeah it doesn’t doesn’t change the button color okay.

So let’s. Go back here! Let’s, go into colorzilla, let’s, go into color picker! Let’s, just copy that without the number sign and see. If that or maybe it just didn’t paste it correctly. Let’s, see yeah okay, so maybe it just didn’t paste.

It correctly, my bad, my apologies, so i guess that does look good. Then uh, let’s. Let’s. Make this let’s, you know let’s say so. You’re just going to double click. The element, if you want to make changes in the element like for a button um, let’s, say email.

Me, the video now yay, okay, awesome and that looks good. I don’t, see anything obvious that we should change. Usually i’m a perfectionist, and i like to go in and change the font by like one size, because it’s that looks off not on this case looks good to me uh.

The only thing, though, here again i’m gonna double click instead of your name, i’m gonna say enter your name here. Dot and then i’m gonna say, enter your email here, dot dot. Now the little asterisk there, you cannot remove it.

The asterisk is there, because if you double-click this uh, let’s, see webform fields. If you go to your name here, it’s, it see how required is not toggled. So you have to toggle that to indicate that you have to enter that in and you can’t get rid of that asterisk.

Okay, so it is there i’m just making sure it is even looks about right. I’m happy with that. Let’s. Just add the little arrow on the side right. So we’re gonna drag this little image here that’s. Okay, we’re gonna add it there.

So that looks about right and then let ‘ S actually add the image. So again i already added this image before i already uploaded it. You know if you haven’t uploaded. Yours just do it on your end, so we’ll click use and there you go um, so we have here.

You know we can select. We can only choose that part. For example. Obviously we don’t want that. So once we’re done editing the button we’re gonna or the arrow. We’re gonna. Do that make it a little bit smaller, maybe okay, looks good, looks good.

Okay, we’re, making progress, let’s. Add this little background image now, okay! So what we’re going to do, i ‘ Ll, drag this a little bit out. So i’m, going to double click. The background. Remember! If you want to change a specific element: double click it.

So we’re, going to double click that we’re, going to go to image. We’re, going to choose an image and again i already uploaded the image right. Click on add files to upload it now. For a background image, unfortunately, you can’t.

Do what i mentioned earlier, as in edit. The image and you know, add cool variations um, so you can’t, add, for example, a layer to it, which is unfortunate. You know you, you have to go back to photoshop and add the white layer yourself uh, but that being said, it’s, pretty standard, nothing that only get response is doing.

Okay. Now you could change uh how you want to put it, though, so you could change the placement you could set it to. Like repeat, i’m, not sure what all of these like mean, but you just play around with them and just make it work.

Okay, you can also, you know, play with these options yeah, so these are up to you to decide there’s. No right answer: it’s. Whatever will make your page look nicer and i think we’re done here. For that part right, i’m just having another look, looks good.

So let’s, go ahead and add this part now, so we’re, going to add the two columns or with get response. We just literally drag and drop the text there. We’re, going to add these things there. Okay, so that’s, going to be this one now just so, we have somewhere to scroll down.

Let’s quickly. Add another section here and let’s, expand this one and maybe let’s. Add another section just so we have some space to scroll down, and so we can, you know we can see what it’s going to look like so that actually looks we don ‘

T have to do anything here, so we’re just going to drag this text here. We’re going to quickly copy this, because we already created all that we’re, going to paste it here. We’re going to. We can keep that.

Maybe let’s just select the font here, which is open sans, let’s, make it bigger. That looks about right to me now let’s. Bold! It see if we should maybe increase the size like that. Maybe okay, i’ll center it.

So we’re gonna again. Double click. It we’ll center it. Maybe we ‘ Ll increase the line height. A little bit – and that looks okay, okay, so that looks fine yeah so like here. There is no line to indicate that it’s uh vertically aligned over here.

You do have the lines indicating that it’s horizontally, aligned right horizontally, uh, but not vertically, so you just kind of have to eye it, which is you know. This is pretty good for, like a landing page builder, that just complements the autoresponder right.

I don’t. I don’t, have any complaints, aside from it, that it can’t get buggy. So next we’re, going to copy that, and actually what i’m going to do here is instead, i’m going to duplicate this section, so i’m, going to go ahead and click the little Plus sign because i want the text to be the same and then this one we’ll use for the bullet points, and then i’ll paste that here and then that way it’s, the same font and text.

We don’t have to reformat it okay, so we’ll, see what you’ll, learn and then let’s. Add these points here. So i’m gonna ctrl c to copy drag. It here and now we have to select all of it and make it bullet points, so we’ll.

Do that and perhaps we want to increase the line height here as well. Maybe something like this and that looks good to me right. I’m, not seeing anything off, um looks pretty it. Doesn’t. Look exactly exactly the same as this, although we can’t make it um that looks good.

The only thing is, maybe the size of this could be a little bit bigger. Maybe we can increase that a bit maybe make it 18 or so. Okay, but aside from that, it looks pretty good. I’m, pretty happy with it.

Maybe i don’t like that word ads there on the side. Okay, so we can just do that. Looks good, as is okay cool. Let’s! Go on to the next step now, which is the review okay. So we’re going to add, we’re, going to say 4.

5 stars 4.5 out of 5 star review. So let’s. We can probably just copy that text as our rating. So again, i’m going to copy this one here. Actually i’m, going to drag it down here and also let’s. Make this background grayish, because that’s.

What it is on the other options we have oops, okay and let’s, remove the opacity a little bit and there you go so this is actually a little bit more gray than this one. You know just so. It stands out a little bit.

We don’t want everything to be just white. It’s, going to make it hard to differentiate the sections, so this just makes it easier to differentiate the sections. So, if making that it’s, clearly more gray than this, so it makes it easier to see now over here we could say 4.

5 out of 5 rating. Is that what it says? Just 4.5 rating okay seems a bit weird that’s, all right um, so we’ll. Do that now let’s. Add an image here right because we want to add the stars. So we’re gonna just do that.

Let’s. Add the image again. I’ve added the stars here: uh, but that’s. What you would do on your side, so we’re gonna crop. This bottom part out. We don’t need it and we’re gonna make sure we don’t wan na crop that we don’t wan na crop, those stars on the side just gonna.

Do that and there you go, looks good, no complaints. I don’t think we should make it smaller fits uh. You know it’s, the same color as the button, which is awesome, and now let’s. Go ahead and let’s, add our actual uh testimonial, which i made up myself.

So we’re, going to go ahead, select that we’re going to copy it. We’re going to come back here now we can’t right click, so i’m, going to control v again on my keyboard. Now let’s go ahead and we’re going to center.

This, i’m. Gon na add a little space there, not too much added extra space. We’re gonna italicize. It italicize it italicize. It make sure everything’s, italic perfect and we’re gonna increase the line height here a bit.

Okay looks about right. What are we missing? Not much? I think we’re, pretty much good here. That one is a bit more bold that part’s a bit more bold, but it’s, also not helvetica. So let’s. Select open sans here, maybe bold it i don’t, know if it looks good, bolded or not, but yeah that’s.

Okay, and this one has five lines: maybe what if we increase the size by a little bit? Okay, so i’m gonna stick with this for this one. I prefer the way it looks here, maybe not bold. It looks a bit weird and then yeah, let’s.

Do that? Okay, so i’m happy with how that looks, but let me bold at least this, so we can have a kind of a distinction. Okay, so that looks good to me. Yeah, i’m, not seeing anything else off perfect okay, so we have that part down.

So now we have this. Oh okay! So let’s. Add the button okay. So we’re gonna scroll down. Add a little space, and now we’re gonna add this standalone button here, let’s, double click it and let’s, see if it still has our color or no it doesn’t.

It will not have our color pasted, so let’s. Go back to this button. Let’s. Control c that color code come back here, ctrl v perfect and it is white colored text which is good, makes it easier to see.

Now we can do that, we can double click it again and let’s go ahead and let’s um. Where would we change, i believe here? Okay, so if we want to change the border radius, we can do it here. So maybe like that right, this is optional, that that’s only if that’s, something you want to do.

You can add a shadow if you want. So if we want to add like a red shadow, is not going to look good if we want to add it like that, maybe right we could so this is something cool. This is something you can’t have in you won’t have in on bounce.

Oh, we can add a little blur more okay, so something like that looks kind of cool right. It makes it just stand out a little bit more. Okay and then we’re gonna, say, email me, the video here again, so we should probably just make it bigger right off the bat.

Let’s center. This let’s, say email me, the video, yay, okay and then what we want to do by the way so for this. So for this button we can set where we want to take people to on the next page, but for this button because it’s, a standalone button that’s not related to the form.

What you can do is double click. It click on this little um, clip icon, select section so from here instead of type web address, you select that click section and then we want to take people to the top right.

So we’ll click section one. We & # 39; ll click. Ok! So now, when someone clicks this button, they’re gonna be taken all the way back to the top. This is section one section, two section, three section: four you can’t rename them, but that’s, just what it is.

So it’s, going to be section one, two, three four and then you’re. Gon na keep going like that. Okay, so when someone clicks this, they’ll scroll all the way up to the top. So we have two sections left.

We have why this video and then just the little copyright, and then we should be good to go so let’s head in here. I’m gonna copy this here again select that copy it. Let’s, drag it down here, and it says why this video right, let me see if everything else is capitalized.

No, it’s, not no. It’s. Not so we’ll. Do that? Let’s. Add one more section here to the bottom. By the way we’re going to have that there okay, so we’re going to drag that down now we have to add these elements here, so we’re, going to add images.

So what i’m going to do here first, is i’m, actually going to just add this one image, and then i’m going to copy paste it. So i don’t have to keep re-dragging images. Okay, so i’m. Gon na do is head over here uh now i might not have the images here.

So what you can do is you can use the shutterstock gallery and you can buy images, you can use gifs or you can use free, get response images. So let’s, see if they have something available here. Let’s, say clock.

Nothing let’s, say time: okay, so it doesn’t, look like it! Timer watch, no okay! So what i’m going to do. Is i’m just going to quickly upload the file and then we should see it available here all right, so i went ahead and i added some of these icons.

So the first one was a clock. So we’re, going to add that here we’re, going to crop that out a bit, and that looks good. Okay, that’s, the size of the icons we want. So we’re gonna go here, copy paste it.

So i just did a quick control c control v, so you select it control c control v that just allows you to duplicate it faster and we’re going to drag the other image here that looks about right. Now we can go in here.

We can double click it or just select this option here or this option either way is fine and let’s. Add the next image, which was a heart, and that looks perfect. We’re going to do the same thing here now.

We’re, going to add the bar graph okay, so it looks awesome. So now what we’re going to do is let ‘ S just add some text here. So let’s say: learn everything in just 20 or 87 minutes. Let’s. Write that here i’m gonna paste.

It reduce that padding a little bit here, but we should increase the size and change the font to open sans change that okay, that looks about right, maybe center, it maybe increase the line height. Okay.

So i’m, going to ctrl c ctrl v to paste it put it here in the middle. Let’s, go in here and let’s, ctrl c and ctrl v. Okay, now this one. Maybe we should make a little bit wider here so like that and then again rearrange it make it center it there you go.

We’re, going to ctrl c ctrl v, let’s. Add it here and let’s center it with that icon, and then we’re going to copy that last part here and paste it here and make that a bit bigger a bit wider. Okay – and that looks good to me.

Okay, so we’re, pretty much good here, uh, where how do you select this? So i’m, letting us select the width there you go that looks about right. Let’s, see uh. We should make this gray the same as this, so we’re gonna let’s.

Select that let’s, see exactly what color it is so for the opacity we’re gonna have to eye it. Let’s. Go back here. Double click that we’re gonna. Add that, but now we have to change the opacity, so that looks about the same and then last but not least, let’s.

Add this copyright. So we’re, going to add this text here and just say: copyright, yvonne, mana, all rights reserved, and that should be about it guys we just successfully created our get response landing page, that is it uh yeah, so that’s.

All for our um for our elements, i think for our sections. Okay, so let’s, go ahead and just uh let’s finish it off. We do have to let’s, save it. I should probably save it more often than that, but let’s.

Go to the next step. Um hasn’t been generated yet uh. Yes, that’s. Okay, proceed without mobile version. For now i can create a separate video on mobile optimization, if you guys want, but that’s it for now uh.

Let’s. Go over here. Okay, so we can’t, add a domain, so this is what our page is going to be like. So it’s going to say you know, resolve famous all that stuff and then gr and you can select here.

You can also add your domain, so i’ve already added my domain um. I want to verify let’s, see which one did that okay, so i guess i didn’t. Add it um nope, okay, so i i didn’t. Add it uh, but if you add your domain, you’ll, be able to have it here and instead of saying you know your username and then some random characters uh.

You can actually have your domain okay, so i ‘ Ll. Show you how to do that in a separate video. If you want over here, you would also select your opt-in and you would say where you want to take people to okay so which list do you want to take people to and then which page? So you can stay on the current page.

So when someone signs up, they just stay there on that page, but they get added to your campaign or you can send them to a custom. Thank you page, and then you have to create this. Thank you page, so you can also create a custom um, a page and get response.

Okay. So if you do the exact same thing we did here, but instead of being an opt-in form, you make a thank you page. Okay, and that’s. It you can add your codes here. Let me know if you have any questions, if you want to add any codes uh.

Let me know in the comments below what you want me to make a video on next, but then we’re going to click on publish oops, okay, so we don’t want that. We’re, going to stay on current page, but let’s, click, publish and let’s view our page and then boom.

Here it is okay. So this is our landing page that we’ve created in uh, get response, and then, if you click here, you’re gonna scroll up to the top. I like that they have smooth scrolling it doesn’t just automatically, take you to the top and then, if you enter your details here, both of which are required, you will stay on this page um and that’s, pretty much it.

Okay and that’s, how you create a get response landing page again. I hope this was helpful. I do have a full complete, get response, playlist in how to build out your autoresponders, how to um, you know, send them to people, and then i show you actually my autoresponders and some good practices.

You can check all the videos out. I’ll. Either link some above or put them in in the description or both, but that is it. Thank you for watching again. Let me know in the comments what other continuation you want me to make here, whether it’s, a get response domain or get response mobile, optimization.

Get our book about making money online

Check the following website for good advice with

Check how to write the best articles with Power Profit List

Products You May Like

Leave a Reply

Your email address will not be published. Required fields are marked *