Why Choose Elementor Page Builder?
Elementor is one of the first and one of the most advanced WordPress page builders to date. A huge ecosystem has formed around it, and many authors create useful add-ons and templates that can be used to reduce the time required for the final result.
In the case of Elementor, the end result can be a really great site, well designed with all the features you need or might need in the future. If additional functionality is required, it can be easily implemented using shortcodes.
Features of Elementor Page Builder
The free version comes with a limited number of items, but with the Pro version, you get add-ons like QI, Ultimate Add Ons, etc. In addition, you will have many useful elements and templates to easily create a site.
It would be unfair to ignore the Crocoblock add-on for Gutenberg and Elementor, which is one of the favorite tools for most users as it extends the functionality of native Elementor.
The constructor has divided its functions into 4 categories.
Basic Widgets
The basic widgets come with the free version, and they are enough to create a stunning website that doesn't require additional options such as content, portfolio, or contact form. Also, you can't create a title/navigation menu in the free version, so you can find some cool WordPress themes from the navigation menu that you like.
Widgets Pro
Widgets Pro covers almost every aspect you might need to create any website. Add and select posts from different categories, post types or just list types, pricing tables, galleries, easy social media embedding, different media carousels, Lottie widgets, and Hotspot (more on that later).
Theme elements
Theme elements also come with Elementor Pro and they are essential for creating all the template pages and the single post template of course. As you know, there are pages that are dynamically populated with content such as category, tag, author, and so on.
For these pages, you need to create a template with theme elements. The same goes for the only post where you can create a good template for your posts so you don't have to create them every time. Just add content the way you're used to and you're done.
WooCommerce Widgets
Last but not least, WooCommerce widgets. These widgets make it easy to create Theme Builder-like template pages and standalone product templates using WooCommerce elements.
System and hosting requirements
According to Elementor's system requirements page, it should work even with 128MB of PHP, MySQL 5.6 or higher, or MariaDB 10.0 or higher. Also, it will work with any PHP 7+. For testing purposes, I used VultrHF with 2 GB of PHP memory.
Of course, you will need the latest version of WordPress and all other applications.
Install and configure Elementor Page Builder
Installing the free version is the same as installing any other plugin in the WordPress plugin repository. Login to your WordPress dashboard → Plugins → Add New, search for Elementor, install and activate the plugin.
For the Pro version, you need to purchase a plan that automatically creates an account in Elementor. When you log in, you will see a download button to download the latest Pro version.
Next, login to your WordPress dashboard → Plugins → Add New and select Upload, find the downloaded Elementor Profile from your computer, install and activate it.
Highlight Elementor → click License → click the Connect and Enable button.
Once clicked, you are automatically redirected to the Elementor dashboard to activate it. Click the green Enable button and you're done. Elementor Pro is connected and activated.
Upon activation, you will see confirmation that the constructor is active. However, if you created a site on an intermediate domain and don't want to buy another license for direct access, you can easily disable the account at this stage and activate it on the real domain.
It's time to start using the builder and create your website. For example, use the Hello theme.
To do this, we'll start by creating a "Home Page" page. Highlight Pages → Add New, name it Home and Publish, then click the Edit with Elementor button.
On the edit page, you will see elements that you cannot edit because the layout is set by default. To use the element on a blank canvas, select Elementor Full Width or Canvas by clicking the gear icon in the bottom left corner.
Before you start building your site, don't forget to click on the burger icon in the top left corner and set all the global settings you need for the rest of your work.
Site settings are very similar to theme settings. Here you can choose the global colors, the fonts you will use, and the full site typography for each HTML tag.
In addition, you can customize the global button style, header, footer, custom CSS if needed, and whatever it takes to set them up and keep them that way throughout the site to also keep consistency.
The second option is Theme Builder, which allows you to create layout pages and templates for individual publications / products. They will automatically be used by a specific dynamically generated page, post, or product. Like any WordPress theme needs to have template files to display all of the above, the builder will allow you to do this without even writing a single line of code.
The last option is User Settings, where you can customize your work environment in Elementor. This does not affect the site itself other than your user interface as an administrator.
To launch your site, all widgets are placed on the left sidebar and everything can be edited visually and by drag and drop. If you want to do it in an easier way, you can start by using one of the pre-made blocks or templates by clicking on the folder icon.
The folder icon opens a pop-up window that displays ready-made blocks and templates, as well as previously saved ones. You can save the created block or the whole template and reuse it on another inner page. Quite often they use a saved block for reviews, a specific call to action, which should not be displayed on every page, but on some.
The site needs to look great on all device sizes, and just as you edited the desktop version, you need to edit all other sizes.
You can easily set the visibility of a widget or section on different devices, allowing you to have different content in a similar section, leaving one section visible on a desktop but hidden on tablet and mobile.
To edit mobile and tablet versions, click the responsive mode icon at the bottom of the left sidebar. And at the top, switch between different screen sizes.
.png)
.webp)
