@plone-collective/volto-educal-hero-block

1.0.0 • Public • Published

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

Click to expand!
  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.

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

Dependents (0)

Package Sidebar

Install

npm i @plone-collective/volto-educal-hero-block

Weekly Downloads

8

Version

1.0.0

License

MIT

Unpacked Size

568 kB

Total Files

48

Last publish

Collaborators

  • pieronicolli
  • ksuess
  • ericof
  • avoinea
  • sneridagh
  • timostollenwerk