Site Studio
Focal point module compatibility
Focal point is a popular module used for selecting the most important part of an image when uploading the image through the UI. Focal point can be used with Media entities within Site Studio.
The Focal point module provides two image style effects which should be applied to your image styles to render out with the focal point that a user sets.
The focal point of an image is set at the time it is uploaded, this is handled by Drupal. This can be done as you would usually do within Drupal when creating a new piece of image media.
To use a focal point within a Site Studio component the Image browser for content needs to be set to Media library or Entity browser in your system settings.
If a Site Studio component is using an Image or Picture element, the image style selected within the element should be one which has a focal point effect set on it. The focal point that was set by the user uploading the image will then be used on the rendered image.
If a Site Studio component uses an Entity browser element, an image style that has a focal point effect set on it needs to be configured in the manage display settings of that media type, for the view mode that the component is configured to render.
If a site has templated entities, which includes fields that reference Media entities the focal point will be used if configured correctly.
The Field element can be used within a template, for example a field which references Media entities.
Within the manage display settings of the entity that is being templated, the format should be set to "Rendered Entity" and the view mode should be set to a view mode that has an image style with a focal point effect set.
The Image or Picture elements can be used within a template where a field references Media entities. On the Image or Picture element the image style selected within the element should be one which has a focal point effect set on it. The correct token also needs to be set within the element, for example a content type with a field of “field_media_image” referencing a media type of “image” the token would look like this: [node:field_media_image:entity:image:entity:path].
If this content did not answer your questions, try searching or contacting our support team for further assistance.
The Focal point module provides two image style effects which should be applied to your image styles to render out with the focal point that a user sets.
The focal point of an image is set at the time it is uploaded, this is handled by Drupal. This can be done as you would usually do within Drupal when creating a new piece of image media.
To use a focal point within a Site Studio component the Image browser for content needs to be set to Media library or Entity browser in your system settings.
If a Site Studio component is using an Image or Picture element, the image style selected within the element should be one which has a focal point effect set on it. The focal point that was set by the user uploading the image will then be used on the rendered image.
If a Site Studio component uses an Entity browser element, an image style that has a focal point effect set on it needs to be configured in the manage display settings of that media type, for the view mode that the component is configured to render.
If a site has templated entities, which includes fields that reference Media entities the focal point will be used if configured correctly.
The Field element can be used within a template, for example a field which references Media entities.
Within the manage display settings of the entity that is being templated, the format should be set to "Rendered Entity" and the view mode should be set to a view mode that has an image style with a focal point effect set.
The Image or Picture elements can be used within a template where a field references Media entities. On the Image or Picture element the image style selected within the element should be one which has a focal point effect set on it. The correct token also needs to be set within the element, for example a content type with a field of “field_media_image” referencing a media type of “image” the token would look like this: [node:field_media_image:entity:image:entity:path].
If this content did not answer your questions, try searching or contacting our support team for further assistance.
Site Studio