This documentation is not using the current rendering mechanism and will be deleted by December 31st, 2020. The extension maintainer should switch to the new system. Details on how to use the rendering mechanism can be found here.
Target group: Administrators
To install the extension, perform the following steps:
- Go to the Extension Manager
- Install the extension
- Load the static template
If set to false, then images are not upscaled. I.e. if one or more srcset candidates width is bigger than the original images width, then one last image candidate is created with the original images width.
On the other hand, if this setting is true, then images will be upscaled to match the widths of all given srcset candidates.
Respecting this setting was introduced with c1_adaptive_images version 0.1.5
This script is needed to render images using lazyloading and setting the sizes attribute automatically. Download it at https://github.com/aFarkas/lazysizes
The script should be included early, e.g.:
page.includeJSFooterlibs.lazysizes = EXT:yourtheme/Resources/Public/Js/lazysizes.min.js
A polyfill to support the picture tag in older browsers, most notably IE11 and Opera Mini. Download it at https://scottjehl.github.io/picturefill/
This script should be included early in the head of the website:
page.includeJSLibs.picturefill = EXT:yourtheme/Resources/Public/Js/picturefill.min.js
Hint: As a simpler alternative one could also use https://github.com/aFarkas/lazysizes/tree/gh-pages/plugins/respimg as a picture polyfill.