How to change an image in Elementor

Opening your website page in Elementor

Editing a WordPress website in Elementor is very user-friendly. It allows website administrators to make simple changes such as changing text and images without having to be code savy.

There are two ways of opening a page in Elementor. 

  1. Opening via pages: In your dashboard, click on pages. View all pages in the dropdown. Find the page you wish to edit. Hover over the page name and a list appears beneath. Click on edit with Elementor.

    (Please note:) if you click on edit, the page will open in the WordPress page view. Click on the blue button at the top which says Edit with Elementor).

  2. Opening via your browser: View your website in your browser. Go to the page you want to edit. On the top admin bar, you will see Edit with Elementor. Click on that to open the page in Elementor.

    (Please note: if you do not see an admin bar at the top of your browser, go to Elementor in your dashboard, click on settings and then experiments. Scroll down to where it says Admin Top Bar. In the drop down next to that, click on Active and then save the page by clicking save changes at the bottom of the page).

Image to show accessing Elementor via pages from the dashboard.

Image to show accessing Elementor via the admin top bar in your browser.

How to edit an image within your page design in Elementor

When you click on edit with Elementor, the page will load. On the left are the Elementor widgets and to the right of that, the designed page sections and elements. The amount of widgets available depends on whether you have the standard version or the PRO version.

Hover your mouse over the image you want to edit. You will see a blue line surrounding the image which is known as a section. At the top is a blue area with a plus sign, 6 dots and a cross. If you hover your mouse over the plus sign, an ‘add new section’ appears. If you hover over the dots, an ‘edit section’ appears and hover over the cross, a ‘delete section’ appears. To the right of the section is a small arrow. Hover over that and an edit section appears. Right click the arrow and a drop appears.

You can either edit the image by clicking on the blue arrow to the right or click directly onto the image within the section.

Edit the image from the media libary

When you click on the image you wish to edit, it will appear to the left within the image widget. Click on the image in the left area and this will open up your media library. 

From here you can either choose an image within your library or upload a new image. Choose the new image and then click on insert media at the bottom of the page.

When you click on insert image, the media library page will disappear and you will see the new image within your page design.

To save your page, click on the green update button at the bottom. This will save your page. You can now exit the page and view it in your browser. You might need to refresh the page to see the updated image. If you do not see the updated image, there may be caching on the server. Clear your cache files on your browser and refresh the page again. The new image should now show.

And it is that easy! 

Find out further information on Elementor Training.

ABOUT PLUSWEB

PlusWeb provide affordable small business web design. Create an affordable web presence with a custom designed WordPress website.

CONNECT

RECENT POSTS

Scroll to Top