We use cookies to offer you a better browsing experience, analyse traffic and personalise content. Read how we use your data in our privacy policy.

Hero PLUS

Hero stack on steroids

NEW 1.2.0

Features

  • Same base-functionality as Hero stack
  • Adds Ken-Burns-Effect on Image Backdrop
  • Adds Background Video

General Settings

The general settings are identical to the Hero stack. However, the image options have been separated out into two sub stacks, one for images and one for video.

Background Image (Sub-Stack)

Save Space - Save space in edit mode by enabling this setting
Height - if image is displayed in edit mode, its height can be set here
Does not influence preview or publish settings
For warehoused images, you can select the Warehoused Image option and provide a link to the image via the standard Link Dialog.
Additionally, you can add an Alternative Text.
In non Warehouse-Mode you can either browse to the particular picture or drag and drop it onto the image-well.
  • Image Tiling - select a tiling option. I you want your image to cover the entire width of the Hero stack, select None
  • Image Size - select one of the image sizing options
  • Poition - if your image does not completely cover the Hero stack, select one of the Position options to place your image
  • Lock Background - choose this option to lock your image. This will create a simple parallax effect when scrolling
AOS-Screen Shot
  • Effect - select either Lock Background or Ken Burns
  • Effect Trigger - select the trigger for the Ken Burns effect: on page load or on mouse hover
  • Move From - sets the starting coordinates for the Ken Burns effect; origin is top left
  • Move To - sets the ending coordinates for the Ken Burns effect; origin is top left
  • Scale - sets the starting and ending scale for the Ken Burns effect. Makes it possible to get a zoom-in or zoom-out effect
  • Timing - sets the duration of the effect; if trigger is set to "On Hover", both values will be used; if trigger is set to "On Load", only the first value will be used
AOS-Screen Shot

Background Video (Sub-Stack)

Background video is based on HTML5 video.
  • MP4, OGG, WebM - three buttons to select/set URLs to videos; the bowser will select the appropriate one automatically if more than one is provided
  • Autoplay - sets auto-play mode
  • Muted - video plays muted (no sound)
  • Loop - video loops
  • Cover - covers the entire Hero background even if the dimensions of the video and the Hero stack do not match. Video will be zoomed to cover the area
  • Position - sets the position of the video inside the Hero stack; only available if "Cover" is turned off