How to Add Images to Your WordPress Webpage

 In WordPress Technical Center

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.

How to Add Images to Your WordPress Webpage

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).

How to Add Images to Your WordPress Webpage

Save changes and Update/Publish.

How to Add Images to Your WordPress Webpage

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.

How to Add Images to Your WordPress Webpage

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).

How to Add Images to Your WordPress Webpage

Save changes and Update/Publish.

How to Add Images to Your WordPress Webpage

Adding a Single Image

Click + in the area you would like the photo to appear. Add an image from the elements list.

How to Add Images to Your WordPress Webpage

You will be prompted to change settings and upload a photo.

How to Add Images to Your WordPress Webpage

Save changes and Update/Publish.

How to Add Images to Your WordPress Webpage

Adding an Image Gallery

Click + in the area you would like the photo to appear. Add an image gallery from the elements list.

How to Add Images to Your WordPress Webpage

You will be prompted to change settings and upload photos.

How to Add Images to Your WordPress Webpage

Save changes and Update/Publish

How to Add Images to Your WordPress Webpage

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.

Recent Posts

Start typing and press Enter to search