Elementor is the most popular page builder for WordPress sites. It is popular with web designers because it allows websites to be built quickly.
If you are building a website in WordPress and therefore creating pages you will quickly find that the WordPress block editor is really not up to the job. I am not going to try and list all its failings, just accept that what you need is a page builder where you can customise the layout to your heart’s content. But before I talk about my favourite page builder let me add that the )same is not true about posts. Many websites use the WordPress editor to create posts but use a page builder to create pages. You can improve on the layout of posts with another plugin called Elementor Custom Skin which I will cover in a separate post.
Elementor has seen a phenomenal rise to success having just started up 5 years ago it now has 8+ million users building websites with it. Experienced web designers love it and the websites they create with it are really stunning. It works by creating a blank canvas for your page to which you add sections. A section can contain one or more columns and into those columns you can drag “widgets”. This is about to change with the addition of a new flex container.
Widgets
There is a very wide choice of widgets from text boxes to images to slide carousels to testimonials. So the first advantage is you can very quickly build a page or select from a large collection of templates to get you started.
Architecture
It’s a very well thought out architecture which allows the widget collection to be extended either with their Pro paid-for version or through third party add-ons. Right out of the box you will find it is responsive that is to say it responds well on different devices such as PC, tablets and phones.
For example if you have a layout of 3 columns on a PC screen it will reduce to 2 columns on a tablet and a single column on a phone with the other columns appearing beneath. Images and text size to fit the screen. All with no effort on your part. Cool.
Responsiveness
But then you can customise how it responds on different devices. Say you have text with padding on the left and right which looks fine on a PC screen, you can change the padding on a tablet and then again on a phone. It means you can make your site look perfect on any device and that’s important because most users are using their phones to browse websites.
Most widgets will have a way to edit the style (font size and colour etc.) and an advanced section to edit margin and padding. So once you have figured out how to customise one widget then the same applies to most of the other widgets.
Global Settings
Perhaps my favourite feature is global settings. Professional looking websites will use just one or two fonts and a handful of text sizes (and weights). The colours too will be chosen to reflect the branding of the site and need to be applied throughout the site to be consistent. Elementor allows you to set up custom colours and font styles that are held as global settings. Provided you always use these global settings on a page it enables you to change the look and feel of the site very quickly by changing the global settings. I liken it to the style feature in Word.
Elementor Pro
While the free version provides a lot of widgets I found that I needed additional functionality: better headers and footers, forms, custom code to inject into the HTML head section, GDPR cookie popup screen and a 404 page. If you pose these questions on WordPress forums you will get the answer “there is a plugin for that!”. Actually it’s a different plugin for each of those features and we want to try and keep the number of plugins to a minimum. I found the answer was Elementor Pro. This one plugin provides all of these features and much more. Even though there is an annual charge for the Pro version I still think it is a great investment for my clients and I tend now to include it in their yearly hosting costs if I identify the same needs.
Watch the Tutorials
There are lots of YouTube videos that help you get started with Elementor and it is well worth watching the core fundamentals before diving into the tool itself. The critics of the tool will claim two things: that it makes the page size bloated and that it slows the site down. The first criticism about page size is true of most page builders – they introduce lots of <div> elements which increases the size of the DOM. But there is a wonderful video from Elementor showing exactly how you can reduce the page size by reducing the number of sections, columns and widgets. I consistently review my pages to see how they can be optimised.
Optimisation
Elementor also have video tutorials on how to reduce page speed times. Often this is because novices have not optimised images correctly or have used more sections and widgets than are necessary. I spend a lot of time optimising page load times by comparing different approaches to see which is better for the environment I am using. There is no shortcut here; try it, measure it, repeat.
Not for Novices
Does a tool like Elementor mean that a complete novice can build a website without using a web builder? My answer is no. Not because I make a living from building websites but because there are other things a novice would need to understand like HTML, CSS and JavaScript. You can acquire this knowledge but it takes time to master it and frankly if you are stating up your own small business there are other things you should be focusing on. Stick to what you are good at get a professional to build your website.
Conclusion
I have been in this business long enough to know that Elementor will not maintain this level of popularity for long. A better page builder is in the wings waiting for it’s time to shine. But in the meantime I will continue to enjoy using Elementor.