Follow

Images

Introduction

Images create a powerful impression in the first few seconds a visitor is in your app. Learning how to effectively use images is a great skill and this article will provide tips in getting the most out of images in your app.

 


 

Images sizes and aspect ratio

See table below of recommended image aspect ratios.

Widget type Layout / image type Aspect Ratio Recommended size (px)
Article Small image 10:7  300 x 210 *
  Large image 10:7  1040 x 728
Article (with summary) Small image Square  300 x 210 *
  Large 10:7  1040 x 728
Review Small image 10:7  300 x 210 *
  Large image 10:7  1040 x 728
Latest widget article - 10:7  300 x 210 *
Product widget Small image 10:7  300 x 210
  Large image 10:7  1040 x 728
Event widget 15:4  1040 x 717
External Link widget - 10:7  300 x 210
Quote widget Thumbnail icon Square  80 x 80
Quiz Main image 3:5  342 x 570
  Background image 10:7  1040 x 728

 * Recommended override image size

 

Note: Articles, reviews and latest widget stories may require a larger image than the other widgets because they will display the image in the content view. Consider using an override image for the timeline to keep image size down.

 


 

HOW TO CROP IMAGES FOR ASPECT RATIOS

1. Upload or select an image for the widget

When you add an image to your widget, the standard media library popover will appear.

Select an image and locate the Edit Image link in the media library panel on the far right. Click the link.

 

Screen_Shot_2017-02-22_at_10.58.35.png

 


 

2. Open editing mode

From this screen you will be able to edit your image using any of the tools provided.

Screen_Shot_2017-02-22_at_11.07.16.png 

 


 

3. Crop image using aspect ratio

Drag your mouse over the image to highlight an area to crop.

Add your ratio values into the Aspect ratio fields provided in the Image Crop box. You'll notice your previous image selection snap to the new aspect ratio.

Drag the selection into the correct position and click the Crop icon. This will crop the image into your new aspect ratio.

Screen_Shot_2017-02-22_at_11.25.50.png

 


 

4. Save image 

Click save. Navigate back to the article / widget and select the newly cropped image from the media library.

 


Was this article helpful?
0 out of 0 found this helpful
Have more questions? Submit a request

Comments

Powered by Zendesk