Whether you want to add an image to a page or edit an existing image, first navigate to the edit page for the relevant page in the WordPress admin area. These instructions are for when the default WordPress block editor is being used.
NERD LEGAL TIP:
Always ensure you have permission to use any images on your website to avoid copyright issues. You may also require model releases if you have pictures of people.
Adding an image
To add an image – or any other block type – we can either use the blue ‘plus’ button on the top left which will add a block to the end of the existing content, or the black ‘plus’ button in the content area.
The first option will show the full range of blocks, the second (shown below) will show the most recently used ones. Whichever one is used we need to select the image block.
This will bring up a set of controls that allow us to select the image we want to insert. Three different methods are offered. The first will bring up the standard ‘File Upload’ selector from the computer’s OS in which you select the image on you computer and it will upload it.
The second will allow you to work within the WordPress Media Library, which is a repository for all uploaded content.
The third option allows you to add the URL for an image anywhere on the internet that will display on your website.
NERD CAUTION:
The third option does not by default create a copy of the image on your website, but loads it from the third party site every time. This is considered ‘hotlinking’ – a frowned upon practice. Also if that image is removed or changed on the third party website it affects your page. Once you have entered the image URL you will see an option to load the image onto you website, so this should be done if you use this option.
The second method ‘Media Library’ is the recommended option to use.
The two tabs allow you to either upload an image or select one that has already been uploaded. Once an image is selected ensure you add an ‘Alt Text’ if appropriate. An example of why this is important is if a screen reader is being used by a visually impaired person, the screen reader will use the alt text when it reaches that part of the page.
Once you have selected your image click ‘Select’ to place it in the page. The image will be accompanied by a set of controls, one being an optional caption.
One of the more commonly used control is to make the image a link. This can be enabled by clicking the chain icon. You can enter an URL, or in the same box start typing the name of one of your other pages and a list will appear. If you use either of these options make sure you click the return arrow on the right of the box to enable it.
Another commonly used setting is to change the image alignment.
Editing Images
To edit an existing image just click on it and the settings options will appear as above. If you want to replace the image just click ‘Replace’ and you can upload or choose a new one from the media library.
If you want to delete the image click the three dots at the end for the delete option.
Block Settings
When we have an image selected, just like any other block there will be additional options on the right of the page appropriate to the block giving us additional controls.
Once we have finished adding / editing our image make sure click the blue ‘Update’ button on the top right of the page to save the changes.