Focal Points are areas of your 2D image that you want to highlight, and be present, across different image sizes and display dimensions for the image, based on where it is used in your Circuit Virtual Tour, including for responsive image placements.
This ensures the most important part of an image remains visible, even when its size or cropping changes based on screen size. With your focal point set, images placed in responsive layouts will use a focal point as an anchor, which allows the image to scale or crop flexibly while keeping the key visual area in focus.
Key Features
Focal point anchoring: Images placed in responsive layouts use a focal point as an anchor. This allows the image to scale or crop flexibly while keeping the key visual area in focus.
Automatic detection: When you upload and save an image, a focal point is automatically detected for faces and set. This helps preserve the visual integrity of your content without any extra effort.
Manual editing: You can override the automatic focal point by manually setting one in the image settings.
Applies to key placements: Focal point support has been added to a number of key areas across the front end.
After adding the focal point, the image focus will change in various places within your tour experience, such as on the tour detail page below. Note that this change can take up to 15 minutes to display on the live site. If you open your tour in an incognito/private browser window, it will reflect the latest changes.
Define an Image Focal Point
Upload and save an image in the Images section of your CMS — a focal point will be automatically generated and used by the virtual tour.
Manually adjust the focal point at any time to better control how the image appears.
Click on the image in the gallery of images in your library
Drag your cursor within the image preview window to define a focal point area. To edit your selection, move your defined area or click Remove focal area and draw a new area.
Click Save
Learn more about images in your Circuit CMS