Focal points

Modified on Mon, 04 Sep 2023 at 08:11 AM


This document provides an overview of the Focal Points feature and its implementation in Imageshop. The Focal Points feature makes it possible for the user to specify a specific part of the image to be the central focus. This feature aims to ensure that automatic cropping or resizing maintains the desired content of an image. 

The user can set the focal point in various ways, such as interacting directly with the image on the detail page, accessing a specific focal points page, using the image picker, or through the Web API.

Focal points are also made available through the Web API, allowing the end user to make use of the focal points to fit their needs.    


Focal point page

The Admin application includes a focal point page in order to set focal points on several images efficiently. The page has support for searching and filtering to help find desired images, and also has an option to display images with missing focal points. The focal point changes will be stored in the browser session until they are saved by pressing the “Save all” button, or the session expires. 

Imageshop - Focal point page


The detail page in the Admin application is extended with an option to edit the focal point of an individual image. When clicking the “Edit focal point” button, an editor is displayed with a focus point marker. The user can then edit the focal point and save it by pressing “Save focal point”, or cancel the operation. 

Imageshop - Detail page

Imageshop - Detail page with focal point editor

Image picker

In the image picker, users are able to edit the focal point for individual images, in a similar fashion as in the detail page in the Admin application. The chosen focal point will be taken into account when automatically cropping an image based on certain dimensions in the image picker. 

Imageshop - Editor in image picker

Imageshop - Editing focal point in image picker


The Imageshop Web API supports setting, getting and deleting the focal point for a document, as well as retrieving focal points for several documents. The corresponding endpoints are shown in the table below. 

API methods for Focal Point

Imageshop - Focal point endpoints







focalPoint (DocumentId, SubDocumentId, X, Y)

Set a focal point. 
Return values:

  • 0 = Success

  • 1 = Out of range

  • 2 = Not updated

  • 3 = Unknown error

  • 4 = Unauthorized



documentId (integer)

Get focal point for document with the given id.

Return values:

  • Null or focal point



documentIds (array[integer])

Get focal points for documents with the given ids

Return values:

  • Null or list of focal points



documentId (integer)

Delete focal point for document with given id.

Return values:

  • 0 = Not deleted

  • 1 = Deleted


All permalinks where CropMode is set to ZOOM and where the whole image is selected in the cropped area, will use focal point to fit the given width and height, with a fallback to the center point. In addition there are two simplified methods designed to give and easy way to create permalinks for a given DocumentId and a desired width and height or profileId. Permalinks created with these methods will result in images which uses the given focal point or center of the image as focal point if focal point is not provided.

Imageshop - Focal point endpoints







documentid (integer)

Creates a permalink based on the given width and height.

Return values:

  • Permalink and width and height.




Creates a permalink based on the given profileId

Return values:

  • Permalink

Was this article helpful?

That’s Great!

Thank you for your feedback

Sorry! We couldn't be helpful

Thank you for your feedback

Let us know how can we improve this article!

Select atleast one of the reasons
CAPTCHA verification is required.

Feedback sent

We appreciate your effort and will try to fix the article