New WordPress.com Editor 101: How to Build a Landing Page

Karol K. / June 28, 2019

, ,

The new WordPress.com editor offers a lot of exciting possibilities when it comes to website customization. Best of all, there’s no technical knowledge required, so anyone can use it.

Let’s learn to use the new WordPress.com editor to build a functional and attractive landing page.

Getting started

First, start by logging in to WordPress.com and going to My Sites. Click on the Add button next to Site Pages.

Add page

Here’s what the new editor looks like:

Editor

Right out of the gate, you’re invited to add a title for your page and start entering the main content.

The new WordPress.com editor approaches the task of creating landing pages in a very visual manner — each bit of the page is a block of content, and they can be dragged and dropped into place.

Incorporating essential elements

The following elements have a place on any good landing page:

1. Cover

Here’s what the cover element looks like in the wild:

Cover

As you can see, it’s a piece of text on top of an image. This is great for landing pages since it allows you to put the focus on the main headline of the landing page.

To add a cover, click on the “+” button in the top left, and then select Cover from the list.

Add cover

Then, customize the block by adding the text and picking the image for the background.

2. Text

This might seem obvious, good text presentation is important on a landing page. Luckily, the new WordPress.com editor allows you to do a lot with your copy.

As soon as you start typing, you’ll see controls for text alignment, bolding, italicizing, and more. Use them to make your text pop!

Text

3. Product images

In this day and age, images tie web pages together and make them more attractive overall. Those can be either photos of the products that you’re promoting or other images related to your offer.

To add an image, click on “+” and pick the Image block from the list. You can choose any image from the Media Library or upload a new one from your computer.

Image

4. Call to action

To make your landing page effective, provide a clear call to action (CTA) telling people what exactly it is that you want them to do on your site.

It’s best to make that CTA short and to the point: Purchase, Sign Up, Register. You can use a couple of different blocks to present it, including:

  • The Cover block for something big and bold.
  • The Heading block for text-based CTA.
  • The Button block for CTA that links right visitors to a specific page on your site.

5. Email signup form

A common goal for landing pages is to build an email list for a launch or to enable people to sign up for an upcoming product. The new WordPress.com editor has a handy Mailchimp block that you can use for that purpose. Once you add it to the canvas, you’ll be able to integrate the form with your Mailchimp account to collect addresses right from your landing page.

Mailchimp

Customizing the layout

Adding content blocks one below another is one way build a landing page, but maybe not the best one.

One very simple thing you can do to make your page more attractive is use columns. You can find the Columns block on the list among all the other available blocks. Once you add it to your page, you’ll see that you now can display content side by side.

Columns

Take some of your previously created content and drag and drop it into one of the columns. Experiment with this and the other content blocks until the landing page you’re creating is exactly what you need.

Photo Source: Unsplash

Create your new blog or website for free

Get Started