HOC Site
← Ortak kavramlar
Zengin metin
RichTextBlock, düğme etiketleri, kaplamalar ve nesneye bağlı zengin metinde kullanılan TipTap HTML. Depolama biçimi, araç çubuğu özellikleri ve yazarlık kuralları burada belgelenir.
Storage Rich text props are TipTap HTML **strings**, not slots and not a separate `html` key. Example: `content: "<p>Hello <strong>world</strong></p>"`. Empty content is typically an empty string or a minimal empty paragraph from the editor.
Editor features The shared TipTap stack (admin Puck + public forms) includes: - Headings levels 1–6 - Bold, italic, strike, and related StarterKit marks/nodes (paragraphs, lists, blockquotes, hard breaks) - Links (insert/edit/remove via the toolbar modal) - Text color and font family - Tables (insert/add/remove rows and columns) - Images from the file library (base64 embeds are not allowed) - YouTube embeds and Google Maps embeds Some surfaces (e.g. lifecycle email bodies) add extra extensions such as field-binding chips; those only appear where that editor enables them.
Public render Published HTML is rendered with the shared `.rich-text` styles (and related puck rich-text CSS) so headings, lists, tables, and embeds match the editor. Theme typography and colors still come from the website theme where CSS variables apply.
Where rich text appears - **RichTextBlock** — `content` HTML body on pages and chrome - **ButtonBlock** / **ButtonLink** — `text` label as HTML (often a short paragraph) - **ImageOverlayText** (legacy) — `overlay` HTML on the image - **ObjectBoundRichText** — binds an object schema `richText` field into the page - Object schema type `richText` and admin/public **SharedRichTextField** forms use the same extension stack
Authoring & MCP guidance - Keep first-viewport copy short; put long articles in object fields and bind them with ObjectBoundRichText. - Always write the HTML into the documented prop (`content`, `text`, or `overlay`) — do not invent an `html` prop. - Locale overlays localize these HTML strings like other localizable props; the modal Name field is not rich text and is not localized. - Prefer semantic HTML TipTap already emits (`<p>`, `<h2>`, `<ul>`, `<a href="…">`, tables) over hand-authored markup that the schema does not round-trip. - When documenting or generating JSON, treat the value as a string of HTML, never as a nested slot array.
Örnekler
// Short paragraph
{
"content": "<p>Browse categories and start a conversation.</p>"
}// Heading + list
{
"content": "<h2>What you get</h2><ul><li>Fast setup</li><li>Multi-locale publishing</li></ul>"
}