How To Install Elementor

My favorite page builders for WordPress are Beaver Builder and Elementor. They're easy to setup and quickly get to designing great looking pages. There are three main ways to get started.

How to install Elementor: Use one of the following methods.

  1. Download from Elementor and upload through the WordPress Dashboard
  2. Install directly from the WordPress Repository
  3. Download from Elementor, upload and extract in cPanel.

I prefer to use the first method, as I already have Elementor saved to my computer. You might have some difficulties installing directly from the WordPress Repository, especially if you have a slow connection.

If the first two methods don't work, the last will work just fine.

Upload through the WordPress Dashboard

For this method, go to Elementor and click "Free Download".

You'll get a popup asking you to put in your email address. They have a great newsletter that helps you get up to speed on Elementor.

If you don't want to hear from them any more, you can always unsubscribe.

Enter your email address, then click "Subscribe & Download".

You'll immediately be redirected to another page and the download will start shortly. Depending on your browser settings, the file might be automatically downloaded, or you'll be prompted to save the file.

Your version might be different, depending when you are reading this tutorial. The latest version at the time of this tutorial is Elementor 2.7.5.

Once Elementor has downloaded, go to your website.

Click "Add New" either under the Plugins menu or on the Plugins page.

Click "Upload Plugin". This will expand an area where you can fetch the Elementor file you downloaded before.

You can either drag the file onto the "Choose file" button, or click "Choose file", find your Elementor file and click "Open".

Click "Install Now" to upload the file to your website and install Elementor.

Because Elementor is large, you might encounter a WordPress memory limit error or exceed the maximum execution time. Those links will help you fix those issues.

If you can't fix these errors, then you'll have to upload through cPanel. See this section of the tutorial.

Assuming you get through and Elementor successfully installs, you'll see a message that "Plugin installed successfully".

Click the "Activate Plugin" to start using Elementor.

You'll be redirected to the Getting Started page. Scroll down to continue this tutorial by building your first Elementor page.

Install via Plugin Repository

Installing Elementor directly through the WordPress Plugin Repository is usually fine. However, I find this way doesn't work very well in WordPress on XAMPP, which I use for my WordPress development. That's why I prefer to upload through the Dashboard.

If you run into time limit errors or memory limit issues, try to install either by uploading in the WordPress dashboard or via cPanel.

Go to the Add Plugins page either by clicking "Add New" under the Plugins sidebar menu, or by clicking the "Add New" button on the Installed Plugins page.

On the far right, type "elementor". This will filter the plugins for the word Elementor. The first one should be the plugin you want. It will be called "Elementor Page Builder" and be by "Elementor.com".

Click "Install Now" to install Elementor.

Once Elementor is installed, the "Install Now" button will change to "Activate". Click that to activate Elementor and begin using it.

You'll be redirected to the Getting Started page. Scroll down to continue this tutorial by building your first Elementor page.

Install via cPanel

Installing plugins via cPanel is something every webmaster should know. It's a great fallback that will work every time, even if you get time out errors from other methods.

The reason we use cPanel, rather than FTP, is that most FTP programs don't have an Extract function, also known as unzipping. cPanel's File Manager can extract.

If you absolutely have to use FTP, you should unzip the folder on your computer, then upload that folder to the /wp-content/plugins/ folder. If you're on a Mac, the folder may be unzipped automatically. If you're on Windows, right click on the folder and select "Extract All...". If you don't see that option, you may need to install the free 7-Zip program.

Let's upload Elementor through cPanel.

Go to Elementor and download Elementor. You'll probably have to put your email address in to get access. Remember where you saved the file.

Go to the cPanel for you website. This will often be accessible through yourwebsite.com/cpanel or yourwebsite.com:2083.

Click "File Manager", which will open in a new tab.

You might need to go through public_html or yourwebsite.com, but find the wp-content folder for your website. It will be in the root of the website, but your path to get there might be different.

If you can't find wp-content, it might have been renamed. Some webmasters do that as a layer of protection from hacking. If that's the case, look for wp-admin and wp-includes. Those are never renamed. Open the folder that looks like it might have the website content.

You should see a folder called "plugins". Open that.

If you don't have any plugins installed, you will probably just see an index.php file as in the image below. More likely, there will be other folders in here, corresponding to the plugins you have installed.

Click "Upload".

Make sure the "Select the file you want to upload to" path ends in "plugins".

Drag the elementor.zip file into the upload area. The numbers on the file are just the version number.

Alternatively, click "Select File" and find your elementor.zip file where you downloaded it before.

Once Elementor is uploaded, the bar will probably turn green. If you can't distinguish green, just wait a bit after the slider reaches 100%. You should be fine if you go back to File Manager before the slider goes green. Hopefully they make this more accessible in a future version.

Click "Go Back" or close the tab to go back to the File Manager.

In File Manager, make sure the elementor.zip file is selected, then click "Extract" in the top bar.

You'll get a popup with details of what's being extracted where. Make sure it's the Elementor file and being extracted into the plugins folder.

When you're satisfied that the files are going where they should, click "Extract File(s)".

After a few seconds to a minute, the files will be extracted into a folder called "elementor". Click "Close".

You can delete the elementor.zip file that you initially uploaded. Click it to highlight it, then click "Delete" in the top bar.

You will probably get a prompt making sure you want it deleted. There's no reason to keep it around now, so I check "Skip the trash and permanently delete the files".

Click "Confirm".

That's all you need to do in cPanel. You can close those tabs now.

Go over to your website and go to the Installed Plugins page. You may need to refresh the page to see Elementor in the list of plugins. Click "Activate" under Elementor.

Congratulations, you've successfully installed and activated Elementor through cPanel.

Build Your First Elementor Page

After you activate Elementor, you'll be redirected to the Getting Started page. If you've not used Elementor before, the Getting Started video is well worth a watch.

If you just want to jump in and start playing with Elementor, click "Create Your First Page".

Elementor will create a new Page (find it later under Pages).

You'll see the page as it will appear on the front end. Your page will look different depending on your theme and settings.

On the left hand side are all the parts of a webpage you can use in Elementor. You'll have more in there if you use something like Ultimate Addons for Elementor.

Using your mouse, drag the Text Editor block into the area where it says "Drag widget here".

You can also click the plus icon in that area to add a block.

You can directly edit the text on the page or in the sidebar. If you don't have enough room, you can drag the sidebar wider.

As this is just a demo and you're going to delete it later, click "Publish".

When you click "Publish", there will be a popup that lasts about ten seconds. Click "Have a Look" to see the front end of the page.

If you miss that popup, or for later reference, you can see a preview of the page by clicking the eye icon next to the Update button.

Once you've finished with the page, click the hamburger icon at the top left of the Elementor window. That's the technical name for the three horizontal lines that are commonly used to represent "menu".

From this area, you can either view the page, or exit to the dashboard.

You can do a lot of things with an Elementor page, including creating columns, laying out images, headings, videos, full width rows (you'll need a full width page layout) and much more.

Mike Haydon

Thanks for checking out my WordPress and coding tutorials. If you've found these tutorials useful, why not consider supporting my work?

Buy me a coffee

Leave a Comment