How to add a free WordPress landing page to your website



How to add landing pages to WordPress for free - Landing pages are the most common business website element. They are often used to sell goods or services or provide contact details to visitors. Creating a free WordPress landing page helps improve revenue.


In many cases, website owners target links from marketing campaigns and ads to this specific page. In fact, a lot of ads at Google will lead to a landing page when clicked.


Today, I will show you how to create a free WordPress landing page.


Use the Page Builder of SiteOrigin


In this WordPress landing page guide, I use the page builder from SiteOrigin. It's a rich system with loads of tools and features to create almost any type of layout.


For this example, let's build the contact page.


Install, activate, "Page Builder by SiteOrigin.".


how-to-landing-page-wordpress-free-


If you are using WordPress 5 or above, this will deactivate the Gutenberg editor. I will explain how to activate the Gutenberg block later.


For pages that are about to be built, a free page builder widget will also be needed.


Install and activate "SiteOrigin Widgets Bundle".


how-to-landing-page-wordpress-free-


Create a new page in WordPress.


how-to-landing-page-wordpress-free-


Provide Page a Title. In this tutorial, I will use the "Test Landing Page". This is mostly for the same URL slug for WordPress. The title will not display on the landing page we are about to build.


how-to-landing-page-wordpress-free-


Click the "Page Builder" tab on the right side of the editor.


how-to-landing-page-wordpress-free-


Click the layout button available. This will provide a large list of the layout you are using for the landing page.


how-to-landing-page-wordpress-free-


Choose the layout that best fits the landing page. I am choosing the "Sophisticated Contact" page because it has some great elements.


how-to-landing-page-wordpress-free-


Click “Replace Current”, then the current replacement option, at the bottom right of the screen.


how-to-landing-page-wordpress-free-


The replacement text will change; Click the option, are you sure?


how-to-landing-page-wordpress-free-


The WordPress landing page template will then fill the editor screen


To edit any element here, hover over the section and then click the direct editing option.


how-to-landing-page-wordpress-free-


Each of these utilities will have the settings you want to customize. For example, you want to change the Contact information settings because it has a default email address already at the system. You want your own email address.


Once you have made your adjustments, click the finish button at the bottom right.


how-to-landing-page-wordpress-free-


Some widgets for SiteOrigin Page Builder have lots of customization options. You should research each issue carefully and make sure you have all the changes you need to a specific business.


The free sample is simply filled with demo information.


Navigate to the page properties and change the template to "Page Builder Template.". This will remove the sidebar title from the landing page. However, it will still create a WordPress landing page with the menu option available.


how-to-landing-page-wordpress-free-


Click the "Publish" button to make the landing page work.


how-to-landing-page-wordpress-free-


Other things you can do with Page Builder


SiteOrigin has many useful tools and widgets to help you create a unique landing page. In fact, what I presented above does not even damage the surface of what this plugin does.


Create a layout from scratch


how-to-landing-page-wordpress-free-


Instead of using built-in layouts, you just need to add widgets and rows to create your own.


You can also use other WordPress widgets on your landing page. For example, you can easily add the calendar gadget to the page at this widget in the sidebar.


Use the Live Editor


how-to-landing-page-wordpress-free-



The Live Editor is like a Customizer at WordPress to modify themes. It gives you a visual representation of what the page will look like when it gives you the ability to make changes.


This is a great feature for people who like to see adjustments when they appear before clicking on the publish button.


See more: .Htaccess file in WordPress


Use drag and drop interface


how-to-landing-page-wordpress-free-


In the drafting screen, SiteOrigin uses a drag and drop interface. This means you can easily move items, making them thinner or bigger, overall to create a unique appearance.


Each row has many style options


how-to-landing-page-wordpress-free-


By clicking on the small wrench icon in each row or widget, you will see the style option "Row Styles" on the right. You have access to a range of options such as changing colors, fonts, or even adding your own CSS coding.


Can this be used with the Gutenberg editor?


PageBuilder SiteOrigin is compatible with the Gutenberg block editing system at WordPress.


To switch from the default classic editor, go to Page Builder at settings and uncheck the box next to "Use Classic Editor for new posts.".


how-to-landing-page-wordpress-free-


When you save the settings, you will have access to the Gutenberg editing system.


Other plugins to try


SiteOrigin Page Builder is a very powerful system. However, it was overwhelming at first. That means some people want a simpler alternative to building a free landing page.


Here are a few other plugins that I have found to be usable.


PluginOps Landing Page Builder


how-to-landing-page-wordpress-free-


The landing page builder from PluginOps is a good replacement for SiteOrigin. Although it does not have the flexibility, but it still has all the elements you want in the landing page system.


You will have access to add-ons, visual editors, and free page templates to get you started with opt-in.


Landing Page Cat


how-to-landing-page-wordpress-free-


Landing Page Cat has several built-in options to attract visitors. You can use email options, use buttons or create landing pages with simple text. You configure the HTML, use the integrated background image, and then customize the button at the landing page.


What makes this plugin ideal for some people is support for an email marketing platform. For example, you can easily use this tool with MailChimp, ConvertKit, AWeber or more.


Sunny: Free Landing Page Builder


how-to-landing-page-wordpress-free-


What makes Sunny: Free Landing Page Builder stand out is the integrated detailed analysis. At a glance, you can see which page works better for conversions.


Sunny also comes with a drag-and-drop build interface, marketing integration, more than 100 landing page templates to choose from, and over a million stock images to use.


However, some more advanced features require a free start plan at Sunny Landing Pages ..


This plugin is a bit limited compared to the free alternatives I mentioned above, but it has the feature you want to use.


Attract visitors with a custom landing page


Creating a free landing page at WordPress is relatively simple, with the right tools. Create a custom interface that fits your needs and then convert visitors into customers. It is worth the effort if you improve the bottom line.


Nguyen Diep

My name is Nguyen Manh Cuong. I was born in a poor village in Ba Vi district, HA NOI province - windy and sunny land. Currently

Post a Comment

Previous Post Next Post

Đọc nhiều trong tuần

10 Grands Sites de modèles PowerPoint gratuit
10 Grands Sites de modèles PowerPoint gratuit

PowerPoint est toujours le roi quand il vient à un logiciel de présentation. Il a été autour depuis des siècles et chaque nouvelle version ajoute plus de fonctionnalités et rend …

17 best home jobs in 2020
17 best home jobs in 2020

Earning Money blog access_time April 13, 2020 hourglass_empty 28 least Read Finding work from home is easier thanks to high technology. Not only suitable for tho…

How much RAM is the iPhone 12 Pro?
How much RAM is the iPhone 12 Pro?

The RAM of the iPhone 12 Pro is up to 6GB.
Based on information in the latest Xcode beta from Hiraku, it can be said that both of Apple's new iPhone 12 Pro models have 6GB of R…

JavaScript
JavaScript

JavaScript is a programming language of HTML and WEB. It is lightweight and most commonly used as part of web pages, but their implementation allows Client-Side scripts to interac…

translate