How to Fix News Post Image Crops Incorrectly on Mobile

When you publish a news post on a SharePoint communication site, the featured image often looks distorted or cropped incorrectly on mobile devices. This happens because SharePoint applies a fixed aspect ratio to the image thumbnail, and the image you selected does not match that ratio. In this article, you will learn why the cropping occurs and how to prepare your images so they display correctly on mobile screens.

Why SharePoint Crops News Post Images on Mobile

SharePoint uses a fixed 16:9 aspect ratio for the featured image in news posts. When you upload an image that has a different ratio, SharePoint automatically crops the image to fit the 16:9 frame. The cropping is not random — SharePoint attempts to keep the center of the image visible. On mobile devices, the thumbnail area is narrower, which can make the cropping appear more aggressive or cut off important parts of the image.

The cropping happens at two levels. First, when you set the featured image in the news post editor, SharePoint generates a thumbnail at 16:9. Second, when the news web part renders on a mobile screen, the browser further scales the image to fit the device width. If the original image had a tall portrait orientation, the top and bottom get trimmed. If the image was very wide, the left and right edges get trimmed.

The feature responsible for this is the News Web Part on the SharePoint home page or site page. It uses a background image style that fills the container. There is no setting in the news web part to change the aspect ratio. The only control you have is the image you upload and the focal point you set in the news post editor.

Steps to Prepare Images for Correct Mobile Display

1. Open your image in a photo editor
   Use any tool that can crop images: Microsoft Photos, Paint, Adobe Photoshop, or a free online editor like Pixlr or Canva. You need to set the aspect ratio to 16:9 and the resolution to at least 1200 pixels wide.
2. Crop the image to 1200 x 675 pixels
   Set the crop tool to a fixed aspect ratio of 16:9. Then resize the image so the width is exactly 1200 pixels and the height is 675 pixels. This ensures SharePoint does not need to crop anything — the image already matches the thumbnail frame.
3. Save the image with a descriptive file name
   Use a name like “news-header-innovation.jpg” or “event-announcement-16×9.png”. Avoid spaces and special characters. Save the file in a folder on your computer or directly to the SharePoint site assets library.
4. Upload the image to the SharePoint site assets library
   Go to your communication site. Select Site contents > Site Assets. Choose Upload and select your cropped image. Alternatively, you can upload directly in the news post editor.
5. Create a new news post or edit an existing one
   On the site home page, select + New > News post. Or open an existing post and select Edit.
6. Set the featured image
   In the news post editor, select the image placeholder at the top. Choose Change image. Browse to the Site Assets folder and select your 1200 x 675 image. Select Open and then Insert.
7. Set the focal point
   After inserting the image, hover over it and select the Set focal point icon (a crosshair symbol). Click on the most important part of the image — for example, a person’s face or a product. This tells SharePoint which area to keep visible if cropping still occurs on very small screens.
8. Publish the news post
   Select Post news or Republish. Open the site on a mobile device or use the browser developer tools to test the display.

Alternative Method: Use the Image Web Part Instead

1. Edit the site page
   Open the page where the news web part is located. Select Edit at the top right.
2. Remove the news web part
   Select the news web part and choose Delete from the toolbar.
3. Add an image web part
   Select the + icon on the page. Choose Image from the web part gallery.
4. Configure the image web part
   Select Change image and upload your 16:9 image. In the image web part properties, set the Image size to Fit or Fill. Fit preserves the entire image without cropping. Fill crops to fill the container but respects the focal point.
5. Add a hyperlink to the news post
   In the image web part properties, expand Link. Paste the URL of the full news post. Select Apply and then Publish.

Common Issues with News Post Image Crops

Image Still Cropped After Uploading 16:9 Image

If you uploaded a 16:9 image but the thumbnail still looks cropped, check the image dimensions. Some images have a 16:9 ratio but are smaller than 1200 pixels wide. SharePoint may scale them up and then crop again. Use an image that is at least 1200 pixels wide. Also verify that you set the focal point — without it, SharePoint defaults to the center of the image, which may cut off edges.

News Post Thumbnail Looks Fine on Desktop but Not on Mobile

This is normal behavior. Desktop screens have a wider layout, so the 16:9 thumbnail fits without visible cropping. Mobile screens are narrower and taller, so the same thumbnail appears smaller and the cropping becomes more noticeable. The fix is to use an image where the main subject is centered and occupies at least the middle 60% of the frame. Avoid placing important text or faces at the edges of the image.

Image Quality Appears Blurry on Mobile

SharePoint compresses images to reduce page load time. If the original image is low resolution, the compression makes it look blurry. Upload images with a minimum width of 1200 pixels and a file size under 2 MB. Use JPEG format for photographs and PNG for graphics with text. Do not use BMP or TIFF files — they are too large and SharePoint will compress them aggressively.

News Post Image Display Methods: Background vs Inline

Item	Background Image (News Web Part)	Inline Image (Image Web Part)
Cropping behavior	Always crops to 16:9, no resize option	Fit mode shows full image, Fill mode crops to container
Mobile responsiveness	Scales with container, may crop edges	Fit mode preserves aspect ratio, Fill mode crops
Focal point support	Yes, set in news post editor	Yes, set in image web part properties
Hyperlink to full post	Automatic, click on title or image	Must be added manually in web part properties

You can now prepare your news post images to display correctly on any mobile device. Start by cropping every featured image to 1200 x 675 pixels using a photo editor. Set the focal point on the most important area of the image. If the news web part still crops too aggressively, replace it with an image web part that uses Fit mode and link it to the full news post. For advanced control, use the SharePoint PnP PowerShell module to batch-update news post images with the correct dimensions.