Home

Awesome

volto-educal-hero-block

A volto block add-on for a hero block. It contains heading on left side and can have two images on the right side.

Customizable properties

<details> <summary>Click to expand!</summary>
  1. preheadingText (string): The text before the heading.
  2. headingText (string): The heading text.
  3. subHeadingText (string): The sub-heading text.
  4. showActionButton (boolean): Toggle the CTA-Button.
  5. actionButtonText (string): CTA-Button label.
  6. actionButtonUrl (string): CTA-Button URL which is navigated onClick.
  7. foregroundImage (image): Foreground image url.
  8. backgroundImage (image): Background image url.
  9. quoteText1 (string): The quote text for the first line.
  10. quoteText2 (string): The quote text for the second line.
  11. enableShapes (boolean): Toggle the various background shapes along with the animations.
  12. margin (string): Specifies the margin css property of the banner.
</details>

Example

Configuration

preheadingText: 'Access 2700+'
headingText: 'Online Tutorial From Top Instructor.'
subHeadingText: 'Meet university,and cultural institutions, who'll share their experience.'
showActionButton: true
actionButtonText: 'View all courses'
actionButtonUrl: '/'
foregroundImage: '/hero.jpg'
foregroundImage: '/hero2.jpg'
quoteText1: 'Tomorrow is our'
quoteText2: '“When I Grow Up” Spirit Day!'
enableShapes: true
margin: '75px -50px 200px -50px'

Output

image