Skip to main content

Search

Knowledge Center

Form Builder - Image Block

Purpose Statement

The Image Block feature in Form Builder allows administrators and form creators to embed visual content directly into forms, enhancing documentation and providing visual context for inspections, permits, invoicing and fire investigations. This feature supports comprehensive visual documentation and improves the clarity of form-based processes by allowing users to include relevant images, diagrams, or reference materials directly within their forms.

Background Information

The Image Block is a versatile form element available across multiple First Due modules including Inspections, Permits, Invoicing and Fire Investigation. This functionality is particularly valuable for fire departments and EMS agencies that need to include visual references, safety diagrams, equipment photos, or instructional images within their standardized forms. The Image Block supports most common image file formats and provides customization options for optimal presentation and printing.

Common use cases include adding safety diagrams to inspection forms, including reference photos in permit applications, reference photos for invoicing, and embedding visual evidence documentation in fire investigation reports.

Required Permissions

To add and configure Image Blocks in Form Builder, users must have:

  • Form Builder access permissions
  • Module-specific editing permissions for the target module (Inspections, Permits, Invoicing or Fire Investigation)
  • File upload permissions within the First Due system

Video


Step-by-Step Guide




1.  Create a new form or select edit to edit an existing form.






2. Mouse over in the left margin at the current block and select the + sign to add an Image Block under the current Block.





3.  Select Image from the dropdown menu.






4. Select the file to upload.
  1. Most image file types are support.
  2. Recommended image files types are: .jpg, .jpeg, .png, and .gif





5. Enter text for the Caption (optional):






6. Select Tune to add a border, stretch the image, add a background, move up and down, or delete (select the X 2 times).






7.  Example of a Form with a Image printed.




Best Practices

Image Selection:

  • Choose high-quality images that remain clear when printed
  • Use images that are relevant and add value to the form's purpose
  • Keep file sizes reasonable to ensure quick loading times

File Format Recommendations:

  • Use .jpg or .jpeg for photographs and complex images
  • Use .png for images requiring transparency or sharp edges
  • Use .gif for simple graphics or when small file size is critical

Caption Usage:

  • Always include descriptive captions for accessibility and clarity
  • Keep captions concise but informative
  • Use captions to explain the image's relevance to the form

Layout Considerations:

  • Position images logically within the form flow
  • Test form appearance on different devices and when printed
  • Avoid oversizing images that may disrupt form layout

Troubleshooting & FAQs

Q: What if my image file won't upload? A: Verify that your file format is supported and the file size isn't too large. Try converting to .jpg or .png format if needed.

Q: Can I resize images after uploading? A: Use the "Tune" settings to stretch images or adjust their appearance within the form layout.

Q: Will images appear when the form is printed? A: Yes, images will appear on printed forms. Test your form's print preview to ensure optimal appearance.

Q: Can I add multiple images to one form? A: Yes, you can add multiple Image Blocks throughout your form as needed.

Q: What happens if I delete an Image Block by mistake? A: You'll need to re-add the Image Block and re-upload your image file. The system requires double-confirmation (clicking X twice) to prevent accidental deletion.