Canvas Focal Point Widget
Extends the Canvas editor interface with a per-instance focal point picker and optional image scale slider. Unlike the standard Focal Point module which sets a global focal point on the media entity, this module allows different focal points on the same image in different component contexts.
Canvas Focal Point Widget solves a specific limitation of the standard Focal Point module: focal points are set at the media entity level and apply globally. If the same image is used in a hero component and a card component with different aspect ratios, both components share the same focal point even if that produces a poor crop in one context.
This module adds a visual focal point picker directly to Canvas component image props. The picker renders a drag-and-drop dot overlaid on a live image thumbnail, allowing editors to set the focal point for that specific component instance without affecting other uses of the same media entity.
An optional scale slider (covering 100–200%) appears automatically when a matching scale prop is present in the Canvas component definition. The module auto-discovers prop pairs following a consistent naming convention, so no additional configuration is required beyond defining the props in the component.
The module is explicitly described as a work in progress and was built with AI assistance. It is not covered by Drupal's security advisory policy and is best evaluated on non-production environments first. For teams already using Canvas with Focal Point, it addresses a real content editor pain point.
Let’s talk
Ready to stop worrying
about your Drupal site?
Start with a free audit — no commitment, no jargon. Our engineers will review your site and send you a plain-English report within 48 hours.
0207 490 2311 · hello@websitesupport.io