How To Install Elementor
The free version of Elementor is available at WordPress.org, so you can install it directly from your WordPress dashboard.
To begin, go to Plugins → Add New and search for “Elementor”. Then, click the button to install the plugin and activate it after the install process finishes.
Once you’ve activated Elementor, you should see a new Edit with Elementor button when you open the editor for a post or page – we’ll show you how to use it in the next section.
If you want to add Elementor Pro to access even more powerful design features, you’ll first need to purchase a copy of Elementor Pro. Once you complete your purchase, you can download a copy of Elementor Pro from your Elementor dashboard by clicking Download Zip.
Then, go to Plugins → Add New → Upload Plugin in your WordPress dashboard and upload the Zip file that you downloaded from the Elementor dashboard. Once the upload completes, make sure to activate Elementor Pro.
To finish things out and activate all of the premium features, go to Elementor → License in your WordPress dashboard to activate your Elementor Pro license on your site:
How To Use Elementor in WordPress
Now that you’ve installed Elementor, let’s talk about how you can use Elementor to create your first design and build your website.
To begin, create a new post or page and click the Edit with Elementor button to launch the Elementor edito
r.
You should now see a live preview of your design on the right along with the Elementor sidebar on the left.
To save time, you can insert a premade template by clicking the library icon:
Once you add the template, make the canvas for your page full-width by clicking the gear icon in the bottom-right corner to open the page settings area and selecting Elementor Full Width from the Page Layout drop-down.
Now, you’re ready to start editing. First, you’ll want to understand the basic structure of Elementor. An Elementor design is made up of three main parts:
- Sections – these divide the page into horizontal rows.
- Columns – these go inside sections and let you divide the section into vertical columns.
- Widgets – these are what you use to actually add content. You can place your widgets inside a column (and then the column is inside the section).
To add a new widget to your template, just drag it over from the sidebar. If you want to delete an existing widget, just right-click on it and select Delete:
To change the settings and design of a widget, column, or section, all you need to do is select it to open its settings in the sidebar:
How To Use Advanced Features in Elementor
Now that you know how the basics work in Elementor, let’s talk about some of the more advanced features that you can use to build even better websites with Elementor Pro.
Form Widget
Elementor’s Form widget is a flexible form builder that can help you eliminate the need to use a separate form plugin. You can use it for contact forms, lead generation forms that connect to your favorite email marketing service or CRM, and lots more.
You’ll be able to view your form submissions right from your WordPress dashboard and you can also set up custom email notifications and confirmation messages if needed. To create your first form, just add the Form widget to any Elementor design.
Integrations
Elementor’s built-in integrations help you enhance your site by connecting to other third-party tools that you’re using.
We already mentioned one key use of these integrations above – the Form widget. Thanks to the built-in integrations, you can easily connect the Form widget to services such as Mailchimp and HubSpot. You also get a Zapier integration so that you can connect to the thousands of apps on Zapier.
Beyond those marketing tools, Elementor also integrates with tons of other plugins, social networks, and services.
Want to see the full list? You can view all of Elementor’s integrations here.
To set up integrations, go to Elementor → Settings → Integrations:
Theme Builder
Elementor Theme Builder lets you take the visual Elementor editor and use it to design your entire website. More specifically, you can create template files for different parts of your site including:
- Header and footer
- Single (e.g. the template that all or some of your blog posts use)
- Archive (e.g. the page that lists your blog posts)
Essentially, you no longer need a theme because Elementor lets you control every part of your design. This is why we created the free Hello theme. It acts as a lightweight base canvas upon which you can design your site using Elementor Theme Builder. For more advanced custom WordPress sites, Elementor also lets you insert dynamic content from custom fields that you added with plugins like Advanced Custom Fields.
To get started with your first Theme Builder template, head to Templates → Theme Builder.
Global Settings
Elementor Pro’s Global Settings feature helps you create and manage your site’s own design system so that you can ensure consistency across your entire site and speed up your workflows. Essentially, the Global Settings feature gives you one area where you can define your sitewide colors, typography, buttons, image settings, form fields, and more.
Whenever you create a new design, it will automatically inherit its settings from your Global Settings. And if you change something in Global Settings, that change will automatically apply across your entire site. Of course, you’re never locked in – you always have the option to fully customize a design on a page-by-page basis. But with Global Settings, you can ensure that your default designs look exactly the way that you want them to and are consistent across your site.
To access Global Settings, click the hamburger menu in the top-left corner of the Elementor sidebar while working in the editor and select Site Settings:
Popup Builder
Popups can be incredibly useful for marketing, navigation, user experience, and more. With Elementor Pro, you can skip the separate popup plugin thanks to Elementor Popup Builder.
Using Elementor’s visual, drag-and-drop editor, you’ll be able to build:
- Lightbox popups
- Notification bars
- Full-screen fillers
- Slide-ins
You’ll get full control over the canvas and placement for your popup and you can use all the Elementor widgets in your designs. Want to create an email capture popup? Just add the Form widget and connect it to your email marketing service. Want to create a login form popup? Just add the Login widget. Want to create an announcement? Just add some text and maybe a button.
Once you finish the design, you can use targeting rules to control where to display your popup and who should see it. Plus, you’ll still get advanced trigger rules including exit intent.
To create your first popup, just head to Templates → Popups in your WordPress dashboard and start building. You can design your popups from scratch or choose from dozens of pre-built templates.
Get Started with Elementor Today
If you’re ready to get started with Elementor on your WordPress site, install the free version from WordPress.org today.
The free version gives you access to Elementor’s visual editor, which will let you see how much easier it is to create designs with Elementor.
Once you get the hang of things, purchase Elementor Pro to extend the free version with powerful new website building tools like:
- The form widget and all of its integrations
- Theme Builder
- Popup Builder
- WooCommerce Builder
- Global Settings & lots more!
Get started today and experience the best way to build a WordPress website.