All Collections
In-App Messaging
Message Edition
What is the required image size for In-App messages?
What is the required image size for In-App messages?

Batch adapts automatically the format of the In-App message to the screen size. It means the image won't look the same on all devices.

Claire avatar
Written by Claire
Updated over a week ago

You can choose between two display modes for the image included in your In-App message. This can be done from the dashboard settings, in "Themes": 

Cover: Batch will use the entire width of the screen to display the image. In portrait mode, depending on the screen size of the user device, the bottom and the top of the image will be cropped.

We recommend a square file, with a width of 1200px. Make sure the important part is not in a zone that may be cropped (the red zone):

Contain: Batch won't crop the image vertically.
You will now have two empty spaces on the left and the right of your image. 

If you choose the Cover mode, we recommend you use the same colour for the background of your In-App message and the background of your image.

Special formats

Image

Introduced in Batch 1.14.0, In-App Image messages enable you to display a full-screen image or a modal with a close button or an auto-close timer.

  • If you want the In-App to appear like a modal, you need to upload a square image, with a width of 1200px.

  • If you want the In-App to appear like a fullscreen, you need to upload an image with a 2:1 ratio (for example 1200x600 pixels).

Since the In-App will adapt itself to the different screen sizes of the device, be sure to test the outcome on several different ones.

Webview

Introduced in Batch 1.17, In-App WebView messages enable you to display any web content in your app, while still leveraging Batch's campaign targeting, push and In-App trigger engine.

Any HTML content can be displayed, allowing you a wide range of possibilities.

Be aware that your message might be displayed in virtually any display size and aspect ratio:

  • iPhones (from an iPhone 5 to 12 Pro Max)

  • Android phones

  • Landscape phones

  • Tablets both portrait and landscape

  • Tablets in split-screen mode (1/3 of the screen) or free-floating windows

Use responsive web design techniques (CSS Media queries, Flexboxes, Grids, etc...) to handle this. Firefox, Chrome and Safari all come with tools that allow you to test your content on various form factors.


This article belongs to Batch's FAQ. Need more help? Find insightful articles, documentation, case & market studies, guides, and even more in our website's Resources section on batch.com and our blog.

Did this answer your question?