Get Started

Cropping Images to Fit Your Layout

Published

Overview

An image that almost fits is one of the most common reasons an email looks off — a product photo that’s slightly too wide, a headshot with too much empty space above it, a banner that’s the wrong shape for its slot. This guide walks you through cropping any image inside Temway so it lands in your layout at the right shape, without opening a separate photo editor.

By the end you’ll know how to open the crop tool, adjust the selection, lock the aspect ratio when you need to, and re-edit or undo a crop later.

When to crop inside Temway

Reach for the crop tool any time the image and its container don’t agree on shape:

  • Fit a fixed-ratio slot — a square logo, a wide hero, a tall product tile.
  • Tighten a loose photo — cut dead space around a subject so it reads at small sizes.
  • Remove distractions at the edges — a stray hand, a border, a watermark you don’t want.

For one-off crops, doing it inside Temway is faster than round-tripping through a separate app and re-uploading.

Opening the crop tool

  1. Click an Image block that already has an image in it.
  2. In the properties panel, click the Crop button underneath the thumbnail.
  3. A window opens titled Crop image, showing your photo with a draggable selection box on top.

If the button isn’t there, make sure the block has an image — the crop tool only appears once an image is in place.

Adjusting the selection

The selection box has eight handles — one on each corner and one in the middle of each edge.

  • Drag inside the box to move it.
  • Drag a handle to resize. Corner handles change both dimensions; edge handles change one.
  • Hold Shift while resizing to lock the selection to the block’s aspect ratio. Useful when the slot has a fixed shape and you don’t want to distort it. Release Shift to go back to free-form resizing.

When the block doesn’t have a target shape — for example, a single full-width image — Shift has nothing to lock to and resizing stays free-form.

Applying, resetting, or cancelling

Three buttons sit at the bottom of the window:

  • Apply — saves the current selection and closes the window. The thumbnail in the properties panel updates to show the cropped result.
  • Reset — moves the selection back to its starting position for this editing session, sized to the block’s aspect ratio.
  • Cancel — closes the window without changing anything.

Re-editing and clearing a crop

A crop isn’t permanent. Click Crop again on the same block and the window opens with your last selection already in place — drag it further, start over with Reset, or apply a new one.

To remove a crop entirely, drag the selection box until it covers the whole image again (or use Reset if it was your most recent change) and Apply.

What you see is what ships

The thumbnail in the properties panel always reflects the current crop, so you can confirm the framing before you export. When you export the email, the crop is part of the final image — subscribers see the cropped version, not the original.

Tips

  • Crop before you compress. Cropping cuts the parts of the image you don’t need, which also keeps file size down.
  • Match the source to the slot. If you’re picking a stock photo, choose one whose subject already sits where your crop will land — gentler crops look more natural. See Adding Photos and GIFs with Unsplash and Giphy.
  • Keep one ratio per row. If you’re building a product grid, crop every cell to the same ratio so the row lines up cleanly.
  • Update alt text after cropping. Alt text describes the cropped result, not the original — refresh it if the framing changed what the image shows.

Next steps