The basics of building pages with Elementor in WordPress

The basics of building pages with Elementor in WordPress

One of the best things about using a CMS is a possibility to build pages with no coding skills. WordPress CMS has a number of plugins for that. They can build anything — from a simple page section to a complicated e-commerce landing page on a WordPress site. The most famous of them is Elementor Page Builder. Let’s take a simple tour on building pages with Elementor on WordPress.

The mission of Elementor on WordPress

The Elementor Page Builder can be your assistant in making your content attractive, well-structured, and engaging. It has a 5-star rating on and 2 million active installations.

Elementor is a user-friendly and intuitively understandable tool. Hundreds of templates and blocks to choose from, drag-and-drop, live page preview, mobile editing, and revision history are just some of its useful features.

All pages and sections that you create can be saved for further reuse. Elementor is also compatible with all standard-compliant WordPress themes.

It has a free and a paid version, Elementor Pro. The latter provides more extensive features (role management, WooCommerce, CRM integration, and more) and 1 year of support. But today we will look at how to use the free version of Elementor on WordPress.

A glimpse at building pages with Elementor

Elementor is an add-on plugin, so you will not find it on your WordPress website by default. By choosing the “Plugins” tab on the left sidebar, you can “Add New” and start typing “Elementor,” and it will show up in the search results.

The “Install Now” and “Activate” buttons will complete the installation process. Elementor now appears on your left sidebar.

In its Settings subtab, there are General, Style, and Advanced settings. Among the options is one to enable Elementor for various post types. By default, it is enabled for WordPress pages and posts.

You can create a page by clicking on “Pages” — “Add New,” give it a name, and choose “Edit with Elementor.” This will open the page in the Elementor interface instead of the default Gutenberg editor interface.

You now have a choice between two options by clicking on one of these two icons:

  • building your page with ready elements
  • using one of the ready templates as a base

If you choose to build your page with elements by clicking the Add Section option icon, you will be offered to select the structure from a number of elements.

And you can drag-and-drop the elements from the left panel to position them on your Elementor page. They include 45+ elements for any web design needs grouped into “Basic,” “General,” and “WordPress.” The search field is available. Examples of elements include:

  • headings
  • images
  • videos
  • icons
  • buttons
  • Google Maps
  • progress bars
  • social icons
  • image galleries
  • accordions
  • testimonials
  • star ratings
  • recent posts
  • calendars

and many more.

If you choose to use a ready template by clicking the Add Template icon, you will be taken to an Elementor library with page and block templates. Those marked with “Pro” are paid, others are available to anyone. The “Insert” button will bring the chosen template to your page.

When you choose a template or a block, you can still customize it to your liking, remove its elements and add new ones from the panel. Just click on the element you like, and Elementor will show its settings.

On the left panel with elements, there are general Elementor page settings. For example, Default Colors and Default Fonts to help you customize the look of your page. In addition to choosing the colors or pasting the color codes, you can use color palettes.

At the bottom of the left panel, there will be a number of other settings icons. For example, the first one opens Page Settings. There, you can choose the page name, featured image, styles, status (Draft, Pending Review, Private, or Published), and much more.

The Publish button will let you save publish, save draft, or save your creation as template for further reuse.

Get help with building pages

This has been just a glimpse at how to use Elementor on WordPress. Even the free version of the plugin has many more useful settings to build pages. Our WordPress development company is ready to help you build your pages according to all your ideas.

1 vote, Rating: 5

Read also


Brute Force attacks can easily crash your digital platform. Learn how to protect the Wordpress website from brute force attacks.


Nowadays, organizations prefer to adapt DevOps and migrate their apps to the cloud. Discover how you can benefit your website with Google Cloud DevOps tools.


Landing pages are created to convert. Discover how to create e-commerce landing page in WordPress and boost your sales.


What could be more exciting than being acknowledged by a reputed research firm as one of the top companies around the world? InternetDevels company is ranked in Clutch lists of top web development...


Using CI/CD where possible is one of the key DevOps principles. It greatly helps teams in software releases by automating the build, test, and deploy processes. One of the CI/CD services is AWS...

Subscribe to our blog updates