Image Cover

Full-page image with text overlay

How To Use It

To create a chapter cover page or for a full-screen image - this is the page template to use. Image Size & Format Insert an image at the dimensions specified below. If your image is not the exact size, it will automatically be cropped / resized depending on the image orientation you select (portrait and landscape are cropped, whereas auto will only resize).

Images must be in .svg, .jpg or .png format.

Orientation

Width

Height

Landscape

1900

1268

Portrait

800

1200

Auto

Any

Any

Tip Choose images that can still be effective when clipped for mobile devices. Select "Rotate to Fit" if you want the image to display landscape on mobile screens.

Features

Features

Yes

Background Colours

Yes

No

Interactive

No

Yes

Options & Settings

Option/Setting

Text Layout Type

Heading & Sub-Heading (small heading max. 24 characters and big heading max 45 characters), or Heading & Text (big heading with max. 45 characters and text with max. 144 characters).

Text Position Choose the heading text position: Center, Top Left, Top Center, Top Right, Bottom Left, Bottom Center, or Bottom Right.

Text Colour Select from the available options.

Text Shadow Select Yes/No.

Image Effect (Non-Mobile) For the desktop and tablet view, add image effects: Shadow, Framing or Framing with Shadow

Screen Adaption (Mobile Only) Set how you would like the image to appear on screen, i.e. Rotate to Fit or Clip to Center/Left/Right (note that if you do not want your image to be clipped on mobile view, you should select "Rotate to Fit").

Position & Fill Settings

Position Determines the origin where the image must be anchored when the image fills the screen. Image Fill Determines how the image must fill the screen.

  • Full Width / Height (Default) Fills the screen with the image until width and height of the screen is covered. Best option for non-critical or aesthetic only images.

  • Full Width Fills the screen with the image until the width of the screen is covered. Best option if the width of the image is more important to see than the height.

  • Fill Height Fills the screen with the image until the height of the screen is covered. Best option if the height of the image is more important to see than the height.

  • Contain Width / Height Ensures the entire image is visible on screen and will automatically adjust width and height

Image Orientation Sets the aspect ratio of the image. The options are Landscape, Portrait and Auto. Only landscape and portrait will ensure images are cropped into correct ratios.

pageSimulate & Preview

Last updated