[opencms-dev] How to use the focal point feature

Schliemann, Kai K.Schliemann at comundus.com
Thu Jul 13 19:07:59 CEST 2023


Hi list,


OpenCms makes it possible to set a focal point in images.

We have a question about that.

We couldn't find any precise instructions on how to use the focal point feature.
The only documentations we found are about how to set a focal point, but we don't know how to use it.
However, we have found that additional (scale) properties are needed to be able to use the function.

We tried this to scale an image with a set focal point:
<cms:scaleImage var="imgBean1" src="${content.value.Image.toImage}?__scale=h:600,w:900,t:8,cx:40,cy:30,ch:600,cw :1500" />


Our questions:

Is there any specific guide on how we can use the focal point feature or can you
describe to us which steps are necessary to achieve an expected result (result = scale image with focal point)?

Are there any settings that we are missing to unlock this function?

A quick example would also be helpful.

In addition, to make our needs clearer, what our use case is:
We have a responsive website with different modules. Let's say, we have module A, which should render one image in three different image aspect ratios and sizes. One for desktop, tablet and smartphone.
The same image should be used for all three devices.
Every image has, as already mentioned, different sizes and aspect ratios.
For example:
Image desktop: height: 200px, width: 800px
Image tablet: height: 200px, width: 600px
Image smartphone: height: 150px, width: 400px

How can we achieve the output for each device with a focal point set to optimally show the correct part of the image, even with such different image ratios and sizes?

Thanks a lot in advance for your help.

Best regards
Kai
__________________________________________

Kai Schliemann
Dipl.-Wirtschaftsingenieur (FH)
Senior IT-Berater Softwareentwicklung
comundus GmbH
Heerstraße 111, D-71332 Waiblingen
Durchwahl  +49 7151 96528-120
Zentrale      +49 7151 96528-0
Fax             +49 7151 96528-999
E-Mail    k.schliemann at comundus.com<mailto:k.schliemann at comundus.com>
Internet https://www.comundus.com/
Hinweis Unsere Datenschutzerklärung<https://www.comundus.com/unternehmen/datenschutz/>

Geschäftsführer Siegfried Fitzel,  Klaus Hillemeier
Amtsgericht Stuttgart, HRB 264290
__________________________________________

comundus auf:

[32-facebook]<https://www.facebook.com/Comundus-GmbH-163398933697079/> [32-twitter] <http://twitter.com/comundus>  [32-xing] <https://www.xing.com/companies/comundusgmbh>  [32-youtube] <https://www.youtube.com/channel/UCTTN-c169oHvHDrykuKnMQw>


-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.opencms.org/pipermail/opencms-dev/attachments/20230713/b6a46fe5/attachment.htm>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: image001.png
Type: image/png
Size: 269 bytes
Desc: image001.png
URL: <http://lists.opencms.org/pipermail/opencms-dev/attachments/20230713/b6a46fe5/attachment.png>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: image002.png
Type: image/png
Size: 462 bytes
Desc: image002.png
URL: <http://lists.opencms.org/pipermail/opencms-dev/attachments/20230713/b6a46fe5/attachment-0001.png>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: image003.png
Type: image/png
Size: 3771 bytes
Desc: image003.png
URL: <http://lists.opencms.org/pipermail/opencms-dev/attachments/20230713/b6a46fe5/attachment-0002.png>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: image004.png
Type: image/png
Size: 350 bytes
Desc: image004.png
URL: <http://lists.opencms.org/pipermail/opencms-dev/attachments/20230713/b6a46fe5/attachment-0003.png>


More information about the opencms-dev mailing list