Image compare Section

A section for comparing before and after images.

Description of the image for accessibilityBefore
Description of the image for accessibilityAfter

Configuration

- sectionType: image-compare
  containerTag: section
  # container settings

  imageBefore:
    src: '/assets/images/before-photo.jpg'
    alt: 'Description of the image for accessibility'
    caption: ''
  imageAfter:
    src: '/assets/images/after-photo.jpg'
    alt: 'Description of the image for accessibility'
    caption: ''

Image Properties

PropertyTypeRequiredDescription
imageBeforeobjectYesthe before image
imageAfterobjectYesthe after image
PropertyTypeRequiredDescription
srcstringYesPath to the image file
altstringYesAlternative text for accessibility
captionstringNoOptional caption text displayed below the image