Using focal points to center images

false

Using focal points to center images

Last updated September 02, 2026 20:23

Control how an image is centered by manually setting the point of focus.

Many image areas on your site have a built-in centering feature called the focal point. The focal point sets the focus of an image, giving you control over where the image is centered.

Images with focal points

You can adjust the focal point for most images.

In version 7.1, you can adjust the focal point for:

  • Image blocks
  • Gallery sections
  • Featured images
  • Section background images

In version 7.0, you can adjust the focal point for:

  • Image blocks
  • Gallery blocks
  • Gallery pages
  • Featured images
  • Most banner images

Note:It's not possible to edit the focal point of a product featured image. To learn more, visit Add and style product images.

Focal points aren't optimized for:

  • Background images in version 7.0 uploaded in site Styles - These images don't have focal points. To adjust the image's focus and cropping, use the Position and Size site styles tweaks.
  • Images with parallax scrolling - These images have focal points. However, because of how parallax scrolling works, the changes may not have a noticeable impact on an image's position, especially for short, wide images.
  • Videos in any area of your site.

Tip: You can crop and resize images using other built-in tools.

Set the focal point

  1. Open the block, section, or image.
  2. Hover over the image to display the focal point, which looks like a small circle. This example uses a page featured image, but the process is similar for all focal points.

The focal point in the center of the image (new).png

  1. Click and drag the focal point to set the central focus area.

The focal point moved to the top of the image

The area set by the focal point now appears as the center of your image. The new focal point automatically saves in the new position, even if you don't click Save.

Tip: For some images, the focal point may jump to the center of the image if you attempt to set it very close to the center. This is expected, and only happens when the move from center would make no visual difference.

More help

Image size and shape

The height and width of your image, and the shape of the container that it's filling, have a big impact on how much of an effect the focal point has.

For example, if you add a landscape-oriented image to an image block that's set to display as a square, any horizontal changes you make to the focal point will make a big difference. The image is wider than the container, so there's room on either side for it to re-center.

The focal point centers the image within a container's aspect ratio.

On the other hand, if your image's container and the original image are the same basic shape and size, moving the focal point won't make a big difference.

Tip: To adjust the container height for image blocks, use the cropping handle.

The focal point centers image that is the same size and shape as the container.

  • You can adjust the focal point in the main gallery page or gallery section editor. To make fine-tuned changes, use the image editor.
  • In version 7.0, if you've set up a gallery block to pull images from a gallery page, make the focal point changes within the gallery page.

Image display

If your image looks fuzzy or distorted:

Was this article helpful?

Yes No

73 out of 171 found this helpful

Yes No

Using focal points to center images