How to Add Images to Your WordPress Webpage
Editing Background Image of a Column or Row
Go to the Backend Editor of the page you wish to edit.
Select the pencil icon of the column or row you want to change.
Go to the design options tab and click the + or select a background color.
Add an existing image or upload a new one. You will see this appear where the + previously was. Below the new image, in the same tab, use the drop-down menu to choose how you want the image to appear. (We usually select cover).
Save changes and Update/Publish.
Make sure your photos are appropriate dimensions (most background images should be at least 1920 pixels wide) and small in size (at the largest around 200-300 KB). You can use Photoshop or another editor to compress the photo. If you are using Photoshop, go to File > Export > Save for Web and save as a JPG at ~60-70% quality. If your image has transparency, choose PNG-24.
Editing Background Image of a Page Section
Once in the Backend, select the pencil icon of the page section you wish to edit.
In these settings upload a background image. Below the background image is the option to add a background image (Portrait). Upload an image here that is mobile-friendly or has a 2:3 ratio. (We usually crop our background image and center it correctly so it looks good on mobile).
Save changes and Update/Publish.
Adding a Single Image
Click + in the area you would like the photo to appear. Add an image from the elements list.
You will be prompted to change settings and upload a photo.
Save changes and Update/Publish.
Adding an Image Gallery
Click + in the area you would like the photo to appear. Add an image gallery from the elements list.
You will be prompted to change settings and upload photos.
Save changes and Update/Publish
Tips & Tricks
You can choose if you would like elements visible on specific devices. Go to the element and its settings. Find the width & responsiveness tab. Check devices where you want to hide the element.
