Are you trying to build a landing page with WordPress.com but aren’t sure how to get started? If so, you’re in the right place. In this video, we’ll walk you through the entire process from start to finish, without writing a line of code. In just a few minutes, you’ll know exactly how to create pages that will achieve your goals, no matter what type of website you’re building:
Video Transcript
Hey, everyone. It’s Mike Bal from WordPress.com. Today, we’re gonna talk about landing pages and how to put one together.
So a landing page on your site is a page that’s specifically dedicated for a purpose, usually capturing somebody’s information or driving some kind of action. You might want a landing page for an event to get people to sign up or register. You might want a landing page for like a movie, or a book release, or something and get people to pre-order. You might want a landing page for a specific service or product that you offer to get them to either purchase it or request a quote, or whatever the case is.
A landing page is usually very narrowly focused, has information about that one specific thing, and that one specific action you’re trying to do. So it’s similar to the homepage in that it’s the most important thing on your site, or the most important action or information you want the user to take away.
But if you are a website that has multiple things that you may want users to do or serve multiple audiences, a landing page is somewhere you can send them that narrows that down.
Usually, you use landing pages with campaigns for advertising or email, or a partnership. You might send people to one specific page to get a discount or to get a specific offer, or just because that context is specifically relevant to them.
Getting Started: Creating a New Page and Choosing a Pattern
So we’re gonna think about it just like anything else. We’re at our dashboard right here, or My Home in WordPress.com with our site selected.
I’m gonna jump into Pages, and we’re just gonna Add New.
Now, you have a couple options here as this loads up. I always like to look at Patterns. And when you add a new page on WordPress.com, we give you that option right away. So before you start from scratch, you can go in here and you can look at different patterns you might want to use.
Most of these are pretty busy, or they’re for different types of purposes, not necessarily landing page specific. But you can find some things that work. Like this right here would actually be a great landing page. It has a lot of good information. It has a lot of different colors and designs. I might wanna take that one.
This is more of a product gallery.
So if I go the Pattern route, let’s say I take this one, that gives me all my content I want right away. And even if I’m not going for these colors, even if I’m not going for this design, starting with this layout gives me a much easier starting point for what I want to do.
I could change this to “Support your local pangolin,” since that’s the site we’re on. I could change the CTA in here, and make it, “Act now.” I could change all this content very easily. I can put our own stats in there.
Editing Your Landing Page Layout
This is pretty neat. If I don’t like certain things in the layout, I can always open this up. I can look at this, for example, and change the settings. Right now, it’s set to none. Let’s go full width. That looks much better. It’s not crammed, it’s not squashed. I like that.
So, and it has some kind of dynamic content built in too. So it’s pulling blog posts in under that Hear From Our Community section, which is kind of cool. So it’s not, I don’t even have to start entirely from scratch there.
And again, the nice thing, since we’re using this, if I go to that color, for example, see we have these theme colors in there, and we also have that custom color palette that I put together. So I can very quickly change these things to be what I want them to be and to match the rest of my site without having to do a lot of work. So that’s the easiest way to put some kind of landing page together.
Let’s pretend I didn’t do it that way. And I just delete all this content real quick, which actually, I should be able to select and delete. Go to new Blocks. Okay.
So there’s a lot of different ways to do this. I like the Cover block. This is kind of what you think of when you think of a landing page with a big image, and some text and a button, and all that stuff.
So we’re gonna choose one, and I’m going to randomly select Island ’cause I like islands, and I like the beach, and it was warm here, and now it’s cold. So I’m gonna choose some kind of island imagery from space. This is really neat. So I don’t even know what it is, but we’re gonna call it that.
I’m gonna check out how I want it positioned. There’s wide; there’s full width. I might even do a fixed background, which makes it stay in place as you scroll, which I really like.
And then I can add different blocks in here, and arrange them however I want to. So if you haven’t watched the Group block video, or the Row video to understand how those layouts work, please do. Check out Columns as well.
Adding Above the Fold Content, Headline, and Body Copy
Really simple way to do this is just put your headline in here. You’d add some kind of paragraph here that would justify whatever your headline or CTA kind of is, something like that.
And then, we’ll do buttons. And you can do a single button, a double button, whatever you want it to be, and style it. So that way, somebody lands on the page, the very first thing they see is a clear call to action that tells ’em what you want them to do, why they’re there, or they find what they came there to do in the first place. So you can style these things, and do whatever you want with them.
So again, for the first part of the landing page, that’s the first thing they’re gonna see. Then what? So that didn’t work. What do you want to do next? That depends on the information or the content you have to be able to do it.
I would, again, the easiest way to do this is just search for patterns that give you an idea of what you like if you don’t have a very clear idea in mind. So if you don’t have a design you’re looking at, or a page you’re trying to recreate, I really like going to this pattern section. List is a good way to break up, you have one big hero, and can present kind of different ideas with something from this section.
Adding Testimonials and CTAs
So testimonials. So landing page. You want them to take action. They didn’t take the first action. You need to show them some proof that you’re valid, you know what you’re doing, you have some level of credibility. Testimonials are a great way to do that.
And then let’s search for, maybe we put some kind of portfolio in here to show what you can actually do or why it matters. This is a nice layout. I didn’t mean for it to bump my quotes down, so I can just drop it down a little bit.
And then if they end up getting to the bottom page and not finding what they want to do, you can do one more kind of last call CTA and drop in; let’s even see, we have Call to Action as a section or a category with our patterns. So if they didn’t choose that one thing, you might want to give them different options, or you might want to just make another case for that one thing. Or you can put a secondary CTA.
Maybe they didn’t wanna sign up for some kind of meeting, or they didn’t want to give you their information, or get a quote for a project, or buy a thing. Maybe you can just point them towards some fun merch or some content or something else that might make sense to get them to take some action. Ideally, try to grab their email in there so that you can kind of follow up with them and try to bring them back.
So this isn’t a design that I think really makes sense ’cause they’re all different patterns for different things. But your styles and everything will be applied to these, and look cohesive with your site. And then, you can always tweak the imagery and everything to make it look cohesive to your site.
So again, patterns are great ways to find inspiration for the layout, and the type of content you want to present if you don’t know exactly what you want. Otherwise, the editor is really quick to just add the blocks and put things together.
The way to think about it is you want one specific action to happen. If it doesn’t happen right away, you need to build your credibility and help persuade the person to go back and take that action. If they go through all that content and they still didn’t want to take that action, you can give them an alternate route that usually requires kind of less commitment, less time, less money, whatever.
But try to capture their name, their email, their number, whatever, so that you can follow up with them and try to keep them in that in that flow, or in that kind of that goal that you’re trying to push them towards.
Now You’re Ready to Build a Landing Page
As you see in this video, Mike was able to create a landing page in a matter of minutes, and it was all made possible by WordPress.com. While writing your copy and perfecting your design may take more time, the technical components are made easy, so you can focus on creativity and results (rather than wrestling with code).
Ready to create your website with WordPress.com? There’s a plan for you.
ABOUT THE AUTHOR
Go WordPress 