Breadcrumb

Guternberg Images

 

Placing an Image with Gutenberg

To add an image header, right click on the page to open the Block types window and click on Image. 

add image block

This will open a window that will allow you to upload a new image or choose from the Media Library. We recommend picking from the media library for now.

Media Library window

 Once you've made a selection, place this on the page by clicking Insert. The image will then be loaded onto the page:
Right off the bat, you will be able to add captions to this image, and resize it.

Uploaded Image

On the Right hand panel of the Gutenberg Editor, click on Block. Here you'll see various image settings such as adding Alt Text to your image, and choosing the Image size.

GB Image settings

 

Resizing Images in Gutenberg

The Image size dropdown gives you the various Image Styles that we offer and should be familiar to you:

Image Sizes


You can also set manual height and width sizes or even drag the blue anchor points on the image to resize it, but this needs some work as our default styles will override them in some cases. 
 

Turning Images into Hyperlinks

Once you have an image placed on the page, you now have an option to turn it into a hyperlink.
Simply click on the image to activate its context menu. And on the top bar, look for the chain icon.
Here you can type in the URL of the site you want to link to.
 

hyperlink image