Démo Tiptap
Projet d'exemple qui passe en revue tous les modules disponibles dans l'éditeur admin.
Ce paragraphe combine du gras, de l'italique, du souligné, du barré, du code inline et un lien.
Deuxième ligne d'un même paragraphe,
grâce à un retour à la ligne simple (Shift+Enter).
Titre niveau 1
Texte sous le titre 1.
Titre niveau 2
Texte sous le titre 2.
Titre niveau 3
Texte sous le titre 3.
Titre niveau 4
Texte sous le titre 4.
Liste à puces — premier point
Liste à puces — deuxième point
Liste numérotée — premier point
Liste numérotée — deuxième point
Une citation pour illustrer le style blockquote.
function hello() {
console.log("Bloc de code");
}Un titre de niveau 6 devient un libellé de section : il apparaît dans le sommaire à gauche et sert de séparateur visuel, sans jamais s'afficher comme un titre classique.
Dernière section pour vérifier que le sommaire liste bien plusieurs entrées, et pour montrer le module Table :
Module | Package | Statut |
|---|---|---|
Image |
| Installé |
Table |
| Installé |
Aucune extension Tiptap officielle ne couvre les mises en page en colonnes — celle-ci est un nœud maison (voir app/lib/tiptap-columns.ts), en 2, 3 ou 4 colonnes.
Premiere colonne : texte seul, pour montrer qu'une colonne n'est pas obligee de contenir une image.
Deuxieme colonne : une image carree, affichee a son ratio naturel (1:1), sans recadrage en 16:9.
Troisieme colonne : une image portrait, la ou l'ancien composant l'aurait recadree en 16:9 large.
