Focus Point

Set the important part of an image once; MediaHub uses it when framing auto-generated crops and when you open the crop editor.

A focus point tells MediaHub which part of an image matters most. Once you move the marker away from its default centre position, auto-generated crops frame around that point rather than the geometric centre of the image — keeping your subject in frame regardless of crop ratio.

Setting a focus point

You can set or adjust the focus point from three places:

Asset detail page — click Focus point in the Actions panel. The unified editor opens on the full source image.
MediaHub field card (Detail mode) — click Focus in the Crop · Focus · Edit action strip below the filename. The editor opens without leaving the page editor.
Inside the crop editor — toggle Focus in the editor toolbar to show or hide the marker while you work. Crop and focus editing share the same canvas.

Drag the marker to your subject and click Save focus point. The marker defaults to the centre of the image until you move it. Closing the editor without saving discards any move you made in that session.

How focus point affects crops

Auto-generated crops

When MediaHub generates a crop — through ensureCropImage() in a template, upload automation, or the admin lazy-generation pass when a field renders — it reads the stored focus point and positions the crop window around your subject. If you have not moved the marker from centre, crops use a centred frame as before.

Inline crop badges

Inline crop badges on MediaHub field cards are generated using the focus point when the page editor renders. If you reposition the focus point after badges have already been generated, re-saving the page regenerates any lazily-created crops around the new position.

Manually positioned crops

Auto-generation never overwrites a crop that an editor has manually positioned. To apply a new focus point to an existing manual crop, open the relevant badge or library crop, reposition the selection, and save again.

Choosing a preset in the crop editor also positions the initial crop boundary around your focus point when one has been moved from centre.

Field setting

The Focus button can be enabled or disabled per MediaHub field:

Setup → Fields → [your field] → Input → Media Hub Picker Settings → Focus point selection

Option	Behaviour
Enabled (default)	Focus button visible on Detail-mode cards and in the edit drawer
Disabled	Focus button hidden for this field — useful for icons, logos, or decorative graphics

Important: changes apply everywhere

The focus point is stored on the source image using ProcessWire's native Pageimage::focus() API. Because MediaHub assets are centralised — one file, referenced from any number of pages — changing the focus point changes it for every page that uses that image across the entire site.

This is by design. If you need different framing on different pages, use manual crop positioning rather than the focus point.

SVG assets

Focus point is not available on SVG (vector) assets. SVG files scale to any size without losing detail, so there is no framing decision to make at output time. The Focus button is hidden on SVG cards and on the SVG asset detail page.

Focus point continues to work on raster images (JPG, PNG, GIF, WebP) as usual. See Configuration → SVG Support for opt-in SVG uploads.

Menu