Fait avec Chinaski

L'éditeur

Le contenu des corps de pages et posts s'écrit dans un éditeur de texte enrichi (Quill) : boutons de mise en forme familiers, HTML simple en dessous, avec quelques assistants propres à Chinaski pour les images, les liens et les blocks de contenu. Cette page couvre ce qui se trouve dans la barre d'outils, les assistants intégrés, et les règles définissant ce qui compte comme contenu de corps valide.

Où il apparaît

L'éditeur est le champ Body de l'éditeur de page et de l'éditeur de post. Il édite uniquement le contenu : titres, slugs, champs SEO, dates, et tout le reste sur ces écrans sont des champs de formulaire séparés. Les fichiers de l'éditeur sont servis depuis votre propre serveur (aucun CDN externe) et vérifiés en intégrité comme le reste de l'interface d'admin.

La barre d'outils

Groupe Boutons
Texte Gras, italique, souligné, barré
Titres Heading 2, 3, 4, et Normal : les titres commencent à H2
Blocks Blockquote, bloc de code
Listes Numérotée, à puces
Objets en ligne Lien, Image
Nettoyage Effacer la mise en forme

Il n'y a pas de H1 dans l'éditeur de corps : le champ de titre propre de la page/post est le seul h1 ; les titres du corps commencent à H2 pour que chaque page ait une hiérarchie de titres unique et cohérente. Il n'y a pas non plus de sélecteurs de police ou de couleur : la typographie est l'affaire du thème, et c'est ce qui maintient le site publié cohérent (et exempt de JavaScript à l'exécution).

Travailler avec les images

Le bouton image ouvre la médiathèque dans un sélecteur au lieu de demander une URL. Choisissez l'image déjà téléchargée (ou téléchargez-la là), et elle est placée à votre curseur. Les images proviennent donc toujours de la médiathèque ; vous la stockez d'abord, puis vous les utilisez dans les pages.

Travailler avec les liens

Le bouton lien, ou Ctrl/Cmd+K n'importe où dans l'éditeur, ouvre un panneau de liens. Pendant que vous tapez, il suggère les pages et posts publiés de votre propre site par titre ou slug (dans la même langue que celle que vous éditez, le cas échéant), y compris l'URL complète des pages imbriquées. Appuyez sur Entrée (ou cliquez) sur une suggestion pour l'utiliser, ou collez n'importe quelle URL externe. Les suggestions n'incluent que des pages réellement en ligne, donc vous ne pouvez pas lier accidentellement des brouillons.

Blocks de contenu dans le corps

Les blocks de contenu réutilisables (CTA, citations, galeries, formulaires…) sont incorporés dans le corps comme shortcodes {{block:name​}}, mais l'éditeur les affiche comme des chips sympathiques plutôt que du code brut :

  • Insérer un block : utilisez le bouton Insérer un block (une boîte de dialogue recherchable listant vos blocks), tapez / dans le texte pour ouvrir un sélecteur de block en ligne (flèches + Entrée, Échap pour annuler), ou insérez un shortcode depuis la Content Library.
  • Les chips affichent ce qu'elles sont : chaque chip est étiquetée avec le nom du block au lieu d'exposer la syntaxe du shortcode.
  • Les chips sont cliquables : cliquez sur une chip pour ouvrir l'écran d'édition de ce block dans un nouvel onglet, ajustez le block, et il est déjà mis à jour partout où il est utilisé à la prochaine construction.
  • À l'enregistrement, les chips deviennent de vrais shortcodes dans le corps stocké ; au rechargement, elles redeviennent des chips. Coller dans l'éditeur un contenu contenant des marques {{block:…​}} les transforme également en chips.

Comportement de votre texte vis-à-vis du serveur

Quelques règles de qualité existent pour que des mois d'édition ne corrompent pas lentement les pages :

  • Les lignes vides sont nettoyées. Les lignes vides que la mécanique de Quill ajoute à chaque enregistrement sont réduites : les paragraphes vides répétés n'en font qu'un, et la ligne vide parasites en fin d'article est supprimée.
  • Le corps ne peut pas être vide. Une page ou un post exige un contenu de corps : du texte visible, une image, ou un block incorporé ; les espaces purs et les balises vides sont rejetés avec un message clair « Body is required », à la fois dans le formulaire puis à nouveau côté serveur.
  • Tout le reste est stocké tel quel. Le HTML que l'éditeur produit est exactement ce que sert le site publié.

Brouillons

Pendant que vous éditez, votre travail est périodiquement enregistré côté serveur comme brouillon. Si votre navigateur se ferme ou plante, l'éditeur affiche une bannière proposant le brouillon enregistré pour que vous continuiez plutôt que de tout retaper. (Une fois que vous enregistrez correctement, le magasin de brouillons se synchronise en conséquence.)

Surfaces d'édition connexes

  • Une modale de sélecteur de documents est disponible depuis les éditeurs de page/post pour créer des liens vers des documents gérés.
  • L'éditeur est partagé entre pages et posts, donc les deux utilisent les mêmes règles de titres, la même gestion des images et la même incorporation de blocks.
Lisez ce site en