Les blocs

Types disponibles et format JSON de stockage

Un document Rédac est une liste ordonnée de blocs. Chaque bloc a un id, un type, et des données qui dépendent du type. C'est ce JSON qui est stocké en base de données.

Paragraph & Headings

Les blocs texte (paragraph, h1–h6) ont un champ content : un tableau de Rnodes — fragments de texte avec leurs marks.

{
  "id":      "b1a2c3",
  "type":    "paragraph",
  "content": [
    { "text": "Hello ",  "marks": [] },
    { "text": "world",   "marks": ["bold"] },
    { "text": " and ",   "marks": [] },
    { "text": "italic",  "marks": ["italic"] }
  ],
  "id_attr": "intro",
  "classes": "lead",
  "data":    {}
}

Les types heading suivent le même format, avec "type": "h2" (ou h1, h3…h6).

Marks disponibles sur un Rnode
MarkChamps supplémentairesRendu HTML
bold<strong>
italic<em>
underline<u>
linkhref, target<a href="…">
markermarker_color<mark style="background-color:…">
colortext_color<span style="color:…">

Listes (list_ul / list_ol)

Les listes ont un champ items : chaque item est lui-même un tableau de Rnodes. Le formatage inline fonctionne dans chaque item de la même façon que dans un paragraph.

{
  "id":   "b4d5e6",
  "type": "list_ul",
  "items": [
    [ { "text": "Premier item",  "marks": [] } ],
    [ { "text": "Deuxième",      "marks": [] }, { "text": " item", "marks": ["bold"] } ]
  ],
  "data": {}
}

Pour une liste numérotée : "type": "list_ol".

Séparateur

Un bloc visuel sans contenu texte. Les options (couleur, épaisseur, style) sont dans data. Tous les champs sont optionnels — un séparateur simple n'a pas de data.

{
  "id":   "b7f8g9",
  "type": "separator",
  "data": {
    "color":     "#94a3b8",
    "thickness": 2,
    "sep_style": "dashed"
  }
}

sep_style accepte : solid (défaut), dashed, dotted.

Image

Un bloc figure avec une image et une légende optionnelle (contenteditable, formatage inline). Toutes les options sont dans data.

{
  "id":      "bABCDE",
  "type":    "image",
  "content": [],
  "data": {
    "src":         "https://example.com/photo.jpg",
    "alt":         "Description de l'image",
    "href":        "",
    "link_target": "",
    "layout":      "center",
    "img_classes": "",
    "img_id":      ""
  }
}
ChampValeurs
layoutcenter (défaut), full, float-left, float-right
href + link_targetLien sur l'image. link_target: "_blank" pour nouvel onglet.
contentRnodes de la légende (<figcaption>), formatage inline supporté.

Attributs communs à tous les blocs

Via le menu Tune (⋮), l'utilisateur peut définir un id HTML et des classes CSS sur n'importe quel bloc. Ces valeurs sont présentes au niveau racine du bloc.

ChampPrésenceEffet sur le rendu
id_attrSi renseigné via Tuneid="…" sur la balise HTML du bloc
classesSi renseigné via Tuneclass="…" sur la balise HTML du bloc