Do you want to create your own custom page layouts in WordPress?
Elementor is a drag-and-drop WordPress page builder that allows you to easily design custom WordPress layouts without having any coding knowledge.
In this article, we will show you how to easily create custom WordPress layouts with Elementor with just a few clicks.
Why and When Do You Need Custom WordPress Layouts?
Many free and premium WordPress themes come with multiple layout choices for different kinds of pages. However, sometimes, none of these layouts will meet your requirements.
If you know how to code in PHP, HTML, and CSS, then you can create your own page templates or even build a child theme for your site. However, the majority of WordPress users are not developers, so this option doesn’t work for them.
Wouldn’t it be great if you could just design page layouts using a drag-and-drop interface?
This is exactly what Elementor does. It is a drag-and-drop WordPress page builder plugin that allows you to easily create your own custom WordPress layouts without any coding skills.
It has an intuitive user interface that lets you build custom layouts with a live preview. It comes with many ready-to-use modules for all kinds of web design elements.
Elementor has several professionally designed templates that you can instantly load and use as a starting point. It works with all standard-compliant WordPress themes and is compatible with all popular WordPress plugins.
Having said that, let’s take a look at how to create custom WordPress layouts with Elementor.
Getting Started With Elementor
First, you will need to purchase the Elementor Pro plugin. It is the paid version of the free Elementor plugin and gives you access to additional features and 1 year of support.
Next, you will need to install and activate the Elementor plugin. For more details, see our step-by-step guide on how to install a WordPress plugin.
Upon activation, you must visit the Elementor » Settings page to configure the plugin settings.
Here, you can enable Elementor for different post types. By default, it is enabled for your WordPress posts and pages. If you have custom post types on your site, then those will also appear here, and you can enable them as well.
You can exclude or include user roles that can use Elementor when writing posts or pages. By default, the page builder is enabled only for administrators.
Then, don’t forget to click on the ‘Save changes’ button to store your settings.
Creating Custom WordPress Layouts With Elementor
First, you need to create a new page or post on your WordPress site. On the post editing screen, you will notice the new ‘Edit with Elementor’ button.
Clicking on it will launch the Elementor user interface, where you can edit your page using Elementor’s drag-and-drop page builder.
You can add sections and build your page from scratch, or you can pick a template.
Templates give you a quick and easy way to get started. Elementor comes with several professionally designed templates that you can customize as much as you want.
Let’s start with a template by clicking on the ‘Add Template’ button.
This will bring up a popup where you will be able to see the different templates that are available. You should look for a template that is similar to what you want for your page layout.
Now, you need to click to select the template you like and then click on the ‘Insert’ button to add it to your page.
Elementor will now load the template for you.
You can now start editing the template to match your needs. Simply point and click on any element to select it, and Elementor will show you its settings in the left column.
How Elementor Layouts Work
Now, let’s talk about how Elementor layouts work.
Elementor layouts are built using sections, columns, and widgets. Sections are like rows or blocks that you place on your page.
Each section can have multiple columns, and each section and column can have its own styles, colors, content, and so on.
You can add anything in your columns and sections using Elementor widgets. These widgets are different kinds of content blocks that you can place in your Elementor sections.
Simply select a widget and drop it into your section or column. There is an extensive set of widgets available that cover all the popular web design elements that you can think of.
You can add images, text, headings, image galleries, videos, maps, icons, testimonials, sliders, carousels, and so much more.
You can also add default WordPress widgets and even the widgets created by other WordPress plugins on your site. For example, if you are using WPForms to create different forms for your site, then you can use its widget in Elementor.
Once you are done editing, you can click on the arrow next to the ‘Publish’ button to view different save options.
Note: Saving a page layout will not publish the page on your WordPress site, but it will save it.
You can now preview your page or go to the WordPress dashboard.
This will bring you back to the WordPress post editor. You can now save your WordPress page or publish it on your website.
Creating Your Own Templates in Elementor
Elementor allows you to save your own custom layouts as templates. This way, you can reuse your own templates to create new pages even faster in the future.
Simply edit the page you would like to save as a template with Elementor.
In the Elementor builder interface, click on the arrow next to the ‘Publish’ button. You will now see more options to save your post. Simply click the ‘Save as Template’ option.
This will bring up a popup where you need to provide a name for your template.
After entering the name, click the ‘Save’ button.
Next time you are creating a custom page layout, you will be able to select it from the ‘My Templates’ tab.
All you have to do is click the ‘Insert’ button for your custom page layout.
You can also export this template and use it on other WordPress sites using Elementor.
Simply click the 3 dots icon and then click the ‘Export’ option.
From here, you can download the template onto your computer.
Elementor Alternatives for Creating Custom Layouts
Here are some of the best Elementor alternatives you can use:
SeedProd is the best drag-and-drop WordPress website builder that lets you create custom layouts for your landing pages. There are 300+ theme or landing page templates to choose from. SeedProd also offers tons of customization options and blocks to create stunning pages. For more details, you can see our complete SeedProd review.
Divi is a visual theme and page builder. It’s been in the industry for over 14 years and offers different features for creating WordPress layouts, including a layout library. There are lots of customization options in the visual builder, and you don’t have to edit any code.
Thrive Architect is a powerful and beginner-friendly page builder that you can use to create beautiful layouts. It comes with 352+ templates and many customization options. You can use its front-end visual builder to edit any element on the page. For more details, see our Thrive Architect review.
Beaver Builder is another popular drag-and-drop page builder for WordPress. It is easy to use, and you can easily set up layouts for pages and posts using Beaver Builder. It also offers pre-built templates for landing pages, but there are not as many as with SeedProd or Divi.
We hope this article helped you learn how to create custom WordPress layouts with Elementor. You may also want to see our expert comparison of Elementor vs. Divi vs. SeedProd and our picks for the best web design software.
If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.
Do you want to create a custom landing page on your WordPress site?
If you’re running a marketing or adverting campaign, then a landing page can help you achieve your goals and get more conversions.
In this article, we’ll show you how to easily create a landing page in WordPress.
What is a Landing Page?
A landing page is a standalone page created for a specific advertising, email, social media, or marketing campaign. Users coming from these sources will land on this page first, which is why it’s called a landing page.
Landing pages are designed to get conversions, which just means that a visitor takes an action you want on your site. That might be buying a particular product from your online store, subscribing to your email list, filling in a form, or any other action that benefits your website.
What is the difference between a homepage and a landing page?
A homepage is the page that visitors see when they type your domain name into their browser. You can think of it as your website’s front page or store window.
On the other hand, a landing page is where most visitors will land when they come from paid or third-party traffic sources.
A good homepage will encourage visitors to engage with your WordPress website, explore other pages, browse products, or sign up for your email newsletter. With that in mind, a homepage typically has lots of links and gives visitors many different choices.
On the other hand, a landing page is built to get conversions. It has fewer links and typically has a single goal, which is called the call to action, or CTA. You can use any CTA you like, but a lot of landing pages encourage visitors to make a purchasing decision or share information as part of a lead generation strategy.
Your website will only ever have one homepage, but you can create as many landing pages as you want.
That being said, let’s take a look at how to create a beautiful custom landing page in WordPress.
Simply use the quick links below to jump straight to the method you want to use.
Note: To help our readers avoid choice paralysis, we haven’t included all landing page builders like Elementor, Leadpages, Instapage, Unbounce, or ClickFunnels. Instead, we’ve picked the best solutions for small businesses.
Method 1. How to Create a Landing Page in WordPress Using the Block Editor (No Plugin Required)
If you’re using a block theme, then you can design a custom landing page using the full site editor. This allows you to create a landing page using the tools you’re already familiar with.
Unfortunately, this method doesn’t work with every WordPress theme. If you’re not using a block-based theme, then we recommend using a page builder plugin instead.
To start, simply create a new WordPress page, which we’ll turn into our landing page.
In the right-hand menu, click on the ‘Page’ tab. Then, simply find the ‘Template’ section and click on ‘New.’
In the popup that appears, give your landing page template a name and then click ‘Create.’
The name is just for your reference so you can use anything you like.
This launches the template editor. You can now design your landing page in exactly the same way you build a page in the standard block editor.
To add blocks to the landing page, just click on the blue ‘+’ button. You can now drag different blocks onto your design.
You can add content to a block or change its formatting using the familiar WordPress tools.
For example, you can type text into a ‘Paragraph’ block, add links, change the text alignment, and apply bold or italic effects.
You can also create a landing page using patterns, which are collections of blocks that are often used together. Patterns can help you create a landing page with a nice layout, fast.
To see the patterns that are included in your WordPress theme, go ahead and click on the blue ‘+’ button and then select the ‘Patterns’ tab.
You can either drag and drop a block pattern onto your layout or click on the pattern, which will add it to the bottom of your template.
After adding a pattern, you can click to select any block within that pattern and then make your changes. For example, you can replace any placeholder text or add links so the call to action points to different areas of your WordPress blog.
When you’re happy with how the custom landing page looks, click on the ‘Publish’ button and then select ‘Save.’
Now, your page will be using this new template. You can simply update or publish the page to make your landing page live.
Method 2. Creating a WordPress Landing Page using SeedProd (Recommended)
The easiest way to make a landing page is by using SeedProd. It is the best page builder on the market and allows you to create any type of landing page without writing code.
First, you need to install and activate the SeedProd plugin. For more details, see our step-by-step guide on how to install a WordPress plugin.
Note: There is a free version of SeedProd available on WordPress.org, but we will be using the Pro version since it has more templates and blocks, including eCommerce blocks.
Upon activation, head over to SeedProd » Settings and enter your license key.
Next, simply go to SeedProd » Landing Pages and click on ‘Add New Landing Page.’
You can now choose a template for your landing page.
SeedProd has lots of designs that are organized into different campaign types such as coming soon and 404 pages. You can click on the tabs at the top of the screen to filter templates based on campaign type.
Since we’re creating a landing page, you may want to take a look at the Sales, Webinar, or Lead Squeeze tabs.
To preview a design, simply hover your mouse over it and then click on the magnifying glass.
Choosing a design that matches the type of landing page you want to create will help you build the page faster. However, every template is fully customizable so you can change every part of the template and create any landing page you like.
When you find a template that you want to use, simply click on ‘Choose This Template.’
We’re using the Fitness Sales Page template in all our images, but you can use any design.
Next, go ahead and type in a name for your landing page. SeedProd will automatically create a URL based on the page’s title, but you can change this URL to anything you like.
For example, you may want to add some extra keywords to improve your WordPress SEO.
When you’re happy with the information you’ve entered, click on the ‘Save and Start Editing the Page’ button.
This will take you to the drag and drop editor, where you can build your landing page. The SeedProd editor shows a live preview of your template to the right, and some block settings on the left.
Blocks are a core part of SeedProd, and you can use them to create any kind of landing page.
Most templates already come with built-in blocks. To customize a block, simply click to select it in the page preview and then make any changes in the left-hand menu.
For example, if you want to replace a placeholder image then start by selecting the Image block. Then, click on the ‘Select Image’ icon in the left-hand menu.
You can now either choose an image from the WordPress media library or upload a new file from your computer.
Similarly, you can replace any placeholder text with your own words. Simply select any Text or Headline block and then type into the small text editor.
You can also completely change how the landing page looks using the settings in the left-hand menu, including changing the color scheme, font choice, link color, buttons, and more.
Most of these settings are fairly self-explanatory, so it’s worth selecting different blocks in your layout and then looking through the settings.
You can also drag and drop blocks to move them up or down in your layout.
To add more blocks to your landing page, simply drag and drop them onto your design.
Even better, SeedProd has lots of blocks that are perfect for creating a high-converting landing page.
For example, you may want to add a countdown timer that will count down the minutes until the visitor can no longer convert. This can add a sense of urgency to sales, free gift coupons, pre-orders, and other campaigns.
Simply find the ‘Countdown’ block and drag it onto your landing page.
You can then set a time and date when the timer will expire.
SeedProd also comes with ‘Sections,’ which are blocks that are often used together. This includes lots of sections that can help you build a landing page including a header, hero image, call to action, testimonials, contact form, FAQs, features, footer sections, and more.
To take a look at the different sections, simply click on the ‘Sections’ tab. To preview any section, hover your mouse over it and then click on the magnifying glass.
If you want to use the section, then just click on ‘Choose This Section.’
SeedProd will add the section to the bottom of your landing page, but you can move it around using drag and drop.
SeedProd is also fully compatible with WooCommerce so you can easily create new landing pages to promote your products, services, sales, and other events.
Even better, SeedProd comes with special WooCommerce blocks including add to cart, checkout, recent products, and more. This allows you to create custom WooCommerce checkout pages, custom cart pages, and more, so you can build a high-converting online store without being limited by your WooCommerce theme.
If you’re building a landing page to get more sales on your online store, then we recommend creating popular products or recommended products sections.
To create this section, simply drag a ‘Best Selling Products’ block onto your page.
The block will show your most popular products by default, but you can also show products that are on sale, your newest products, and more.
Simply open the ‘Type’ dropdown and choose any option from the list.
Simply click on the ‘Connect’ tab and then select your email service provider.
SeedProd will then show you exactly how to integrate this landing page with your email marketing services.
If you don’t see your email provider listed, don’t worry. SeedProd works with Zapier which acts as a bridge between SeedProd and more than 3000+ other apps.
Just scroll to the ‘Other’ section and hover over ‘Zapier.’ When the ‘Connect’ button appears, give it a click and then follow the onscreen instructions to connect SeedProd and Zapier.
Using a Custom Domain for Your Landing Page
By default, SeedProd will publish the landing page under your website’s domain. However, sometimes you may want to use a custom domain instead.
This will give your campaign its own distinct identity, separate from the rest of your website. It’s also much easier to track each page’s performance in Google Analytics to see if you’re getting good results.
Instead of creating a WordPress multisite network or installing multiple websites, you can easily map a custom domain to any landing page you create in SeedProd.
Before you get started, make sure your WordPress hosting provider allows you to use multiple domains, and add the domain name to your hosting dashboard, if you haven’t already.
First, you need to install and activate the plugin. For more details, see our step-by-step guide on how to install a WordPress plugin.
Upon activation, go to Settings » Beaver Builder. Then, click on the ‘License’ tab.
Here, simply enter the license key, which you’ll find in your account on the Beaver Builder website. You can then click on ‘Save License Key.’
To create a custom landing page, head over to Pages » Add New in your WordPress admin dashboard. You’re now ready to build your landing page, by clicking the ‘Launch Beaver Builder’ button.
This will open the Beaver Builder editor.
In the right-hand menu, you’ll see all the modules and rows that you can add to your landing page. If this menu doesn’t open automatically, then click on the ‘+’ in the top-right corner to open it.
Since we want to create a landing page, choose ‘Templates’ and then open the ‘Group’ dropdown menu.
After that, select ‘Landing Pages’ to see all the templates you can use.
When you find a template that you like, simply click on it.
Beaver Builder will now apply this design to your landing page.
To edit any part of a template, give it a click.
This opens a popup containing all the settings for this particular block. For example, in the following image, we’re editing a Text Editor module.
You can add more modules to your landing page by clicking on the ‘Modules’ tab.
When you find a module that you want to use, just drag and drop it onto your landing page.
You can also add rows to your landing page, which are layouts that help organize your modules and other content.
To do this, simply select the ‘Rows’ tab and then drag and drop any layout onto your page.
You’re now ready to drag and drop modules onto this row, which will arrange them in an organized layout.
When you’re happy with how the landing page looks, simply click on the ‘Done’ button at the top of the page.
If you’re ready to make the page live, then select ‘Publish.’
You can now visit your website to see the landing page in action.
Do you want to create a custom homepage for your WordPress site?
By default, the WordPress homepage displays your blog posts, but you can edit it to show something different. For example, your homepage could be a landing page that highlights your products and services.
In this article, we’ll show you how to easily edit and customize your WordPress homepage.
What Is the WordPress Homepage?
Your homepage is the ‘front page’ of your WordPress website. It’s the first page that shows up when a user visits your domain name.
For instance, if you type in www.wpbeginner.com into your browser, the page you land on is our website’s homepage, where you can see our latest blog posts:
Why Edit the WordPress Homepage?
If you’ve decided to create a blog, then it makes perfect sense to just show your blog posts on the homepage.
But what if you’re using WordPress to build a small business website or even to run an online store? In those cases, you may prefer to highlight your products or promotions on your homepage.
Here’s a business website homepage example from OptinMonster, the best WordPress popup plugin out there. Their site has a great blog, but that isn’t the focus of their homepage. Instead, they’ve got a really clear call to action.
If that’s the case, then you’re in the right place.
We’re going to take you step by step through setting up a homepage and customizing it to match your needs. That way, you can make a great first impression and encourage your visitors to take the actions that are most important to your site’s mission.
Some of the best WordPress themes will create a homepage design for you, and provide options so you can easily edit it.
You can find these options by visiting Appearance » Customize on the admin sidebar. This will launch the WordPress theme customizer with a live preview of your theme.
The Theme Customizer will have different options for different themes. Your preview and the available options may look different depending on the theme you are using. We’re using the free Hestia theme in this example.
To edit any part of the homepage, simply click the blue pencil icon next to it. Here, we’re editing the image, text, and button at the top of the homepage.
Note: As soon as you make edits, they’ll be shown in the preview of your site. Those changes won’t be live on your site until you publish them.
If you want to remove a section from the homepage, then you just need to click the blue eye icon in the top left corner of that section.
You can also remove sections and add them back in using the ‘Frontpage Sections’ tab.
Once you’re happy with your homepage, you need to click the ‘Publish’ button to make it live.
Here’s how our homepage looks, live on the website:
Using your theme’s built-in options is the quickest way to set up your homepage. However, some themes may not have many options, or you may not be satisfied with how your homepage looks.
Don’t worry, there are plenty of other ways for you to edit your homepage and give it the look you want.
Editing Your Homepage With the Block Editor
The WordPress block editor is a simple way to create a custom homepage, although it’s limited by your theme’s design.
To use the block editor, simply go to the Pages » All Pages screen and edit the ‘Home’ page that you created earlier.
Now you can start creating the content for your page.
In this part of the tutorial, we’ll be using a few simple blocks to create a basic homepage.
First, we’ll add a welcome message to the page. You can do this by simply clicking on the page to start typing. WordPress will automatically create a paragraph block for you.
If you want to make the text larger, then it’s easy to do that in the block settings on the right hand side. Just click on one of the preset sizes, or you can click on the ‘Set custom size’ icon and type any size you like.
You can also change the color of your text, using the ‘Color’ options for the text or background.
Next, we’ll add an image to the page. You can do this by clicking the (+) symbol and then selecting the Image block.
You’ll find it in the Media section, or you can search for it using the search bar.
You can pick an image from your media library or upload a new one.
Next, we’ve added another paragraph block, with the text ‘Check out our latest posts here’.
We’ve then added a ‘Latest Posts’ block, which we’ve set to show the post excerpt and featured images, as well as the post titles. You can find out more about the Latest Posts block in our tutorial on displaying recent posts in WordPress.
You can add as many blocks as you want to your homepage. You may also want to use a ‘full width’ or ‘no sidebars’ template for your page if your theme has one.
For example, when using the Astra theme, you can customize the layout of the page from the Astra Settings pane. Other themes may provide a section in the Document settings pane.
Once you’re happy with your homepage, you should click the ‘Update’ or ‘Publish’ button on the top right of the screen to push your changes live.
Here’s how our finished homepage looks:
What if you want to go further with your homepage? One option is to try some of these best block plugins for WordPress to add new functionality, such as a contact form, testimonials, reviews, and more.
The easiest way to edit your homepage is by using SeedProd. It’s the best WordPress theme builder plugin and can create beautiful website layouts and custom templates without writing any code.
You can use SeedProd to create a fully custom WordPress theme, including a custom homepage template.
Note: There is a free version of SeedProd, but you will need the Pro version to access the theme builder and edit the homepage template.
Upon activation, you need to enter your license key. You can find this information under your account on the SeedProd website.
After that, you can use SeedProd to easily create a WordPress theme, including a completely custom homepage from scratch.
Creating a Custom WordPress Theme
You can create a new theme in SeedProd by navigating to the SeedProd » Theme Builder page. Here, you’ll use one of SeedProd’s ready-made themes as a starting point. This will replace your existing WordPress theme with a new, custom design.
You can do that by clicking the ‘Themes’ button.
You will be shown a list of professionally designed themes that are designed for different types of websites. For example, there are templates called ‘Modern Business’, ‘Marketing Agency’, and ‘Mortgage Broker Theme’.
Take a look through the options and select one that best matches your needs by clicking the checkmark icon. For this tutorial, we’ll choose the ‘Digital Strategy’ theme.
Once you have chosen a theme, SeedProd will generate all the theme templates you need. It will include a template for your static homepage, as well as one for your blog’s index page.
Editing the Homepage Template
SeedProd makes it easy to edit any of these templates using a drag and drop page builder.
Simply click the ‘Edit Design’ link found under the ‘Homepage’ template. This will open the template in SeedProd’s visual editor.
This simple drag and drop builder will show a live preview of your page to the right and a toolbar on the left. You can add new blocks by dragging them onto the page, rearrange them by dragging them up and down with your mouse, and customize any block by clicking on it.
Notice that the template has already provided an attractive layout and added plenty of relevant content on the page. Now you just have to edit it to suit the purpose of your website.
When you hover your mouse over a block, a toolbar will appear.
If you click on the block, then you can adjust its settings in the left pane.
For example, when you click on the headline, you can edit the text, change the alignment, alter the font size, and more.
When you change a setting, you can immediately see it in the preview on the right.
For example, we’ll change the text to ‘All About WordPress’.
Once you’ve done this, you can click the ‘Blocks’ icon near the top of the settings page. This will return you to the Blocks view.
Next, we’ll edit the button text. You can click on the button labeled ‘What we do’ and edit the text to say ‘See the courses’.
Now we’ll scroll down our homepage until we come to the list of bullet points about the products and services you offer.
You can edit these in the same way, by clicking on a block and editing the text.
Your homepage should now look something like the screenshot below.
If you need to add more detail, then you can add another row of bullet points by clicking the blue ‘+’ icon at the bottom.
The SeedProd template may have included more sections than you can use. You can easily delete any blocks or sections you don’t need by simply clicking the trash icon.
For example, you can hover your mouse over the ‘Trusted By’ section of the homepage. Once the toolbar appears, you can click on the Trash icon to delete that section.
Near the bottom of the homepage there is a FAQ section. This was created using an Accordion block, which makes it simple to customize the questions and answers you want to include on your homepage.
When you click on the block, you are able to edit the text for each question and answer.
Once you have finished customizing your homepage, make sure you click the ‘Save’ button at the top of the screen. Then you can return to the list of templates by clicking the ‘X’ icon.
As you can see, SeedProd’s templates, drag and drop interface, and useful blocks make it ideal for editing your website’s homepage. For even more ideas, take a look at our guide on how to create a landing page with WordPress.
Using Method 2, you should scroll down to the section on customizing your blog page. Here you’ll learn how to add new blocks using drag and drop, and how to change the settings for each block on the page.
We’ll show you how to edit the Posts block to list your posts in multiple columns and display or hide the featured image for your posts.
There are settings for how many posts to display, and whether to show a post excerpt. You can also filter the index by post type, category, tag, or author, and change the sort order.
Enabling the SeedProd Theme
Once you have finished customizing the theme templates, you will need to publish the new custom theme. Simply toggle the ‘Enable SeedProd Theme’ setting to the ‘YES’ position.
If you haven’t already changed your WordPress Home and Blog page settings, then you’ll see a notification message. When you click the ‘OK’ button these settings will be changed for you.
You can now visit your website to view your new home page.
Editing Your Homepage With a Page Builder Plugin
Divi is a popular WordPress page builder plugin. It comes with a WordPress theme and a page builder plugin with dozens of gorgeous templates.
You can use the Divi page builder with any theme. For this tutorial, we’re going to use it with the Divi theme.
First, you’ll need to download, install, and activate the Divi theme from Elegant Themes. This includes the Divi builder, so you don’t need to install it separately. You will need to enter your username and API key under Divi » Theme Options » Updates in order to access the layout packs.
Once you’ve got the Divi theme and page builder up and running, you can set up your homepage. First, go to the Pages menu in your WordPress dashboard and then edit the homepage we created earlier.
Before you start editing your homepage, it’s a good idea to switch to the ‘Blank Page’ template under the ‘Template’ panel on the right. That way, your homepage won’t have a sidebar, title, menu, or any other default elements.
Next, you can click the ‘Use The Divi Builder’ button at the top of the screen.
Now, you’ll need to click the ‘Edit With The Divi Builder’ button in the center of the screen.
You should now see the Divi Welcome Screen. It includes a video tutorial on how to use Divi, a brief description of how to get started, and buttons to either start building your page or take a tour of Divi’s features.
We’ll click the ‘Start Building’ button at the bottom of the page.
Next, you’ll see a range of options you can use to create your page. We suggest using a premade layout as the basis for your homepage. This makes it really quick and easy to get your homepage set up.
Divi has an impressive range of different layouts to choose from. There are hundreds of different layout packs, and each of these has several different page layouts including homepages.
You can search through these by typing in a search term, or you can check the boxes to view only layouts that fit certain categories.
We’re going to use the ‘Travel Blog’ layout pack to create our homepage.
First, click on the pack that you want to use:
Next, you’ll see a description of the layout pack, plus the different page layouts that are available. You’ll probably want to use the ‘Home’ page or ‘Landing’ page for your homepage. We’re going to pick the ‘Home’ option.
Once you’ve chosen your layout, click the ‘Use This Layout’ button at the bottom of the page.
Divi will automatically import the layout for you. You’ll then see it live on your page, exactly as it’ll appear on your site. To edit any part of it, simply click on it.
Divi uses a system of rows (split into columns) and modules to create your page. With text modules, you can click on the text and type in whatever you want straight onto the screen.
Here, we’ve changed the header and the text below it:
With other modules, you can bring your mouse cursor over them and click the ‘Module Settings’ icon to edit them.
Here, we’re editing one of the number counters:
You can delete modules and rows in the same way, using the trash can icon.
You’ll likely want to use your own images on your homepage. You can change these by editing the module settings.
Note that the image at the top is set as the Background for a Fullwidth Header Module, so you’ll need to change it under Content » Background for that module:
Once you’re happy with the changes you’ve made to your page, you can click ‘Save’ at the bottom of the screen.
Sometimes the bottom row of buttons will be hidden.
If you can’t see them, then you’ll need to click the purple “…” button to open them up.
Here’s how our page looks live on the website:
Setting Your Homepage in WordPress
By default, WordPress displays your blog posts on the homepage.
That means that after creating and customizing your homepage, you’ll need to tell your WordPress site to display that page when someone visits your domain.
Let’s take a look at how to set a separate homepage and blog page in WordPress.
Pro Tip: Do you already have visitors to your site? Then you might want to put your site into maintenance mode while you’re setting up your homepage. Alternatively, you could set up a staging site where you can create your homepage before publishing it live.
First, simply go to Pages » Add New and name your new page Blog. After that, you can go ahead and publish the blank page.
Once your homepage and blog page are ready, you need to tell WordPress to start using these pages.
You can do this by going to Settings » Reading page in your WordPress admin area. You need to select ‘A static page’ option under the ‘Your homepage displays’ section. After that, go ahead and select your home and blog pages.
Don’t forget to click on the ‘Save Changes’ button to store your settings.
That’s it! You’ve created a great looking homepage in WordPress and set it up successfully.
We hope this tutorial helped you learn how to edit a WordPress homepage. You might also want to take a look at our guide on the must have WordPress plugins and our tips on how to improve WordPress SEO.
If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.
The natural beauty of WordPress is its flexibility and ease to use. However, recently, a more robust way of building WordPress websites has landed in the market and is crowded…
Before we get to the list of the best WordPress page builders, let’s answer some basic, frequently asked questions about page builders.
What is a WordPress page builder?
A WordPress page builder, also known as site builder, is a plugin that extends WordPress’s built-in website editing features. It makes building a page or an entire website on WordPress much easier and more customizable.
Some page builder plugins also call themselves theme or website builders. This is because they allow you to edit not just pages but also other parts of your site like the navigation menu, header, footer, sidebar, and so on.
Do I need to use a WordPress site builder?
If you find WordPress difficult to use, then using a site builder can be a good idea. Most WordPress website builders offer a drag and drop function that lets you easily arrange your content elements exactly to your liking.
We noticed that when users just use WordPress’s built-in features, the website may look not very unique, making it difficult to stand out. Many page builders offer tons of customization options so that you can create a truly custom theme.
Do I need to install a theme to use a WordPress website builder?
WordPress comes pre-installed with a theme, so you don’t have to worry about installing another theme if you want to use a page builder plugin.
A WordPress theme and a page builder are two different things. A theme is like a skin that controls the visual appearance of your website, while a website builder is a tool to customize how your skin or in other words, your website looks.
Popular page builders are compatible with most WordPress themes. Unless there is a compatibility issues with your theme and the page builder of your choice, you don’t necessarily need to switch to a different theme.
Do I still need a page builder if I am using the WordPress Full Site Editor?
It depends. The short answer is yes, you’ll need a page builder if you want an enhanced website editing functionality.
Since WordPress 5.9 release, the core WordPress software comes bundled with WordPress Full Site Editor (FSE), which extends the latest WordPress editor, also known as Gutenberg / block editor. Basically, it allows you to edit all the parts of your site (besides pages and posts) using a drag and drop block feature similar to your WordPress post and page editor.
While FSE is getting popular, not all WordPress themes support this feature. This feature is only available with a WordPress theme that supports blocks. Plus, FSE’s drag and drop feature and built-in block options are also not as advanced as page builders.
Having said that, let’s take a look at the best page builders for WordPress on the market.
During our testing, we decided to compare and rank the top WordPress page builders and website builders so you can choose the right solution for your needs. Our criteria for comparing these WordPress page builders are ease of use, flexibility, and design output.
Video Tutorial
If you’d prefer written instructions, then just keep reading.
SeedProd is a premium WordPress theme and page builder plugin. Unlike many other page builders, it lets you create custom WordPress themes from scratch without writing any code.
You can choose from hundreds of beautiful pre-made layouts or create a completely custom website template with an easy-to-use drag and drop visual builder.
There are ready-made 300+ website kits and templates for landing pages, sales pages, thank you pages, webinar registration pages, coming soon pages, maintenance mode pages, 404 pages, eCommerce product pages, and more.
SeedProd is built with website speed and SEO in mind. It ensures that your pages are the fastest so that you can rank higher in the search results.
It comes with a smart design system, so you can save time by re-using elements instead of doing repetitive work. You can define color schemes, save font combinations, page templates, custom blocks, sections, and more.
SeedProd has all the blocks and features you’d expect from a powerful page builder, such as opt-in forms, social profiles, countdown timers, contact forms, buttons, various content blocks, and more.
The best part is that some of these blocks have pre-made templates, so you can speed up the design process by adapting your favorite 1-click block templates.
You can use their custom domain mapping feature to create micro-sites within WordPress. Agencies use this feature to manage multiple client landing pages from a single WordPress installation.
This WordPress page builder works with all popular themes and plugins, including WooCommerce. It also comes with WooCommerce blocks so that you can create custom checkout pages, cart pages, product pages, and more.
Over 1 million users are using SeedProd to make better website layouts.
Pricing: Starting from $39.50 for a single site license. There’s also a free version with limited features.
Our Grade: A++
Review:SeedProd is the fastest theme and page builder plugin on the market. It is also the most affordable. Its large library of pre-built templates and pro blocks is a huge time saver, and the ability to customize every little detail makes it the perfect solution for all WordPress users.
Thrive Architect is a powerful, fast, and easy-to-use page builder. It lets you create beautiful pages, layouts, and content in WordPress without touching a line of code.
The WordPress site builder includes 357+ pre-designed layouts for homepages, sales pages, webinar pages, lead generation pages, application pages, and more.
Every single detail of the templates can be customized using the front-end visual editor. Simply point and click to edit, move, or delete any page element.
You can also quickly add pre-made conversion elements to your pages. Choose from building blocks like call-to-action buttons, testimonials, countdown timers, guarantee boxes, and more.
With Thrive Architect, you can even create custom blog post layouts. You can add blocks like highlight boxes, styled lists, and click-to-tweet boxes to make your WordPress blog more engaging.
Plus, there are more helpful web design elements you can use, such as flexible column layouts, hover effects, total font customization, and more.
You can also connect Thrive Architect with the Thrive Optimize addon to split-test your pages. This lets you compare two versions of the same web page to find out which converts best.
Pricing: Starts at $99 per year for the standalone plugin. Or, you can purchase the entire Thrive Suite of plugins, which includes the Thrive Theme Builder, starting at $299 per year.
Our Grade: A+
Review:Thrive Architect is an easy and highly intuitive WordPress page builder. The huge template library and fast front-end visual editor make it simple, even for beginners, to create custom pages and layouts in WordPress.
Beaver Builder is a popular drag and drop page builder plugin for WordPress.
You can quickly familiarize yourself with the interface and get started with the built-in onboarding tour.
Beaver Builder comes with a live drag and drop interface. You get to see all your changes as you add them by dragging elements from the right sidebar and dropping them on your page. You can click on any element on a page to edit its properties.
There are modules that let you add almost everything you may want, including sliders, carousels, backgrounds, content blocks, buttons, and more.
The WordPress drag and drop builder also comes with over 170 beautifully designed templates for landing pages that make it super easy and super fast to create stunning website layouts.
Wondering if it is compatible with the new WordPress version? Yes, it is. Beaver Builder has been updated to work alongside the WordPress Gutenberg editor.
Pricing: Starting from $99 for unlimited sites.
Our Grade: A+
Review:Beaver Builder is a popular page builder option. It comes with pre-made templates to help you get started. A lot of web professionals use Beaver Builder to create their client sites and custom themes.
Divi is a professional drag and drop theme and WordPress page builder plugin. It is extremely easy to use and comes with hundreds of layout packs for different kinds of websites.
Similar to SeedProd and Beaver Builder, the Divi Builder comes with a true WYSIWYG (what you see is what you get) visual editor with visual drag and drop functionality.
You can directly click on your page and start editing in real time with a live preview of all changes. So you don’t need to save and click preview to see your new design.
Divi comes with dozens of content modules that you can drag and drop anywhere in your layout. It lets you arrange these modules in multiple section types and row types. And you can customize each element using its advanced design settings.
With Divi, you can create any type of custom page layout within a few minutes. You can then save these Divi layouts for future use on your site. You can also export a layout from one Divi installation into another.
The Divi Builder plugin is the backbone of the Divi theme, yet it works well with any other popular WordPress theme.
Best of all, Divi has very attractive pricing options. For a single price, you’ll get the Divi theme, the Divi page builder plugin, and all other Elegant Themes products, such as Extra and Bloom.
This means you can use the Divi theme or install the Divi Builder plugin on any other theme.
Pricing: Starting from $89 per year (a lifetime access plan is also available)
Our Grade: A
Review:Divi is a great SeedProd builder alternative. It has a powerful page builder with limitless design possibilities. The large number of content modules allows you to create literally any type of website that you really want. The lifetime plan also makes it one of the best deals on the market.
Check out our complete Divi review for more information.
Elementor Pro is a powerful drag and drop WordPress page builder plugin. It is a live page builder plugin, which means you can your changes live as you make them.
Start by creating sections and select the number of columns for each section. You can then drag and drop widgets from the left panel into your section.
Elementor comes with tons of widgets, including the most commonly used website elements. These range from basic image and text widgets to advanced accordions, sliders, testimonials, icons, social media, tabs, and more.
Each widget is independent and comes with its own settings. Elementor will also let you add widgets created by other WordPress plugins.
Don’t want to build your own layout?
Elementor comes with many ready-to-use templates that you can easily insert into your pages. You can simply point and click to edit any item on the page, replace the content, and you’re done.
Pricing: Starting from $59 for a single site license.
Our Grade: A
Review:Elementor is a popular page builder plugin for WordPress. It is easy to use, has a large extensions ecosystem, and comes with tons of modules and templates that you can use to build a custom website. However, the code output is less efficient, and users often report slower page speed.
Visual Composer Website Builder is a user-friendly WordPress website editor that helps you create custom website layouts, fast.
It comes with a simple drag and drop builder, out-of-the-box content elements, professional templates, and a host of powerful features to make a website.
Similar to SeedProd and Beaver Builder, it also provides a real front-end editing experience for designing a website. But there’s a lot more you can do with this WordPress site builder.
With the exception of SeedProd, Visual Composer is the only other plugin that allows you to edit all aspects of your landing page, such as logos, menus, headers, footers, and sidebars.
That’s why the team decided to call it a website builder instead of just a page builder.
The plugin features powerful design options to customize the appearance of any element on your page. You have easy options to add stylish backgrounds, including parallax, gradient, slideshow, carousel, zoom in and out, video, and more. It also comes with flexible rows and columns for creating grid layouts on your site.
Visual Composer works well with all WordPress themes. This allows you to switch your themes without losing the custom layouts that you created with Visual Composer.
It also includes support for the Gutenberg editor, Google Fonts, and Yoast SEO.
Visual Composer is designed for professionals, which is evident by their attention to detail, such as remembering your color choices. This allows you to easily use the same color palette for consistency throughout your design.
Pricing: $49/year for one site license
Our Grade: A-
Review:Visual Composer is a great plugin for beginners to start a website. It provides powerful features for website making in a simple manner. Website editing is made super simple with the front-end drag and drop editor. However, the interface is a bit different than typical WordPress plugins, so it can feel confusing to new users.
As a freemium WordPress website builder, Themify Builder is pretty unique. With this plugin, you get two types of interfaces: a drag and drop WYSIWYG to customize the design of your page and a backend to move around your content elements.
During our testing, we found it a bit tricky to use at first. However, we can imagine how useful it is when you just want to focus on editing the structure of your page.
Themify Builder comes in two versions: a free plugin and a Pro plan. The free plugin is more like a page builder as it lets you create a custom page using its 40+ layouts, but not other parts of your site.
Meanwhile, Themify Builder Pro allows you to modify all your page templates, from headers and footers to single post templates and custom post types. The plugin offers professional-looking pre-designed themes and templates.
Themify Builder Pro also offers a Display Conditions feature. You can use this to display certain templates on specific pages only rather than on your entire site. This can be helpful in for showing promotional banners on relevant product pages.
Pricing: Themify Builder Pro costs a one-time fee of $69. A free plugin is also available.
Our Grade: A-
Review:Themify Builder is a great WordPress site builder if you are looking for a slightly more advanced option. It comes with features that you may not easily find in other WordPress page builders. However, for beginners, it’s not the most user-friendly pick.
Brizy is a WordPress website builder made for agencies and SaaS companies, but any user with any skill level can still use it. After installing the plugin, you can simply choose one of the 50 free starter templates for businesses, online stores, wedding sites, and more.
The free plugin only comes with basic content elements like text, images, and buttons, though a contact form is available. We recommend getting a pro plan to get more content elements and other features like a popup builder and user access settings.
The editing interface itself looks clean and feels straightforward to use. It’s not cluttered with too many settings and you can easily figure your way around it without any pointers.
Besides moving elements around, you can save layouts for future use, change the page’s global typography and color scheme, and preview your page on desktop, tablet, and mobile.
The reason this WordPress page builder is intended for agencies is that its White Label plan lets you brand the plugin using your own logo and business name. It’s a cool perk if you work with many clients and want to maintain a consistent brand experience.
Pricing: Starting from $60/year for 1 website. A free version for personal use is available.
Our Grade: A
Review: As a free WordPress page builder, Brizy‘s user experience is beginner-friendly, but it’s not the most powerful. If you want to make the most out of this plugin, then we recommend getting a paid plan to get more out-of-the-box features.
Live Composer is a completely free WordPress site builder. To use it, you will need to enter your email on the website and they will send you a download link to install and activate the plugin.
This WordPress page builder has a WYSIWYG drag and drop editor, with a bottom side panel to insert content blocks. While the plugin itself is free, it offers some elements that you may find in a paid page builder, like accordions, galleries, and progress bars.
When we used Live Composer, we realized that the plugin also allowed us to create custom post types for downloadables, partners, projects, staff, testimonials, and galleries.
These are all excellent custom post types for a business website or a digital product store, and you can use them to fill out your pages if needed.
If you want to extend the plugin further, then you can get an extension pack that includes add-ons for adding a contact form, embedding videos, restricting content, and so on.
Pricing: Free plugin, but the extensions pack starts from $69/year for 1 website.
Our Grade: A-
Review:Live Composer is a good free WordPress site builder for people on a budget. But we think users will need to get the extension pack or installing other plugins as some essential elements like contact forms and video embeds aren’t available in the free version.
SiteOrigin is another free WordPress page builder. You can use it with your existing WordPress theme, but works best with a SiteOrigin theme.
This plugin is technically a drag and drop builder, but when we tried it, it worked pretty differently from other options on the list.
For one, even though it comes with a live preview, you must add and move elements on the side panel rather than directly on the page. So it’s similar to the WordPress Theme Customizer, but it comes with a drag and drop editor.
It can seem tricky at first. However, one cool feature is that it lets you resize rows and columns in a page section easily by dragging a slider instead of sticking with the default section sizes. This can be useful if you want to have more control over your layout.
Additionally, you can adjust layouts specifically for mobile to ensure your site looks good on smaller screens.
SiteOrigin also provides a premium add-on bundle that includes extra widgets like video backgrounds, WooCommerce templates, tooltips, and more.
Pricing: Free, but there are premium add-on packs that start from $29/year for 1 site.
Our Grade: A-
Review: As a WordPress page builder, SiteOrigin offers everything needed to build a fully functional site, but it can seem too advanced for beginners. That’s why we recommend it more for experienced WordPress users looking for more control over their themes.
Like Brizy, Oxygen is a WordPress drag and drop builder designed for WordPress professionals. What makes it different is that it offers no free plan, so you have to purchase a plan to use it.
At a glance, the interface looks similar to a photo editor like Photoshop, which can intimidate beginners. However, it offers tons of control over how your site looks.
For example, the drag and drop editor doesn’t just allow you to move elements around. You can also adjust an element’s padding and margins to ensure your content is readable.
Additionally, this WordPress site builder provides a historical view for each element added to your page so that you can track all the changes that were made to it.
Oxygen also has an excellent dynamic content support. With this, you can insert real-time content into your website elements. This can be beneficial if you have an online store and need to display product prices dynamically based on discounts, sales, or location.
Pricing: Starting from $129 for a lifetime license.
Our Grade: A
Review: If you are a WordPress developer looking to speed up your website building, then Oxygen is a great WordPress website builder to consider. It can be quite an investment at first, but it’s easy to use and has plenty of advanced customization.
If you’re looking for a simple WordPress page builder, then Page Builder Sandwich can be a good pick.
The plugin comes in two versions: free and paid. When reviewing the plugin, we found the free option better suited for a personal, non-commercial site. There are not a lot of block options, and all the page template options are premium.
That said, you can still use the page builder to edit your existing theme.
On the other hand, the paid version offers all the essentials needed to create a website. You will get 10 page templates, 40+ pre-designed sections, and newsletter integration to build your audience.
Pricing: Starting from $29/year for 1 website. A free plugin is also available.
Our Grade: A-
Review:Page Builder Sandwich is a pretty simple WordPress website builder compared to the other options on this list. The feature set is not as rich, but we think it’s a good option if you want something straightforward that sticks to the basics.
Spectra is a WordPress website builder developed by the same team that created the popular Astra theme.
What makes it different from the rest of the plugins on the list is it works right in the Gutenberg block editor. This makes it a good option for people who are familiar with the built-in editor but want some extra features to modify their web pages.
Out of the box, Spectra offers 30+ essential blocks and 100+ pre-built templates to speed up your website creation.
It also offers an AI generative feature called Zip AI so that you can craft copy for your landing pages quickly. Free Spectra plugin users can get 1000 free credits to use this feature.
Spectra is optimized for speed. When we tried the plugin, it did not take long for it to load and there were no performance issues. It also uses advanced tech like the Just-in-Time compiler to make the plugin more efficient.
Pricing: Starting from $49/year for 1 website. A free plugin is available.
Our Grade: A
Review: Spectra is an easy-to-use WordPress site builder that packs in a lot of features. It’s an excellent choice for those looking to extend their existing block editor with some extra Gutenberg blocks and templates. Plus, the AI feature will come in handy for writing content to grow your site.
Zion Builder is a WordPress drag and drop builder that’s made to run fast. The team behind this plugin makes sure that the templates use clean and lightweight code so that your website has high performance and is SEO-friendly.
This WordPress site builder’s 250+ templates and blocks also have professional designs. You can simply pick one from various industry categories, from blogs and restaurants to businesses and real estate.
During our tests, one feature that stood out to us was the tree view mode. With this, you can get an overview of how your elements are stacked and arranged.
Sometimes, when there are multiple, nested blocks, it can be difficult to click on the element you want to customize. The tree view mode helps with this exact problem.
Zion Builder also has a conditional logic function to display specific elements based on certain criteria. For example, you may want to show different content depending on whether a user is logged in or not.
Pricing: Starting from $39/year for 1 website. A free version is available.
Our Grade: A
Review: As a WordPress website builder, Zion Builder is fast and powerful, providing both speed and a wide range of features. It also has great ease of use with its drag and drop feature and tree view mode to make moving your content around much easier.
Last but not least, we have Cornerstone. This WordPress website builder is one of the more advanced options on the list. Like Oxygen, beginners may take some time to get used to the slightly more complex drag and drop interface.
But once you get around it, you can make the most out of Cornerstone. This WordPress site builder has 100+ fully customizable elements for page layouts, dynamic content, WooCommerce, and so much more.
You can even create a custom element from scratch and save it for future use.
Other than that, Cornerstone has a feature to add unique effects to your elements like filters, interactions, masking, and so on. You can combine these effects to make your website more interactive for users.
Cornerstone is also SEO-friendly. It uses a lean codebase with structured schema markup to make sure your website has the best chance of appearing in search engines.
Pricing: Starting from $69 for a lifetime license. If you want to use their custom integrated theme framework, then the price starts from $99/year for 1 website.
Our Grade: A-
Review: We were impressed by Cornerstone‘s vast features and out-of-the-box SEO-friendliness. Not many WordPress website builders focus on SEO. That said, this plugin is not the most beginner-friendly due to its advanced interface.
If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.
Disclaimer: We could have included many other page and site builder plugins in this list, including WPBakery and WP Page Builder. But we decided to only include the very best WordPress page builder plugins to help you avoid choice paralysis.
At WordCamp US I had the opportunity to chat with Beaver Builder co-founder Robby McCullough about how the page builder is navigating the Gutenberg era. The proliferation of blocks for the new editor has made it easy for non-technical WordPress users to add things like pricing tables, maps, tabs, accordions, and other UI elements. Future iterations of Gutenberg will soon tackle layouts. These improvements to core will radically change how page builder products are marketed to WordPress users.
“One of the decisions we made in response to the news of Gutenberg early on is that we wanted to double down on our professional power users,” McCullough said. “It took us a long time in our growth as a business to figure out who our customers were. We realized there were two distinct camps: one that was like a do-it-yourselfer type, someone who maybe had a small business or a hobby website who wanted to use WordPress but wasn’t familiar with writing code. The other was more of a freelancer – maybe a one or two person agency, people who were building lots of websites and had development and frontend skills. We see that as the space where we want to live now. We’re hoping to continue solving problems and making the experience better for folks with a few more skills in their tool belts.”
Following up with McCullough later, he said that applying this new direction to Beaver Builder is already translating into the features they are prioritizing for the plugin.
“For example, in our latest major release, we added percent, em, rem, and viewport-based units for things like font sizes, margins, and padding,” McCullough said. “Without a basic understanding of CSS, this feature wouldn’t be too helpful. We also added dozens of pre-built row templates. So, instead of creating single-page designs, our goal was to create a modular system of rows that can be mixed and matched to build out sites. We’re working to build features that better enable folks who build lots of websites.”
In the interview below we discussed the current integration between Gutenberg and Beaver Builder. McCullough said his team is considering bringing blocks into Beaver Builder or bringing Beaver Builder content into Gutenberg; both are possibilities. His team has been waiting to see how quickly the community adopts Gutenberg before making any major decisions.
“My hope is that there’s still going to be a place for page builders, Beaver Builder and everyone in this space, to have a little bit more agility,” McCullough said. “We can see Gutenberg kind of be like Instagram in that it’s going to appeal to a mass audience. We like to live in the Photoshop space where you’re going to get a lot of fine-tuned controls, solving problems and creating features that are going to help people build websites every day.”
