Wide Image

This video is going to introduce you to the wide image block.

Wide image blocks can be used for large, high-quality images that you want to spread across the entire screen. They’re great for banners at the top of the page – like we have on our homepage for this documentation site. But you can also add a wide image anywhere on your posts or your pages.

When you create a new page, the block at the very top, or the page banner, is a text and image block by default. To convert it to a wide image block, click this icon in the contextual menu and select Wide Image.

The wide image block is made up of a title, a background, as well as content such as a paragraph or a set of buttons.

Let’s start by adding a title. You simply type in the text area at the top that’s available.

 To change your background between light, dark or an image, click on the display options drop down menu on the right of the screen, then select the background option you want, for the purposes of this video, we will select the image option.

From there, you can either upload from your computer or choose something from the media gallery. Please note that the image must be a minimum size of 1600 by 700 pixels.

Under block options, you can darken or lighten the image using the Image Darkness slider. It’s often helpful to increase this slider, especially if the image shown is very light, so that the title text ends up more readable.

You can also change the relative position of the image by dragging this circle.

Use the Replace Image and the Remove Image buttons if you would like to change or delete the image.

To add more content click the Add Content toggle.

From there you can add either a paragraph or a button using this blue button.

You can add the paragraph and type right away,

While you can add the buttons and give it a name, choose between multiple highlight styles, width settings, as well as linking the page by clicking the link button on the contextual menu.

To add another button, click on an existing button and click on select buttons

You can now add another button by clicking the blue plus button, be sure to also format it and give it a link.

Now that we have done those steps, we have now successfully added a wide image block to a page