Visual Page Designer
Visual Page Designer (route/templates/builder/:templateId/visual-designer) handles per-page styling for inspection report PDFs — page headers, footers, section header design, alignment, typography. It complements Template Designer, which handles canvas-level concerns (margins, photo grids, finding card style).
This article covers the controls. For schema editing, see Schema Upload & Review.
When you use it
- After initial template setup — once the schema is in place and the canvas is configured, this is where you fine-tune page-level rendering
- For white-label branding — multi-brand inspection businesses can give each brand its own page header / footer style without separate templates
- For mock-driven design — if marketing or a client provides a mockup for how the report should look, this is where you reproduce it
Screen layout
[SCREENSHOT: visual-page-designer.png — desktop, the Visual Page Designer showing a live page preview on the left and configuration controls on the right with sections for Page Header, Major Section Headers, and Page Footer.] Two main areas:- Live preview of a sample report page rendering with current settings
- Configuration panel with grouped controls
Live preview
The preview shows a representative report page with:- The configured page header at the top
- Company info (if shown): company name, phone, website
- A sample section header
- Sample finding cards
- Page number footer
No schema data available for preview Upload a PDF schema firstIn that case, switch to Schema Upload & Review to get a schema in place first.
Page Header configuration
The Page Header section controls what appears at the top of every report page (except the cover, which is governed by Cover Designer).
When the logo is hidden but company name is shown, the page header renders text-only — useful for compact reports.
Major Section Headers
The largest design lever for the body of the report. Section headers are the breakpoint markers between major systems (Roofing, Structural, Electrical, etc.) on the report PDF.
Common designs:
- Minimalist: white background, dark text, thin bottom border
- Bold brand color: solid primary-color bar, white text
- Subtle gray header band: light-gray background, dark text, no border
Subsection Headers
Below major section headers, subsection headers (Foundations, Roof Coverings, etc.) get their own styling. Typically less prominent than major section headers.Page Footer
The footer appears at the bottom of every body page.
The footer is rendered as a thin band at the page bottom with the page number on one side and company info on the other.
Living within tenant defaults
Like other template settings, Visual Page Designer values override your tenant-level defaults (configured in Company Info) for this specific template only. If a field is left at its default, it inherits from the tenant. Set explicit values here only for fields you want to diverge from the tenant default.Saving
Visual Page Designer uses explicit save like Template Designer. Click Save at the top-right or footer of the page. Unsaved changes are flagged with an indicator.Errors and recovery
What this page does NOT do
- It does not edit the report’s content. Schema is in Schema Upload & Review; narratives are in Inspection Reviewer.
- It does not design covers. Use Cover Designer.
- It does not handle canvas-level concerns like margins and photo grids. Use Template Designer.
- It does not preview against a real inspection. Generate a PDF preview from Inspection Reviewer for that.
Related articles
- Templates Overview
- Template Designer — canvas-level configuration
- Cover Designer — covers shown above the page header
- Template Editor — settings and branding overrides