What's WP
Find Everything Related to WordPress - Best Tutoriasl on WordPress!
How to Create a Landing Page in WordPress with Great Design

How to Create a Landing Page in WordPress with Great Design

Landing page is the first stop of a website, which leaves an initial impression on visitors. A fascinating design for this page exerts an influence on the stimulation of visitors’ interest thereby boosting site traffic. This guide is just about the way to create a landing page in WordPress with awesome design.

We would like to brief you on what are the basics of a great landing page and how to create a powerful one with a WordPress plugin. Before everything, we would like to show you a landing page example with beautiful and effective design.

Best Landing Page Example

Key Aspects of a Landing Page

Briefly, the landing page design is the first thing being considered, for which makes a big difference on the improvement of conversion rate. A good landing page should be simple and professional. There is no need to display a sidebar, header and footer on this page, let alone place voluminous text descriptions. Only a few words used to specify your business should be carried forward.

An unimpressive menu bar and several elegant images should be the main part to promote the whole page design. A link button, like “Get Started” or “Learn More”, is necessary to encourage visitors to know more about your website. That is a great method to increase website conversion rate.

Create a Landing Page with WordPress Landing Pages Plugin

The selected plugin is WordPress Landing Pages, which is one of the most popular landing page plugins with fully customization. Log into your WP admin and install & activate. The option “Landing Pages” appears on the sidebar. Get started to create the first landing page.

Select a Landing Page Template

Go to Landing Pages > Add New and select a favored landing page template from a large number of options. The multifarious templates are classified into an array of groups, including 1 column, 1 column layout, 2 column layout, countdown, demo, and so on. The selected template in this guide is Countdown Lander, which enables full-screen background.

Selec a Landing Page Template

Create a Landing Page

Name your landing page properly and that is shown on the administration dashboard. Note that, you are allowed to change your mind and choose another template if needed. Having everything confirmed, click “Create Landing Page” and move to the next step.

Create Landing Page

Add Call to Action Button

Think out a unique headline of the current landing page and that is visible to all visitors. And then, move to the Conversions Area mode. This is where to encourage visitors to look into your website. Here, we suggest you to add a “Call to action” button to the landing page, which directs visitors to the next page in an easy manner.

Click “Marketing” link and here comes a list of options for marketing customization. That allows you to add a form, build a button, integrate with social media, etc. Click “Build a Button” to enter the interface for button customization and modify the button text, button link, font size, button color, etc. Click “Insert Shortcode” to enable this button on your landing page.

Get Started Button

Perhaps, if there is a need to get more flexibility on the button design, you can go with the WordPress Calls to Action plugin. Having this plugin installed and activated, click Marketing link and select “Call to action Shortcode” to insert the button.

Customize Main Content

This is where to place text on the landing page. As we’ve mentioned before, a good landing should not include a mess of words. Here, you’d better leave nothing in the Main Content mode, if any, a line of description for your business. That also enables you to insert media or shortcodes in this section.

Main Content

Customize the Appearance of Your Landing Page

The Countdown Lander template leaves room for a countdown timer, which is great for a flash sale or some activities with the time limit. Specify the countdown date as needed. And then, customize the color for headline text, other text, submit button and content background. Select an elegant background image from your computer/media library and show transparent background behind content.

Landing Page Background

Finally, click “Save Draft” and preview the landing page. The sample is made by following this step-by-step guide. If there is nothing to be changed, click “Publish” button and make it public.

Sample Landing Page

Conduct an A/B Split Test If Needed

This plugin allows you to run A/B split test for all landing pages. Open a landing page edit interface and click “Add New Variation”. Create version B for the current landing page by complying with the guide mentioned above. The number of visits and conversions will be shown as below. The A/B testing make is much easier to decide which version should be published on your website.

A/B Test for Landing Page


Lucy has been a very experienced SEOer, technical writer, web developer, c# developer since 2002. Now she owns a startup in San Francisco, CA, focusing on running a couple of blogs to share knowledge and experience with global readers and deliver exceptional results to global sponsors by leveraging the power of Internet.