The Image focal point setting can be used to keep the subject of your photo in view and determines what part of the image shouldn't be cropped while the image is enlarged to fit the device.
This setting has been added in Parallax 4.0.0 and is available for any banner image section in the Parallax theme (applies on desktop and only for cropped images on mobile).
- Image with text overlay
- Slideshow
- Video (placeholder image)
- Collection page (banner)
- Contact page (banner)
- Blog page (banner)
- Blog post (banner)
CSS is used behind the scenes to move the background image around within its container. This is done by manipulating the background-position property. So, when an image focal point is selected, a new value for the background-position is applied to the banner image to position it accordingly.
The options for the Image focal point setting are:
- Top left
- Top center
- Top right
- Left
- Center
- Right
- Bottom left
- Bottom center
- Bottom right