Les sections sont des groupes réutilisables de blocs Portable Text. Les éditeurs peuvent les insérer dans n’importe quel champ Portable Text, puis modifier les blocs insérés sans changer la section source.
Utilisez les sections pour des points de départ répétables, comme un appel à l’action, la biographie d’un auteur ou un avis standard. Utilisez une zone de widgets lorsqu’une valeur gérée de manière centralisée doit se mettre à jour partout où elle apparaît.
Créer une section
Créez et gérez les sections dans Sections dans l’administration d’EmDash.
-
Cliquez sur New section et saisissez un titre, un slug et une description facultative.
-
Ajoutez le contenu que les éditeurs doivent obtenir lorsqu’ils insèrent la section.
-
Ajoutez des mots-clés de recherche pour les termes que les éditeurs pourraient utiliser en cherchant la section.
-
Enregistrez la section.
Les slugs de section contiennent des lettres minuscules, des chiffres et des tirets. Le slug identifie la section dans les templates et dans l’API ; ce n’est pas l’URL d’une page publique.
Insérer une section dans le contenu
-
Placez le curseur dans un champ Portable Text et saisissez
/section. -
Recherchez la section par titre, description ou mot-clé.
-
Sélectionnez la section pour insérer ses blocs à l’emplacement du curseur.
-
Modifiez le contenu inséré si nécessaire, puis enregistrez l’entrée.
L’éditeur copie le Portable Text de la section dans l’entrée. Les modifications ultérieures de la section de la bibliothèque ne changent pas les copies déjà insérées.
Fournir des sections dans un fichier seed
Un thème ou un starter peut fournir des sections dans son fichier seed. Donnez une _key stable à chaque bloc et à chaque span Portable Text, comme pour les autres contenus seed.
Le fichier seed suivant ajoute une section de newsletter :
{
"version": "1",
"sections": [
{
"slug": "newsletter-signup",
"title": "Newsletter signup",
"description": "A short newsletter call to action",
"keywords": ["newsletter", "subscribe", "email"],
"source": "theme",
"content": [
{
"_type": "block",
"_key": "newsletter-heading",
"style": "h3",
"children": [
{
"_type": "span",
"_key": "newsletter-heading-text",
"text": "Receive new articles by email"
}
]
},
{
"_type": "block",
"_key": "newsletter-body",
"style": "normal",
"children": [
{
"_type": "span",
"_key": "newsletter-body-text",
"text": "Subscribe for occasional updates."
}
]
}
]
}
]
}
Exécutez emdash seed --validate avant d’appliquer un fichier seed écrit à la main. Consultez Fichiers seed pour les options d’application et de gestion des conflits.
Les sections fournies par un thème utilisent la source theme. Les sections créées dans l’administration utilisent user, et les blocs réutilisables WordPress importés par EmDash utilisent import. Consultez Importation de contenu pour le flux d’importation.
Afficher une section dans un template
La plupart des sites affichent le contenu d’une section dans le cadre de l’entrée dans laquelle il a été copié. Pour afficher directement la valeur actuelle de la bibliothèque, récupérez la section par son slug et passez son contenu à PortableText.
Le composant suivant affiche une section de newsletter interrogée de façon centralisée :
---
import { getSection } from "emdash";
import { PortableText } from "emdash/ui";
const section = await getSection("newsletter-signup");
---
{section && (
<aside aria-label={section.title}>
<PortableText value={section.content} />
</aside>
)}
Ce chemin de rendu direct lit la valeur de la bibliothèque à chaque rendu : une modification ultérieure de la section affecte donc tous les endroits qui utilisent ce composant.
La référence de l’API d’exécution documente les requêtes de sections et la pagination. Pour les modifications programmatiques, authentifiez-vous avec un jeton Bearer et ajoutez X-EmDash-Request: 1 à chaque requête qui modifie l’état. Consultez les points de terminaison des sections pour les corps de requête et les réponses.