Open laptop with a mouse, a succulent, and a notebook showing tech-related doodles

Inside: How to insert a sign-up form in a landing page built in WordPress. Scroll down for video so you can see it step-by-step.

When we talk about landing pages, we usually mean the kind of page where a visitor can subscribe to your newsletter by downloading a freebie (also known as a lead magnet, or ahem, an ethical bribe).

Some people like to use the really fancy ones email service providers offer. And they are lovely but…

If you move to another email service provider, say from Mailerlite to ConvertKit, your old landing pages will no longer work and any links that lead to them, say on Pinterest or on social media, will be dead.

Which is why I believe you should build your landing pages on your own website. Here's a short video showing you exactly how to do it in WordPress:

If you prefer to read the step-by-step, here you go:

Step #1 – Add a new page

You'll want to give it a name so it's easily recognizable in your list of pages. Then, hide the title. You may also want to hide the header and footer on the page, if you prefer to give people no option other than to subscribe.

Screenshot showing how to hide page title in a Genesis-based theme
If you're using a Genesis-based theme, check Hide Title under the Genesis settings

STEP # 2 – Add a heading

You may want to start with the name of your freebie or an attention-grabbing headline. Since the page title is disabled, this should be your H1 heading.

In the video, I centered my headline and changed its color but this will depend on your own design preferences.

Step #3 – Add a columns block

Do you have to use columns? No. But does it look nice when you do? Absolutely.

I like to use two columns, split 50/50 – then I can put the freebie image on one side and the sign-up form with a short write-up on the other.

The core Columns block is just fine, or you can use an advanced one from your favorite block extender plugin, like Genesis Blocks or Kadence Blocks.

You'll want the columns vertically aligned in the center so they look pleasing to the eye.

Step #4 – Add the image and freebie info

Prepare a nice image of your freebie and add it to one of the columns. Make sure to size the image appropriately.

Then add a short blurb about your freebie to the other column. It doesn't need to be long, maybe a sentence or two about why it's so awesome and what people will get out of it.

Step #5 – Add the shortcode

WordPress has a special shortcode block for this and we're going to use it. To find it, start typing it /sh and you'll see the shortcode block pop up.

Screenshot showing how to find the shortcode block in the WordPress editor

Select the block to insert it. It will look like this:

Screenshot showing the inserted shortcode block

You can see it's just one line. That's because a shortcode is just that – one line. Hence the name.

Step #6 – Embed the form

You'll want to use the absolute simplest form your email service provider offers. In ConvertKit, that's the Clare form. (Using Mailerlite? Make your own bare-bones form.) It literally comes with just the email address field and the button.

I add the first name field to mine because I like to have people's first name for when I email them.

If you're on my email list, you know all my emails start with “Hi [your first name],” and then go on from there. And if you're not on my email list, what are you waiting for? Grab this freebie and you'll be getting all my pearls of wisdom weekly(-ish) 😁

Anyway, your super simple sign-up form might look something like this:

Screenshot of a very simple sign-up form in ConvertKit

Now it's time to embed it.

Most, if not all, email service providers have their own plugins so make sure you have yours installed and activated. It helps keep your forms up to date whenever you make changes to them. And it does the work of rendering the shortcode as a form.

In ConvertKit, you'll want to click on Embed in the upper right-hand menu, then choose WordPress when the dialog comes up. It should look like this, except you'll see numbers where my aqua-colored rectangle is.

Screenshot showing where to find the embed code in ConvertKit

Copy the whole shortcode, including the square brackets at the beginning and end.

Then paste it into the shortcode block. And voila!

Screenshot showing the finished landing page with an embedded sign-up form

Step #7 – Flesh out your landing page

Unlike my bare one in the video, you'll want your landing page spruced up with a little bit more information near the top – to give people a better idea of what you freebie can really do for them and why they should download it.

You may also want to add a short section about you and a testimonial or two. If your landing page gets to be long-ish, it's a good idea to repeat the block we just created at the bottom.

That way, if somebody does scroll all the way down – they're reading your testimonials and whatever else you put in there – they don't have to scroll back up to sign up.

Not comfortable with the WordPress block editor?

Tame the Blocks shown on a mockup of a desktop, two laptops, and an iPad

No need to feel intimidated.
No need to feel scared.

It's time to get the block editor to work for you.

Final thoughts

That was easy, right?

There really isn't much to it. Design your page so it goes well with the rest of your website. Then use the simplest form your email service provider offers, and embed it using the shortcode block.

When you're ready to switch email providers, you'll just swap out the shortcodes and that's it. Painless and relatively quick. And no dead links.

Similar Posts