Documentation Index
Fetch the complete documentation index at: https://help.1nspect.app/llms.txt
Use this file to discover all available pages before exploring further.
Cover Designer
The Cover Designer is the branded-cover-page editor for inspection reports. Cover pages are the front page of every PDF report — your company logo, the property photo, the inspection title, the inspector’s name. Design them once; assign them as defaults to your templates or to specific inspections.
Cover Designer is a top-level sidebar item (route /cover-designer) — not nested under Templates, because covers are reusable across many templates.
This article covers both the list view (/cover-designer) and the per-cover editor (/cover-designer/new for a new cover, /cover-designer/:id to edit). For where covers are referenced from inspection templates, see Template Designer → Default Cover.
When you use it
- First-week setup — design a default cover that matches your brand
- Per-service variants — separate covers for Residential vs. Commercial vs. New Construction
- Special-occasion covers — limited-time branding, holiday variants, client-specific co-branding
- A/B testing brand presentation — duplicate, modify, see which converts better
After initial setup, covers rarely change. Most operators have 1–3 active covers.
The cover list page
Route: /cover-designer
[SCREENSHOT: cover-list.png — desktop, the Cover Templates list page showing the heading “Cover Templates” with descriptive subtitle, a grid of existing cover thumbnails, and a + New Template button.]
The list page shows:
- Page heading: “Cover Templates”
- Description: “Design custom report cover pages with branded frames and dynamic field tokens.”
- Cover grid — thumbnails of every designed cover
- + New Template button — opens the editor for a fresh cover
Each cover thumbnail shows:
- The cover’s name
- A live miniature preview of the layout (or “No layers” if the cover is empty)
- Per-card actions: Edit · Duplicate · Set Default · Delete
Empty state
If you have no covers yet:
No cover templates yet
Create your first cover template to add branded cover pages to reports.
[+ New Template]
Click + New Template to open the editor with a blank canvas.
The Cover Designer editor
Route: /cover-designer/new or /cover-designer/:id
The editor is a layer-based composition tool. Think of it like Figma for inspection report covers: you add layers (photo, text, shape, background), position them on the page, configure their appearance.
[SCREENSHOT: cover-editor.png — desktop, the Cover Designer editor showing a layer panel on the left, a page canvas in the center showing the cover-in-progress, and a property-inspector panel on the right with the selected layer’s controls.]
Layer types
The editor supports these layer types:
| Type | What it is |
|---|
| Photo (property) | Renders the inspection’s cover photo at runtime — designed once, swapped per inspection |
| Text (static) | Fixed text — your company tagline, “INSPECTION REPORT” header, etc. |
| Text (dynamic) | A text layer with a $Variable token — e.g. “Prepared for $ClientNames” |
| Logo (image) | Your company logo, scaled and positioned |
| Shape / Color block | Solid-color rectangles for visual structure |
| Page background | The base fill behind all other layers |
Each layer is named (Layer name field) for easier identification in the layers panel.
Per-layer controls
When you select a layer, the right panel shows its properties.
Position & Size (%)
| Field | Notes |
|---|
| X / Y | Position as percent of page width / height |
| Width / Height | Size as percent of page dimensions |
| Align on page | Quick alignment buttons (left / center / right, top / middle / bottom) |
Using percentages instead of pixels means the design scales correctly across different paper sizes (letter, A4, legal).
Photo fit (photo layers only)
| Option | Behavior |
|---|
| Cover (crop to fill) | The photo fills the layer’s bounds, cropping any overflow |
| Contain (letterbox) | The photo is fit within the layer with letterboxing to preserve full image |
Plus a Photo border radius (px) field for rounded corners.
Text content (text layers)
| Field | Notes |
|---|
| Text content | The actual text to render |
| Prefix / Suffix | For dynamic tokens — wrap text around a $Variable (e.g. Prefix: “Prepared for ”, Token: $ClientNames, Suffix: "") |
Typography (text layers)
| Field | Options |
|---|
| Font size (pt) | Numeric input |
| Color | Color picker |
| Weight | Normal, Bold, Light (300), Medium (500), Semi-bold (600), Bold (700) |
| Style | Normal, Italic |
Background (per-layer)
| Field | Notes |
|---|
| Fill color | Solid color picker, or check “Transparent” |
| Border radius (px) | Rounded corners |
Variable tokens supported on cover text layers
The same $Variable tokens that work in Communications email templates and Contracts work on dynamic text layers in covers:
Client tokens:
$ClientFirstName $ClientLastName $ClientNames
Property & inspection:
$InspectionAddress $InspectionDate
Inspector & company:
$InspectorName $InspectorLicense $CompanyName
Common cover patterns:
| Text layer content | Renders as |
|---|
INSPECTION REPORT | Fixed header |
Prepared for $ClientNames | ”Prepared for Robert & Lisa Smith” |
$InspectionAddress | ”123 Oak Dr, Austin TX” |
Inspection Date: $InspectionDate | ”Inspection Date: May 8, 2026” |
Inspector: $InspectorName, License #$InspectorLicense | ”Inspector: Jane Doe, License #12345” |
Prepared by $CompanyName | ”Prepared by Property Pulse Inspection” |
Static text (no $Variable) renders as-typed.
The property photo layer
The Photo (property) layer is special: at design time it shows a placeholder image; at PDF-rendering time, it pulls the cover photo designated for that specific inspection. The cover photo is either:
If an inspection has no cover photo, the layer renders the placeholder (typically a generic property silhouette). Confirm the inspector knows to designate a cover photo to avoid placeholder-on-published-report embarrassment.
Saving and Set Default
The editor has explicit-save:
- Save commits the cover to Firestore at
artifacts/{tenant}/public/data/coverTemplates/{coverId}
- Set as Default marks this cover as the tenant-wide default — every template that doesn’t have its own cover override will use this
- Save & Close saves and returns to the list
Newly-saved covers appear in the Template Designer → Default Cover picker for every template in your tenant.
Duplicate
The Duplicate action on a cover card creates a copy with (Copy) appended. Edit the duplicate to create a variant.
This is the recommended way to create cover variants:
- Start with your default cover
- Duplicate
- Modify the duplicate (e.g. change to a more formal font for Commercial)
- Assign the variant to specific templates via Template Designer
Errors and recovery
| Alert | Cause | Fix |
|---|
| Failed to save cover template | Network or auth | Retry |
| Image too large | Logo upload exceeds size limit | Compress or resize the image (the renderer downscales but won’t accept huge originals) |
| Variable not recognized | Used a token not in the variable list | Check spelling; only the documented tokens resolve |
| Page bounds exceeded | Layer position takes it off the page | Adjust position so the layer is within 0–100% on both axes |
What this page does NOT do
- It does not design report body pages. That’s Visual Page Designer.
- It does not edit the actual property photo. Cover photos are designated per inspection in Inspection Reviewer or on the mobile Review Screen.
- It does not handle contracts or email letterheads. Those have their own editors.
- It does not configure margins or page size. Page dimensions are fixed at letter portrait (8.5×11 inches).
Related articles