Heading

Type: "heading"

Props

Field	Type	Required	Default	Notes
text	string (max 300)	✓	"Heading Baru"	Heading text (plain mode)
level	'h1'|'h2'|'h3'|'h4'|'h5'|'h6'	✓	"h2"	HTML heading level
alignment	'left'|'center'|'right'	✓	"left"	Text alignment
link	string (URL, max 2000)	—	—	Wrap heading in <a>
mode	'plain'|'rich'	—	"plain"	Plain text or rich HTML
richText	string (HTML, max 10000)	—	—	HTML when mode = "rich"

Example: plain centered H1

{
  "id": "h001abcd",
  "type": "heading",
  "props": {
    "text": "Build Websites Without Code",
    "level": "h1",
    "alignment": "center"
  }
}

Example: H2 with link

{
  "id": "h002efgh",
  "type": "heading",
  "props": {
    "text": "Read Our Blog",
    "level": "h2",
    "alignment": "left",
    "link": "/blog"
  }
}

Example: rich heading with bold + color

{
  "id": "h003ijkl",
  "type": "heading",
  "props": {
    "text": "Heading",
    "level": "h2",
    "alignment": "left",
    "mode": "rich",
    "richText": "<strong>50%</strong> <span style=\"color:#dc2626\">OFF</span> this week!"
  }
}

Example: responsive style

{
  "id": "h004mnop",
  "type": "heading",
  "props": { "text": "Tagline", "level": "h1", "alignment": "center" },
  "style": {
    "desktop": { "typography": { "fontSize": "64px", "fontWeight": "800" } },
    "tablet":  { "typography": { "fontSize": "48px" } },
    "mobile":  { "typography": { "fontSize": "32px" } }
  }
}