Years ago, you really couldn’t build a website without using code. But, now knowing code isn’t necessary anymore to design an amazing website. There are many page builders (which are plugins) out there that can make it really easy for non-coders to create any type of WordPress website they’d like.
Some of the most well-known page builders are:
- Elementor
- Beaver Builder
- Divi Builder
- Thrive Architect
- WP Bakery
- Visual Composer
My favorite page builder and the one I use for my website and all my clients’ websites is Elementor so I wanted to share some tips on getting started with Elementor so you can use it too.
So, what is Elementor?
Elementor is a drag-and-drop page builder that helps you create beautiful pages using a visual editor. It’s designed for you to build dynamic websites quickly.
Elementor launched in 2016 so it’s one of the newer page builders on this list. But, even though it’s newer, it has over 5 million active installs which makes it the most popular page builder out there. And, its popularity is due to its ease of use, glitch-free visual interface, flexible styling options and powerful other features, like full theme building.
Getting started with Elementor is simple. The first thing you’ll want to do is install and activate the plugin.
Once it’s installed and activated, you can go to the pages section of your WordPress dashboard, select the page you’d like to design and then select Edit with Elementor as your option. This will bring you into the Elementor interface. You can also access Elementor directly from your WordPress dashboard.
Elementor has a simple drag and drop interface that allows you to design pages for your WordPress website easily. There are two main sections of the interface, and one third section for some smaller, but very important, settings.
The first section of the interface is the live preview of your design. It looks exactly like your visitors will see it. You can type directly in this interface as well as drag and drop various elements to rearrange them.
The second section shows a list of elements, or widgets, you can use in your design. Just choose the one you want to use and drag it over to the first section. After you’ve selected an element or section, this is where you’ll style it.
The third section is located at the bottom of the second section and it helps you access responsive previews, undo and redo changes and some other smaller features, like saving templates.
The Elementor editor consists of three main building blocks called sections, columns and widgets. Sections are the largest building blocks. Within sections, you can add groups of columns. And, widgets are housed within columns.
Widgets can be basic elements like a heading or an image gallery. Or they can be more advanced like animated headlines and testimonial carousels.
When you click on any section, column or widget, you have three styling options in the sidebar at the left – content, style and advanced. The exact options will depend on what element you’re editing, but Elementor offers one of the most comprehensive sets of styling options of any page builder.
Aside from basic options like colors, backgrounds and typography, you also have control over more advanced settings like margins, padding, custom CSS and responsive controls.
Elementor has both a free version and a paid, or Pro, version. In the free version, there are 28 widgets, included. You can also use all the core WordPress widgets. If you upgrade to the Pro version, that will add another 30 widgets which offer more advanced options.
Additionally, the free version comes with about 40 templates you can use – both page and block (sections of a page) templates. The Pro version adds many more templates on top of that. You can also save your own designs to use as templates later.
And, with the Pro version of Elementor, you have the ability to customize your header, menu and footer along with designing custom 404 pages and so much more.
Elementor stands out from its competitors because of its ease of use. It’s an all in one solution that allows you to control every part of your website design in a single, simple platform.
I hope you find this post on getting started with Elementor helpful. If you think someone else could benefit from it, please use the icons below to share it.
If you need help with your website design, please click here to fill out my contact form. I’d love to connect with you.
