SeedTemplate Framework
Structure-First 的結構化內容框架，透過單一 _s_* 語意標記定義 Node / Slot / Data Binding，將視覺排版與資料結構完美分離。
此頁為系統入口，提供規格文件、概念架構與範例快速連結。
架構概念：規則對應到結構化模板
SeedTemplate 允許非工程人員直接編輯富文本模板，系統能自動根據 _s_* 標記抓取並驗證對應的 JSON 結構。以下圖為例，左側定義了常見的 Book
(書籍) 結構需求，而右側的 Structural Template 以直觀的 HTML 標籤實現這些規則。
💡 後端整合規範：
當與 Granary.Api 等 SeedTemplate 預設後端服務搭配時，傳遞的 JSON 結構中，其 Metadata
物件必須包含 docType (指定內容類別) 以及 id (資源唯一識別碼) 兩個關鍵屬性，系統才能正確處理儲存與讀取請求。
graph LR
subgraph Rules["JSON Structure Rules"]
direction TB
Root["Root: Book"]
Meta["Metadata"]
DocType["docType: 'book'"]
ID["id (uses _s_type='id')"]
Chaps["chapters
(List 1..N)"] Root --> Meta Root --> Chaps Meta --> DocType Meta --> ID end subgraph HTML["Structural Template (HTML)"] direction TB HTMLRoot["< article _s_node='Book' >"] HTMLMeta["< section _s_node='Metadata' >"] HTMLDocType["< input _s_field='metadata.docType' value='book' readonly >"] HTMLId["< input _s_type='id' _s_field='metadata.id' >"] HTMLSlots["< ol _s_slot='Chapter'
_s_list_field='chapters' >"] HTMLRoot --> HTMLMeta HTMLRoot --> HTMLSlots HTMLMeta --> HTMLDocType HTMLMeta --> HTMLId end Root -.映射.-> HTMLRoot Meta -.映射.-> HTMLMeta DocType -.映射.-> HTMLDocType ID -.映射.-> HTMLId Chaps -.映射.-> HTMLSlots classDef jsonBox fill:#f8fafc,stroke:#94a3b8,stroke-width:2px,color:#0f172a classDef htmlBox fill:#eff6ff,stroke:#60a5fa,stroke-width:2px,color:#1e3a8a class Root,Meta,Chaps,DocType,ID jsonBox class HTMLRoot,HTMLMeta,HTMLDocType,HTMLId,HTMLSlots htmlBox
(List 1..N)"] Root --> Meta Root --> Chaps Meta --> DocType Meta --> ID end subgraph HTML["Structural Template (HTML)"] direction TB HTMLRoot["< article _s_node='Book' >"] HTMLMeta["< section _s_node='Metadata' >"] HTMLDocType["< input _s_field='metadata.docType' value='book' readonly >"] HTMLId["< input _s_type='id' _s_field='metadata.id' >"] HTMLSlots["< ol _s_slot='Chapter'
_s_list_field='chapters' >"] HTMLRoot --> HTMLMeta HTMLRoot --> HTMLSlots HTMLMeta --> HTMLDocType HTMLMeta --> HTMLId end Root -.映射.-> HTMLRoot Meta -.映射.-> HTMLMeta DocType -.映射.-> HTMLDocType ID -.映射.-> HTMLId Chaps -.映射.-> HTMLSlots classDef jsonBox fill:#f8fafc,stroke:#94a3b8,stroke-width:2px,color:#0f172a classDef htmlBox fill:#eff6ff,stroke:#60a5fa,stroke-width:2px,color:#1e3a8a class Root,Meta,Chaps,DocType,ID jsonBox class HTMLRoot,HTMLMeta,HTMLDocType,HTMLId,HTMLSlots htmlBox
Template Rules (Conceptual)
Book Template Rules
Structure:
- Root: Book
- Metadata
- docType: "book"
- id (use _s_type="id")
- Title
- Chapter+
- chapter.title
- Body (Paragraphs)
- paragraph.text
- Notes
- note.text
HTML Structural Markers
<article _s_node="Book">
<section _s_node="Metadata">
<input _s_field="metadata.docType" value="book" />
<input _s_type="id" _s_field="metadata.id" />
</section>
<header _s_node="Title">
<input _s_field="title.text" />
</header>
<ol _s_slot="Chapter" _s_list_field="chapters" _s_q="+">
<li _s_node="Chapter" _s_repeat="Chapter">
<input _s_field="chapter.title" />
<section _s_node="Body">
<ol _s_slot="Paragraph" _s_list_field="body.paragraphs" _s_q="*">
<li _s_node="Paragraph" _s_repeat="Paragraph">
<input _s_field="paragraph.text" />
</li>
</ol>
</section>
<ol _s_slot="Notes" _s_list_field="notes" _s_q="*">
<li _s_node="Notes" _s_repeat="Notes">
<input _s_field="note.text" />
</li>
</ol>
</li>
</ol>
</article>
Framework Guide
閱讀框架特色、核心規則與導覽。
Template Spec
查看 `_s_*` 模板規格與動作語意。
Frontend Example
template / scripts / style / data 分離，並共用 framework engine。