Blazor Block Editor Example - Template Gallery
Blank Page
Start from scratch
Project Brief
Plan, organize, and track
Team Decisions
Ideate and decide
Project Planning
Collaborate
Meeting Notes
Sync and share
📝️Project Brief
💫 Overview
Provide project background, core objectives, key stakeholders, and proposed timeline here — include an inspiring quote to set the tone.
🎯 Goals
List the primary project goals and desired outcomes.
🧑💻 Team Members
| Name | Role | Location | Core working hours |
|---|---|---|---|
🛠️ Project Deliverables
| Task / Deliverable | Assigned to | Due date | Bucket / Status |
|---|---|---|---|
🔗 Relevant Links & Resources
Insert Link
This sample demonstrates a Template Gallery for the Block Editor, allowing users to select predefined templates, load their block structures, and customize content using slash commands, lists, and inline formatting.
The Template Gallery implements a horizontal set of interactive cards that act as a template picker. Selecting a card loads the template's predefined block structure into the editor without requiring a page reload, enabling seamless content creation.
Key features:
- Interactive cards: Each card is focusable and clickable, with active styling for the selected template
- Dynamic loading: Clicking a card loads the template's blocks into the editor
- Responsive design: The card rail is horizontally scrollable when content overflows
- Templates included: Blank Page, Project Brief, Team Decisions, Project Planning, and Meeting Notes
Use this gallery to kickstart common document projects such as planning, recording decisions, and conducting meetings. Tailor the content with headings, lists, checklists, and rich inline styles to suit your specific needs.