Image of dogs to change on website
|

How to change images on Divi built websites

Watch the video

Or scroll down for a step-by-step guide on how to change images on your Divi-built website. We will go over both regular and background images in the video but only regular image modules in the text-based guide below.

Step-by-step guide for Divi site image changing/swapping/updating

Step 1: Log in

You may need to contact your site administrator for this one if you don’t already have access. Often times the login page is simply “yoursite.com/wp-admin”. However, if your site was built with security in mind, as all IdeaSwell sites are, this is likely not the case. If you’ve forgotten your password, simply hit the “Lost your password?” link and a reset email will be sent to you.

step 1 - login to your website
step 1 – login to your website

Step 2: Find page

Here you will first need to access the front end of your website. The simplest way to do this is by hovering over the name of your site in the top left. In this case “Paws Rescue”.

Once you are on the front end of the site, navigate to the page where the image you want to edit resides. In our case for this demo, it is the homepage so we move on to the next step.

View front end of site
View front end of site

Step 3: Enable visual builder

At the top of the website, you will see an option to “Enable Visual Builder”. Click it.

This is the best feature of Divi and the main reason why we choose this system for our WordPress website builds when a client needs to be able to manage the content of the website. There is no better, or easier option to allow clients to manage the content on their websites without coding or advanced web design skill.

The only other option would be utilizing a different system such as Wix. However, with such sites as Wix, we are unable to achieve the proper design and advanced functionalities.

Enable the website visual builder
Enable the website visual builder

Step 4: Edit Icon

As you hover over the elements within the site you will notice the bounding boxes appear. Look for the innermost grey box and click on the GEAR icon.

The divi image module gear icon
The divi image module gear icon

Step 5: Enter Image Adjustment Portal

From here, if you want to choose a different image, simply select the gear icon or click on the image.

Enter the image changing section of the divi built website
Enter the image changing section of the divi built website

Step 6: Select a new image

In the top left, you will notice you have two tabs: “media library” & “upload”. You will likely need to upload your image. Simply click that tab and then hit the “upload” option. This will allow you to search your computer and upload the new image.

Once you’ve uploaded it, hit the “upload an image” button. This button is a bit deceiving is you will have already uploaded it. A more appropriate title for this button would be “Insert image.

Image upload options or select from media library
Image upload options or select from the media library

Step 7: Save, Purple Circle & Save Again

The saving process is a bit much, but the redundancy has its perks.

First, hit the green checkmark box.

Next, hit the purple circle at the bottom center of your site. This will open up the “Save” button. Hit it.

*If you don’t see the purple circle, just look for the save button. It may already be expanded.

Save the divi module
Save the divi module
Final save of your new image on your divi built wordpress website
Final save of your new image on your divi built wordpress website

Similar Posts

Leave a Reply

Your email address will not be published. Required fields are marked *

three × three =