Image left – responsive image preset
Contao gives you the option to predefine image sizes for various screen sizes that are loaded depending on the width of the viewport. Try resizing your browser window to see the effect in action.
Linked image right with pop-out
Vestibulum non dictum ante, eleifend bibendum metus. Curabitur consequat eget tellus id efficitur. Integer euismod laoreet urna. Maecenas a vulputate turpis, quis fringilla diam. Nam iaculis, mi in varius tempor, est nisi ullamcorper lacus, eu condimentum ipsum ligula sed purus. Morbi porta imperdiet tortor in varius. Proin in lobortis nunc. Donec ipsum diam, feugiat in nunc eget, malesuada ultricies sem. Curabitur sed ornare velit, quis varius augue.
Add classes "pop-out" and "radius5"
Linked image left with push-in
Vestibulum non dictum ante, eleifend bibendum metus. Curabitur consequat eget tellus id efficitur. Integer euismod laoreet urna. Maecenas a vulputate turpis, quis fringilla diam. Nam iaculis, mi in varius tempor, est nisi ullamcorper lacus, eu condimentum ipsum ligula sed purus. Morbi porta imperdiet tortor in varius. Proin in lobortis nunc. Donec ipsum diam, feugiat in nunc eget, malesuada ultricies sem. Curabitur sed ornare velit, quis varius augue.
Add class "push-in"
Image round
Vestibulum non dictum ante, eleifend bibendum metus. Curabitur consequat eget tellus id efficitur. Integer euismod laoreet urna. Maecenas a vulputate turpis, quis fringilla diam. Nam iaculis, mi in varius tempor, est nisi ullamcorper lacus, eu condimentum ipsum ligula sed purus. Morbi porta imperdiet tortor in varius. Proin in lobortis nunc. Donec ipsum diam, feugiat in nunc eget, malesuada ultricies sem. Curabitur sed ornare velit, quis varius augue.
Add class "round"
Image top
Vestibulum non dictum ante, eleifend bibendum metus. Curabitur consequat eget tellus id efficitur. Integer euismod laoreet urna. Maecenas a vulputate turpis, quis fringilla diam. Nam iaculis, mi in varius tempor, est nisi ullamcorper lacus, eu condimentum ipsum ligula sed purus. Morbi porta imperdiet tortor in varius. Proin in lobortis nunc. Donec ipsum diam, feugiat in nunc eget, malesuada ultricies sem. Curabitur sed ornare velit, quis varius augue.
Pop-out images
Add class "pop-out" to each image
Responsive Video
Important: You might want to use a splash screen (still image) for users to click before the video is loaded. This might be necessary to comply with GDPR rules.