WebBlocks CMS pour la création de pages IA
Objectif
Il s'agit du contrat de conception et de création compact, orienté vers l'IA, pour WebBlocks CMS. Lisez-le avant de proposer ou d'appliquer une conception de page via le Internal Content API.
Il répond à cinq questions pour chaque bloc de base expédié :
- Quel contenu reste modifiable dans l'administrateur du CMS ?
- Quels paramètres partagés et variantes sont pris en charge ?
- Quelles relations enfants-médias sont valides ?
- Quel public stable HTML le moteur de rendu émet-il ?
- Quel résultat visuel le bloc peut-il produire sans page brute HTML ?
Ce document résume le comportement basé sur la source. La découverte d'API en direct fait autorité pour les ID spécifiques à l'installation, les plug-ins activés, les types de blocs personnalisés, les paramètres régionaux, les mises en page, les enregistrements multimédias, les menus de navigation et les fonctionnalités.
Référence d'audit
- Dépôt :
fklavyenet/webblocks-cms - Succursale :
main - Validation auditée :
741a44bc0fe00bf38cae0753bd9edb02978b0dbe - Documentation de version auditée :
1.40.2 - Date d'audit :
2026-07-14 - Forme du référentiel : package Composer réservé au package
- Lignes du catalogue principal publiées :
51 - Brouillon de lignes de catalogue hérité :
7 - Lignes principales structurées inscriptibles par l'IA une fois la politique ci-dessous appliquée :
50 - Lignes HTML brutes inscriptibles par l'IA une fois la stratégie ci-dessous appliquée :
0
Modifications depuis l'audit
La référence ci-dessus est toujours le dernier audit complet. Ces entrées ont été corrigées
contre la source par la suite plutôt que de ré-auditer chaque bloc, alors traitez n'importe quoi
en dehors de cette liste sous l'ère 1.40.2 et confirmez-le via la découverte d'API en direct.
card(1.40.5) : le style Cartevariantexiste. Ce document précédemment a déclaré qu'aucun champ de variante visuelle de carte pris en charge n'existait, ce qui était faux à partir de1.40.5.link-list(1.40.10) :settings.row_layoutetsettings.list_frame.link-list-item(1.40.8) : miniaturemedia_iden option.1.91.0: relations mobile-image optionnelles sur huit blocs média natifs.1.91.1: les neuf positions de contenu Slide et Slider.1.93.0: annulation/rétablissement de texte enrichi, mode de mise au point, nombre de mots et comportement de collage sécurisé.1.94.0–1.94.2: validation de démarrage du plug-in géré, quarantaine, packages conservés et vérifications de récupération de compte actif.
Note du référentiel historique : l'arborescence CMS pré-package uniquement contenait docs/feature-inventory.md, une vaste matrice de découverte des fonctionnalités du produit. Il a été supprimé lors de la construction de l'arborescence du référentiel réservé aux packages et ne constituait pas un inventaire de création d'IA par bloc. Le contrat d'exécution réside désormais sur resources/contracts/inventory.md.
Familles sources inspectées :
src/Support/Blocks/CoreBlockTypeCatalogSyncer.phpsrc/Support/BlockTypes/BlockTypeContractRegistry.phpsrc/Support/Blocks/BlockTranslationRegistry.phpsrc/Models/Block.phpsrc/Http/Requests/Admin/BlockRequest.phpsrc/Support/InternalContentApi/InternalContentPlanService.phpsrc/Support/InternalContentApi/InternalContentApiOperations.phpsrc/Http/Controllers/InternalContentApi/InternalContentResourceController.phpsrc/Http/Controllers/InternalContentApi/InternalSharedSlotController.phpsrc/Http/Controllers/InternalContentApi/InternalApiDiscoveryController.phproutes/admin.phpresources/views/admin/blocks/types/*.blade.phpresources/views/admin/blocks/settings/*.blade.phpresources/views/pages/partials/blocks/*.blade.phppublic/cms/css/public.css- tests de packages ciblés et documentation produit actuelle
Règles de création d'IA non négociables
- Utilisez des blocs structurés. Ne stockez pas de page, de section, de collection de cartes, de shell de navigation, de formulaire ou de composant visuel dans Trusted HTML.
htmlest une trappe d'évacuation réservée aux humains. La découverte d'API peut l'identifier comme indisponible, mais aucune mutation d'API ne peut créer, mettre à jour, remplacer, déplacer, réorganiser, cloner, promouvoir, publier ou supprimer un bloc HTML.- Ne contournez pas la restriction HTML via Rich Text,
<style>,<script>, les attributs du gestionnaire d'événements, le balisage iframe, le balisage SVG, le balisage codé ou les paramètres inventés. - Utilisez uniquement les champs, les valeurs d'énumération, les rôles multimédias et les relations enfants documentés ici et confirmés par la découverte en direct.
- Traitez un champ modifiable par l’administrateur dans le cadre du contrat de création pris en charge. Une valeur reconnue uniquement par un moteur de rendu ou un chemin de compatibilité hérité n'est pas un champ de création IA normal.
- Si une région visuelle ne peut pas être exprimée avec le contrat pris en charge, arrêtez-vous et signalez un écart de capacité. Ne vous en approchez pas silencieusement avec des blocs non liés et ne revenez pas à HTML.
- Le site CSS peut affiner la typographie, l'espacement, la couleur, les bordures, les ombres et la présentation réactive grâce à des hooks publics stables. Il ne doit pas devenir un magasin de contenu caché ni reconstruire le balisage sémantique manquant.
- Ne ciblez pas les ID de base de données, les ID de bloc générés, les sélecteurs de position frères ou
:nth-child()pour le comportement de conception essentiel. Préférez les attributs de type bloc, les classes nativeswb-*, les classes de corps de page et les paramètres documentés. - Conservez tous les titres, paragraphes, étiquettes, boutons, badges, images, légendes, menus et paramètres de formulaire visibles modifiables via son champ CMS natif ou l'enregistrement associé.
- Validez d'abord, appliquez uniquement après l'approbation explicite de l'utilisateur, créez d'abord des brouillons et laissez les actions de mise à jour du système en direct et les tests visuels en direct à l'opérateur humain, sauf autorisation distincte.
- Traitez la carte comme une présentation facultative et non comme le moyen par défaut de regrouper la copie associée. Utilisez une carte uniquement pour une entité exploitable de manière indépendante, reproductible ou limitée, telle qu'un produit, un plugin, un plan tarifaire, un téléchargement ou un formulaire.
- Avant de choisir des blocs, indiquez une direction de conception au niveau du site couvrant le caractère, la densité, la typographie, la géométrie, les images, les coins et le contraste. Faites en sorte que l'arborescence de blocs et le site CSS mettent en œuvre cette direction au lieu de choisir chaque section isolément.
- Variez délibérément le rythme des pages. Combinez des régions étroites, régulières, larges et pleine largeur ; alternez copie silencieuse, images dominantes et collections structurées plutôt que de répéter des sections de poids égal.
HTML Bloquer la stratégie d'API
Le contrat de produit cible est :
| Surface | Comportement html |
|---|---|
| Administrateur CMS | Les opérateurs humains peuvent créer et modifier le Trusted HTML révisé. |
| Moteur de rendu public | Les blocs HTML publiés existants continuent de s'afficher. |
| Découverte d'API | Signalez le bloc comme api_readable: true, api_writable: false, authoring: human_only et expliquez la restriction. Ne présentez pas d’exemple de charge utile inscriptible. |
| Contenu valider/appliquer | Rejetez toute charge utile html nouvelle ou de remplacement avec le code stable block_type_not_api_writable. |
| Création de bloc de page/emplacement partagé incrémentiel | Rejetez html avant la normalisation ou la persistance. |
| Bloc existant PATCH | Rejeter lorsque le type de bloc cible est html, même si le champ soumis serait autrement considéré comme sûr. |
| Réorganisation, déplacement, suppression, remplacement d'emplacement, mise à jour par étapes et promotion | Rejetez toute mutation dont le sous-arbre affecté ou la portée de remplacement contient un bloc HTML existant. Ne le supprimez pas comme effet secondaire. |
| Capacités des jetons API | Aucune fonctionnalité ne peut remplacer la restriction au niveau du produit. |
| Lire les points de terminaison | Peut retourner le bloc existant pour inspection selon la politique de lecture choisie ; l'accès en lecture ne doit jamais impliquer un accès en écriture. |
Cette stratégie est appliquée dans le code par une classe de stratégie de produit unique, WebBlocks\Cms\Support\BlockTypes\BlockTypeApiAuthoringPolicy. Chaque surface d'API la consulte au lieu de répéter la règle : les deux normalisateurs de bloc, le PATCH de bloc existant, la création incrémentielle de page et Shared Slot, la réorganisation de page/Shared Slot, la suppression de sous-arborescence, l'effacement complet de Shared Slot, la publication de page et Shared Slot, le remplacement d'emplacement de brouillon, la création et la promotion de mises à jour par étapes, l'affectation de Shared Slot et la suppression de page d'API. Les rejets se produisent avant toute transaction ou écriture, renvoient HTTP 422 avec le code stable block_type_not_api_writable et ne laissent aucune modification partielle. Aucune capacité de jeton ne la remplace.
Que signifie « gérable par CMS »
Une conception est gérable par le CMS uniquement lorsque toutes les conditions suivantes sont remplies :
- Le contenu visible est stocké dans les champs de traduction natifs, les paramètres, les relations de la médiathèque, les enregistrements de navigation, les enregistrements commerciaux ou les blocs enfants.
- L'éditeur de blocs normal expose les champs nécessaires pour conserver le résultat.
- Le balisage public provient d'un moteur de rendu de package ou de plugin, et non du contenu de la page.
- La présentation utilise des variantes documentées, des paramètres, des jetons de thème et des hooks CSS stables.
- La réorganisation ou la modification du contenu ne nécessite pas la modification de HTML ou CSS.
- Le comportement mobile provient du moteur de rendu, WebBlocks UI ou du site stable CSS plutôt que du balisage mobile dupliqué dans le contenu.
Un moteur de rendu peut reconnaître une valeur héritée ou interne que le formulaire d'administration normal n'expose pas. Une telle valeur est documentée comme une entrée de compatibilité, et non comme un champ de création IA recommandé.
Table de décision de conception
| Besoin visuel | Contrat préféré | Condition d'arrêt |
|---|---|---|
| Bande de pages majeures | section avec blocs enfants | Ne mettez pas de copie visible dans les paramètres de la section. |
| Contrainte de largeur | container | N’utilisez pas le conteneur comme carte ou surface. |
| Rythme de contenu vertical | stack | Ne pas utiliser le conteneur uniquement pour obtenir un flux vertical. |
| Contenu principal plus une action ou une valeur compacte | split | Utilisez exactement deux enfants directs ; Nest Stack lorsqu'un côté a besoin de plusieurs blocs. |
| Actions horizontales ou éléments compacts | cluster | N'utilisez pas Grid pour une seule ligne de boutons. |
| Cellules répétées réactives | grid avec enfants structurés | N'utilisez pas Grid pour simuler un tableau sémantique. |
| Titre de la page, introduction, badge, icône, métadonnées | content_header | Il possède toujours un H1 ; ne l'utilisez pas pour les titres imbriqués ordinaires. |
| Introduction marketing | hero | Hero prend en charge les mises en page à gauche, centrées, divisées et à fond perdu ; la division restitue le média de premier plan tandis que le fond perdu crée une bande photographique non encadrée. Signalez un écart lorsque la conception nécessite une deuxième image de premier plan modifiable ou un contenu imbriqué arbitraire. |
| Bande de conversion | cta | Le CTA actuel n’accepte pas les enfants structurés normaux autres que les enfants de boutons hérités gérés. |
| Éléments de fonctionnalités ou de statistiques répétés | columns et column_item | Préférez grid et card composables lorsqu'un contenu imbriqué arbitraire est nécessaire. |
| Carte composable | card plus Régions de la carte | À utiliser uniquement pour du contenu indépendant/exploitable ; les variantes sont par défaut, plat, sourdine, surbrillance et accent. |
| Image sémantique unique | image | Utilisez Galerie pour les collections et les champs multimédia d’arrière-plan pour les arrière-plans pris en charge. |
| Collection d'images | gallery | N’ajoutez pas de lightbox HTML distincte. |
| Curseur/carrousel | slider plus slide | Utilisez Galerie lorsque le contenu est uniquement une collection d’images. |
| Navigation | Enregistrements de navigation et blocs Navbar/Sidebar | Ne codez pas en dur les ancres de navigation dans HTML. |
| Formulaire de contact | contact_form | N'utilisez pas le balisage brut <form> ou mailto: comme forme normale. |
| Notes/commentaires | rating et comments | Ne reproduisez pas le stockage ou les formulaires de fiançailles dans HTML. |
| Composition ponctuelle non prise en charge | Rapport sur les lacunes en matière de capacités | Ne choisissez jamais par défaut html. |
Forme canonique du plan de contenu
Utilisez des tableaux children imbriqués. Ne soumettez pas d'ID de relation de base de données dans un plan de contenu.
{
"type": "section",
"settings": {
"spacing": "lg"
},
"children": [
{
"type": "container",
"settings": {
"width": "lg"
},
"children": [
{
"type": "plain_text",
"translations": {
"content": "Editable copy"
}
}
]
}
]
}
Conventions du plan de contenu :
- Placez la copie appartenant aux paramètres régionaux directement sous
translationspour les paramètres régionaux du plan sélectionné. - Put URL, cible, variante de présentation et autres options partagées sous
settings. - Put affectation directe de la bibliothèque multimédia dans
media_id. slide,image,hero,section,card,cta,content_headeretlink-list-itemaccepte également un référencementmobile_media_idde niveau supérieur en option un enregistrement de la médiathèque d’images. Il est stocké dansblock_mediaavec le rôlemobile_image, partagé entre les paramètres régionaux et modifiable via le support d'administration sélecteur etPATCH /blocks/{block}. Sur les écrans jusqu'à 768 px de large, il remplace l'image par défaut ; une image mobile absente, supprimée ou privée revient à la valeur par défaut. Envoyeznullpour l'effacer ; l'omettre dans PATCH le préserve. Les images de premier plan utilisent<picture><source media="(max-width: 768px)">; les blocs d'arrière-plan utilisent un arrière-plan réactif CSS. Utilisez une autre récolte du même visuel : le texte alternatif, les légendes, la position, l'ajustement, les superpositions et les liens restent partagé. La visionneuse de galerie du bloc Image continue d'ouvrir la fenêtre par défaut image en pleine résolution. Les éléments de la galerie, les logos de marque, les vidéos et les fichiers audio ne sont pas pris en compte. acceptez ce champ.- Placer les éléments de la galerie dans
gallery_itemsougallery_media_ids. - Utilisez uniquement
childrenimbriqué ; n'envoyez pasid,parent_id,block_id,slot_type_idoublock_type_id. - L'API accepte actuellement un objet
settingsde forme large. Cette permissivité n’est pas une permission d’inventer des paramètres ; utilisez uniquement les clés répertoriées ci-dessous.
Shell de rendu public
Le rendu normal de l'emplacement principal fournit :
<main class="wb-public-main" id="main-content">
<div class="wb-container wb-container-lg">
<div class="wb-stack wb-gap-6">
<!-- page blocks -->
</div>
</div>
</main>
Les blocs marqués root-owning placent data-wb-public-block-type sur leur propre racine sémantique. Les autres blocs de niveau supérieur reçoivent normalement :
<div class="wb-public-block" data-wb-public-block-type="block-handle">
<!-- renderer output -->
</div>
Les traits de soulignement sont normalisés en traits d'union dans data-wb-public-block-type ; par exemple content_header devient content-header.
Index rapide du catalogue
Le catalogue principal publié actuellement contient 55 lignes :
| Poignées | |
|---|---|
| Mise en page et composition | section, container, stack, split, cluster, grid, card, card_header, card_body, card_footer, slider, slide |
| Rédaction et marketing | header, plain_text, rich-text, content_header, hero, cta, columns, column_item, feature-grid, feature-item, stat-card, image, gallery, download, file, video, audio, code, button_link, table, quote, page-list, application |
| Navigation | link-list, link-list-item, navigation-auto, toc, breadcrumb, header-actions, sticky-navbar, navbar-brand, navbar-navigation, sidebar-brand, sidebar-navigation, sidebar-nav-item, sidebar-nav-group, search-form, sidebar-footer |
| Modèle, forme et engagement | alert, contact_form, rating, comments |
| Humain uniquement avancé | HTML |
Blocs de mise en page et de composition
— Section
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Objectif | Bande de pages sémantiques majeures et regroupement d'enfants. |
| Contenu modifiable par l'administrateur | Aucune copie visible. Le settings.layout_name facultatif concerne uniquement les métadonnées de l’éditeur. |
| Paramètres | spacing: empty, sm, lg; flow: normal, offset-up, overlap-previous; arrière-plan facultatif media_id ; background_position: center, top, bottom, left, right; background_overlay: soft, medium, strong, none. |
| Enfants | Tout type d'enfant publié pris en charge ; au moins un enfant pouvant être rendu est requis par les plans API. |
| HTML | <section class="wb-section [wb-section-sm or wb-section-lg] [wb-public-section--offset-up or wb-public-section--overlap-previous] wb-stack" data-wb-public-block-type="section">…</section> propriétaire de la racine. Le support d’arrière-plan ajoute des crochets de classe/style appartenant au package. Les modificateurs de flux sont réinitialisés sur les petits écrans. |
| Exemple d'apparence | Une bande thématique pleine largeur contenant un conteneur contraint, ou une bande délibérément décalée qui brise le rythme vertical uniforme. |
| Éviter | Texte visible dans les paramètres, chrome vide, utilisation de la section comme carte ou chevauchement de plusieurs sections consécutives. |
container — Récipient
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Objectif | Contrainte de largeur et flux enfant facultatif. |
| Contenu modifiable par l'administrateur | Aucune copie visible ; layout_name en option pour l'éditeur uniquement. |
| Paramètres | width: empty, sm, md, lg, xl, full; flow: stack or none. |
| Enfants | Tout type d'enfant publié pris en charge ; au moins un enfant requis par les plans API. |
| HTML | <div class="wb-container [wb-container-*] [optional wb-stack]" data-wb-public-block-type="container">…</div> propriétaire de la racine ; wb-stack nécessite flow: stack explicite. |
| Exemple d'apparence | Contenu de page centré avec une largeur maximale ; la valeur par défaut neutre compose directement avec un cluster dans la barre de navigation. |
| Éviter | Traiter la largeur comme un rôle de surface, de carte ou de thème. |
stack — Empiler
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Objectif | Flux vertical et rythme cohérent entre les blocs enfants directs. |
| Contenu modifiable par l'administrateur | Aucune copie visible ; layout_name en option pour l'éditeur uniquement. |
| Paramètres | spacing: empty/default, 1, 2, 3, 4, 6, 8. |
| Enfants | Tout type d'enfant publié pris en charge ; au moins un enfant requis par les plans API. |
| HTML | <div class="wb-stack [wb-stack-{n}]" data-wb-public-block-type="stack">…</div> propriétaire de la racine. |
| Exemple d'apparence | Un nom de produit, une description et une note à l’appui disposés de haut en bas. |
| Éviter | Contrôle de la largeur de page, actions horizontales ou colonnes égales. |
split — Diviser
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Objectif | Composition double face où le premier enfant grandit et le second reste à la taille du contenu. |
| Contenu modifiable par l'administrateur | Aucune copie visible ; layout_name en option pour l'éditeur uniquement. |
| Paramètres | gap: empty/default, 0, 1, 2, 3, 4, 6, 8; items_alignment: center/default, start, end, stretch; width: auto/default or full; responsive: stack or preserve. New admin/API blocks default to stack while existing empty settings preserve the legacy row. |
| Enfants | Exactement deux enfants directs. Placez une pile à l'intérieur de chaque côté lorsque ce côté a besoin de plusieurs blocs. |
| HTML | <div class="wb-split …" data-wb-public-block-type="split">…</div> propriétaire de la racine avec classes wb-* sur liste autorisée. La pile réactive ajoute .wb-public-split--stack-mobile appartenant au package et passe à une colonne pleine largeur à 48rem et moins. |
| Exemple d'apparence | Identité du produit à gauche et prix plus action d'achat à droite. |
| Éviter | Colonnes égales répétées, groupes de boutons d'habillage ou plus de deux enfants directs. |
cluster — Grappe
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Objectif | Composition horizontale ou en ligne, en particulier les actions et les éléments internes de la barre de navigation. |
| Contenu modifiable par l'administrateur | Aucune copie visible ; layout_name en option pour l'éditeur uniquement. |
| Paramètres | gap: empty, none, xs, sm, md, lg; alignment: start/default, center, end, between; items_alignment: center/default, start, end, stretch; wrap: wrap/default or nowrap; width: auto/default or full. |
| Enfants | Tout type d'enfant publié pris en charge ; au moins un enfant requis par les plans API. |
| HTML | <div class="wb-cluster …" data-wb-public-block-type="cluster">…</div> propriétaire de la racine avec les classes wb-* sur liste autorisée. |
| Exemple d'apparence | Une ligne CTA ou une ligne marque/navigation/actions réactive à deux boutons. |
| Éviter | Grandes grilles de cartes répétées. |
grid — Grille
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Objectif | Disposition multi-colonnes réactive. |
| Contenu modifiable par l'administrateur | Aucune copie visible ; layout_name en option pour l'éditeur uniquement. |
| Paramètres | columns: 2, 3, 4; ratio: equal, lead-left, lead-right (asymmetric ratios apply only to two columns); gap: empty, 3, 4, 6; alternate_media_text_sections: boolean; alternate_start: media_left or text_left. |
| Enfants | Tout type d'enfant publié pris en charge ; au moins un enfant requis par les plans API. |
| HTML | <div class="wb-grid wb-grid-{n} [wb-gap-{n}] [wb-public-grid--lead-*]" data-wb-public-block-type="grid">…</div> propriétaire de la racine. Les ratios de leads sont de 2 : 1 ou 1 : 2 au-dessus du point d'arrêt mobile normal à une colonne. Le mode alternatif peut modifier l'ordre des enfants directs sans changer la racine. |
| Exemple d'apparence | Trois blocs de cartes dans une rangée de fonctionnalités ou des groupes d'images/contenus appariés en alternance à gauche et à droite. |
| Éviter | Tableaux sémantiques ou ligne d'action compacte. |
card — Carte
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Objectif | Surface encadrée composable. |
| Contenu modifiable par l'administrateur | Aucune copie parent visible normale ; layout_name en option pour l'éditeur uniquement. Les anciennes lignes de cartes sans région peuvent toujours afficher une ancienne copie. |
| Paramètres | Style de carte facultatif sur la colonne partagée variant : flat, muted, highlight, accent ; un variant vide restitue la carte par défaut. Image d’arrière-plan facultative media_id, background_position, background_overlay. Les modèles url et target en option font de l'ensemble de la carte composable un lien sémantique. |
| Enfants | Enfants directs limités à card_header, card_body, card_footer ; au moins un enfant requis par les plans API. |
| HTML | <article class="wb-card">…</article> propriétaire de la racine ou <a class="wb-card wb-no-decoration">…</a> lorsqu'une URL de carte entière est configurée. Les cartes liées ne doivent pas contenir de contrôles interactifs imbriqués. |
| Exemple d'apparence | En-tête d’image ou d’icône, contenu du corps modifiable et pied de page d’action dans une coque de carte native. |
| Éviter | Cartes imbriquées dans des cartes ou utilisant une copie parent héritée pour le nouveau contenu. |
card_header — En-tête de carte
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Objectif | Région d’en-tête à l’intérieur de la carte. |
| Contenu modifiable par l'administrateur | Pas de copie directe ; les blocs enfants contiennent du contenu. layout_name en option pour l'éditeur uniquement. |
| Paramètres | icon_slug du catalogue d'icônes de contenu actif ; icon_tone: default, soft, brand, accent, highlight, bold, quiet; icon_size: default, sm, lg, xl. |
| Enfants | Enfants à contenu structuré. N’imbriquez pas les blocs de région de carte. Le placement normal se fait directement sous la carte. |
| HTML | <div class="wb-card-header" data-wb-public-block-type="card-header">[icon]…</div> propriétaire de la racine. |
| Exemple d'apparence | Ligne de titre de carte avec une icône de catalogue et un en-tête/texte brut imbriqué. |
| Éviter | Placement en dehors de la carte. |
card_body — Corps de la carte
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Objectif | Région de contenu principale à l’intérieur de la carte. |
| Contenu modifiable par l'administrateur | Pas de copie directe ; les blocs enfants contiennent du contenu. layout_name en option pour l'éditeur uniquement. |
| Paramètres | Aucun paramètre visuel public au-delà de layout_name réservé à l'éditeur. |
| Enfants | Enfants à contenu structuré ; Les plans API en nécessitent au moins une. N’imbriquez pas les blocs de région de carte. |
| HTML | <div class="wb-card-body" data-wb-public-block-type="card-body">…</div> propriétaire de la racine. |
| Exemple d'apparence | Copie de carte, image, texte enrichi ou petit groupe de boutons. |
| Éviter | Placement en dehors de la carte. |
card_footer — Pied de page de la carte
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Objectif | Région de support ou d’action à l’intérieur de la carte. |
| Contenu modifiable par l'administrateur | Pas de copie directe ; les blocs enfants contiennent du contenu. layout_name en option pour l'éditeur uniquement. |
| Paramètres | Aucun paramètre visuel public au-delà de layout_name réservé à l'éditeur. |
| Enfants | Enfants à contenu structuré ; Les plans API en nécessitent au moins une. N’imbriquez pas les blocs de région de carte. |
| HTML | <div class="wb-card-footer" data-wb-public-block-type="card-footer">…</div> propriétaire de la racine. |
| Exemple d'apparence | Un ou deux enfants Button Link alignés par un cluster imbriqué. |
| Éviter | Placement en dehors de la carte. |
slider — Curseur
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Objectif | Carrousel composable qui remplit son conteneur placé. |
| Contenu modifiable par l'administrateur | Aucune copie parent visible ; layout_name en option pour l'éditeur uniquement. |
| Paramètres | height: auto, fill, viewport, large, medium, small, custom; min_height en option ; aspect_ratio: 16/9, 4/3, 1/1; interval_ms: 1000–30000; booléens autoplay, pause_on_hover, show_arrows, show_dots, loop, swipe, keyboard ; overlay: none/default, soft, medium, dark, strong; content_position: center/default, center-left, center-right, top-left, top-center, top-right, bottom-left, bottom-center, bottom-right; content_width: medium/default, narrow, wide, full; text_color: auto/default, light, dark; background_fit: cover/default or contain. Transition is currently normalized to slide. |
| Enfants | Uniquement slide ; au moins une diapositive requise. |
| HTML | <section class="wb-slider …" data-wb-slider data-wb-public-block-type="slider"> propriétaire de la racine avec fenêtre d'affichage, piste, flèches et points en option. |
| Exemple d'apparence | Carrousel de héros pleine largeur, curseur contenu dans une carte ou panneaux multimédia d'arrière-plan avec contenu enfant modifiable. |
| Éviter | Galeries d'images statiques. |
slide — Glisser
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Objectif | Un panneau à l’intérieur du Slider. |
| Contenu modifiable par l'administrateur | Aucune copie directement visible ; layout_name en option pour l'éditeur uniquement et aria_label partagé. |
| Paramètres | Image d'arrière-plan media_id ; background_position ; background_overlay (none, soft, medium, strong — chacun restitue un canevas distinct depuis WebBlocks UI 2.22.0 ; avant cela, medium s'est effondré sur strong) ; content_position: center/default, center-left, center-right, top-left, top-center, top-right, bottom-left, bottom-center, bottom-right; content_width ; text_color ; background_fit. |
| Enfants | Tout type d'enfant structuré pris en charge ; une diapositive en arrière-plan uniquement est autorisée. Le parent normal est Slider. |
| HTML | <article class="wb-slide …" data-wb-public-block-type="slide">[img.wb-slide-media]<div class="wb-slide-content">…</div></article> propriétaire de la racine. |
| Exemple d'apparence | Photo du produit en arrière-plan avec contenu d'en-tête, de texte brut et de lien de bouton imbriqué. |
| Éviter | Utilisation autonome de niveau supérieur lorsqu'aucune sémantique de carrousel n'est prévue. |
Blocs éditoriaux et marketing
header — En-tête
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | translations.title. |
| Paramètres et variantes | settings.variant: h1–h6; alignment: left, center, right; anchor: safe same-page ID. |
| Enfants/médias | Aucun. |
| HTML | <h1> propriétaire racine à <h6> avec classe d'alignement en option et id. |
| Exemple d'apparence | En-tête de section sémantique pouvant être indexé par table des matières. |
| Éviter | Introduction de la page avec métadonnées ; utilisez l'en-tête de contenu. |
plain_text — Texte brut
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | translations.content sous forme de texte brut échappé. |
| Paramètres et variantes | alignment: left, center, right. |
| Enfants/médias | Aucun. |
| HTML | Wrapper générique plus <p class="[wb-text-*]">…</p>. |
| Exemple d'apparence | Court paragraphe, étiquette ou phrase de support. |
| Éviter | Listes, liens, titres ou corps de texte formaté. |
rich-text — Texte enrichi
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | translations.content via l'éditeur et le désinfectant Rich Text sécurisé ; l'historique de l'éditeur prend en charge l'annulation/la restauration, avec un compteur de mots et un mode de mise au point en option. |
| Paramètres et variantes | Aucun. Les formats, attributs et classes non pris en charge sont supprimés ; les titres et cellules de tableau collés conservent leur texte sous forme de paragraphes et le balisage exécutable/média est supprimé. |
| Enfants/médias | Aucun. |
| HTML | Wrapper générique plus <div class="wb-rich-text">[sanitized editorial markup]</div>. |
| Exemple d'apparence | Plusieurs paragraphes avec une emphase en ligne sécurisée, des liens et des listes simples. |
| Éviter | Balisage de mise en page, <style>, scripts, iframes, formulaires, boutons, tableaux ou page complète. |
content_header — En-tête de contenu
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | translations.title, translations.subtitle comme introduction, translations.eyebrow comme étiquette de badge facultative, translations.meta comme éléments de métadonnées. |
| Paramètres et variantes | alignment: left, center, right; icon_slug ; icon_tone ; icon_size: default, sm, lg, xl; badge_tone: neutral, info, success, warning, danger; image d’arrière-plan et paramètres de superposition facultatifs. |
| Enfants/médias | Pas d'enfants ; L'image directe media_id est un média d'arrière-plan. |
| HTML | <header class="wb-content-header …"> propriétaire de la racine avec cluster d'icônes/badges en option, <h1 class="wb-content-title"> fixe, sous-titre et ligne de métadonnées. |
| Exemple d'apparence | Titre de la page avec badge/icône de produit facultatif, texte principal concis et deux étiquettes de métadonnées. |
| Éviter | Sections imbriquées où H1 est sémantiquement faux. |
hero — Héros
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | translations.title, translations.subtitle comme sourcil, translations.content. Les boutons d'action sont des blocs enfants button_link distincts avec leur propre formulaire d'administration. |
| Paramètres et variantes | variant: default, muted, soft, accent; layout: left, centered, split, or full-bleed; title_tag: h1, h2, h3; image d’arrière-plan et paramètres de superposition facultatifs. |
| Enfants/médias | Les actions sont des blocs enfants button_link, sans nombre fixe. Dans les mises en page à gauche/centrée/pleine page, media_id est un média d'arrière-plan ; en cas de division, il s'affiche sous la forme d'une image de premier plan à côté de la copie. |
| HTML | Les mises en page héritées possèdent <section class="wb-card wb-promo [wb-card-*]"> ; split ajoute .wb-promo--split et .wb-promo-media. Le fond perdu supprime délibérément la classe de carte et utilise .wb-public-hero--full-bleed avec un .wb-public-hero__copy aligné. |
| Exemple d'apparence | Une promotion contenue, une division image/copie de premier plan ou un héros photographique non encadré à l'échelle de la fenêtre d'affichage, ainsi que des actions. |
| Limitation stricte | Pas de deuxième image de premier plan, de région de prix du produit/de bande de confiance ou de contenu imbriqué arbitrairement. |
| Actions | Ajoutez les enfants button_link ; ils s'affichent à l'intérieur de .wb-promo-actions. Les objets primary_cta / secondary_cta {label, url} restent acceptés comme raccourci qui écrit les deux premiers de ces enfants. N'atteignez pas un cluster frère avec Button Link - qui s'affiche en dehors de la racine promotionnelle. allowed_child_handles répertorie également l'ancien button, qui n'a aucune ligne de catalogue publiée et reste dans unreachable_child_handles. |
cta — Appel à l'action
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | translations.title, translations.subtitle comme sourcil, translations.content. Les boutons d'action sont des blocs enfants button_link distincts avec leur propre formulaire d'administration. |
| Paramètres et variantes | variant: default, muted, soft, accent; image d’arrière-plan et paramètres de superposition facultatifs. Le titre du CTA s'affiche sous la forme H2. |
| Enfants/médias | Les actions sont des blocs enfants button_link, sans nombre fixe ; L'image directe media_id est un média d'arrière-plan. |
| HTML | <section class="wb-card wb-promo [wb-card-*]"> propriétaire de la racine avec .wb-promo-copy et ligne d'action facultative. |
| Exemple d'apparence | Bande de conversion courte vers la fin d’une page. |
| Actions | Identique à Hero : ajoutez les enfants button_link, ou utilisez le raccourci primary_cta / secondary_cta. |
| Limitation | settings.layout=centered est compatible avec le moteur de rendu mais n'est pas exposé par le formulaire d'administration CTA normal et n'est pas un champ de création IA recommandé. |
columns — Colonnes
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | translations.title, translations.subtitle, translations.content ; titre de l'élément enfant, badge, contenu, URL, icône et tonalités. |
| Paramètres et variantes | settings.variant: cards, plain, stats. New Internal Content API plans default an omitted variant to plain; cards doit être délibéré. Les blocs stockés existants avec une variante vide conservent l'ancienne solution de secours du moteur de rendu cards. |
| Enfants/médias | Uniquement column_item. Le nombre d'enfants sélectionne la disposition en pile, à 2 colonnes, à 3 colonnes ou à 4 colonnes. |
| HTML | <section class="wb-stack wb-gap-4"> propriétaire racine avec introduction facultative et grille d'éléments réactive. |
| Exemple d'apparence | Trois cartes d'avantages, quatre fonctionnalités compactes ou une simple ligne métrique. |
| Mise en garde concernant la gérabilité | Le moteur de rendu de statistiques peut utiliser l'enfant subtitle comme valeur, mais les formulaires d'administration d'élément de colonne normaux n'exposent pas ce subtitle. Les statistiques créées par l'IA qui en dépendent ne sont pas entièrement gérables et doivent être évitées jusqu'à ce que le contrat formel soit aligné. |
column_item — Élément de colonne
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | translations.title, translations.content, badge translations.eyebrow en option ; partagé settings.url, icon_slug, icon_tone, icon_size, badge_tone. |
| Paramètres et variantes | La présentation est contrôlée par la variante Colonnes parent : cartes, simples ou statistiques. |
| Enfants/médias | Aucun; destiné uniquement sous Colonnes. |
| HTML | Cartes : .wb-card > .wb-card-body ; plain: .wb-icon-card; stats: .wb-stat. Optional safe link wraps cards/plain output. |
| Exemple d'apparence | Carte de fonctionnalités d'icône et de copie avec un badge en option. |
| Éviter | Utilisation autonome ou s'appuyant sur des sous-titres du moteur de rendu uniquement pour une valeur statistique. |
Utilisez plain pour les qualités, principes, avantages, résumés de processus et autres copies qui ne représentent pas des objets indépendants. Utilisez cards uniquement lorsque chaque élément possède sa propre limite significative. Le nombre d'articles, en particulier le jeu de trois familier, n'est jamais en soi une raison pour choisir des cartes.
feature-grid — Grille de fonctionnalités
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | translations.title, subtitle, content ; champs de fonctionnalités enfants. |
| Paramètres et variantes | Aucune variante de présentation indépendante. Le moteur de rendu force la présentation des cartes Colonnes et préfère trois colonnes. |
| Enfants/médias | feature-item et compatibilité column_item. |
| HTML | Délégue aux colonnes et affiche une grille de cartes. Il n'est pas répertorié comme propriétaire racine par Block::ownsPublicRoot, donc la sortie de niveau supérieur peut recevoir un wrapper générique autour de la racine de section déléguée. |
| Exemple d'apparence | Anciennes cartes de fonctionnalités à trois. |
| Recommandation | Pour les nouvelles pages, préférez Colonnes/Élément de colonne ou Grille/Carte ; n'utilisez Feature Grid que lorsque son éditeur dédié est précieux et que le contrat délégué est accepté. |
feature-item — Article vedette
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | translations.title, translations.content, étiquette de badge en option ; URL partagée, slug/ton d’icône, ton de badge. |
| Paramètres et variantes | Délégue toujours à la présentation des cartes d'éléments de colonne. |
| Enfants/médias | Aucun; prévu sous Feature Grid. |
| HTML | .wb-card > .wb-card-body > .wb-icon-card with optional icon and badge. |
| Exemple d'apparence | Une carte de fonctionnalités dirigée par une icône. |
| Recommandation | Préférez les régions de carte canoniques ou les éléments de colonne pour les nouvelles compositions à usage général. |
stat-card — Carte de statistiques
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | Étiquette translations.subtitle, valeur translations.title, détail translations.content ; URL partagée. |
| Paramètres et variantes | Aucun. |
| Enfants/médias | Aucun. |
| HTML | Wrapper générique plus .wb-stat, .wb-stat-label, .wb-stat-value, .wb-stat-meta et un lien En savoir plus facultatif. |
| Exemple d'apparence | Valeur « 24h » avec étiquette « Expédition » et détails à l’appui. |
| Éviter | Carte marketing décorative où un contenu imbriqué arbitraire est nécessaire. |
— Image Liste de liens
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | Image alt_text et caption appartenant aux paramètres régionaux ; URL facultative partagée. |
| Paramètres et variantes | viewer_enabled choisit une image non liée dans la visionneuse de galerie CMS ; viewer_group regroupe des blocs d'images placés indépendamment dans un ensemble de visionneuse consultable. Le point focal et les variantes générées appartiennent à l’enregistrement Media. |
| Enfants/médias | Image directe media_id ; pas d'enfants. |
| HTML | <figure class="wb-stack wb-gap-2"> propriétaire de la racine avec sortie <img> réactive, image liée ou wb-gallery-trigger en option et <figcaption>. Les groupes activés enregistrent un modal de visionneuse de galerie existant sous la racine de superposition canonique. |
| Exemple d'apparence | Image du produit ou éditoriale avec une légende modifiable. |
| Éviter | Traitement de fond ou aménagement décoratif HTML. Utilisez Gallery lorsque la collection elle-même doit s'afficher sous la forme d'une seule grille ; utilisez des groupes de visionneuses lorsque des images composées indépendamment doivent partager une visionneuse sans changer de disposition. |
gallery — Galerie
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | Éléments de la Galerie commandés avec alt_text, caption, overlay_title, overlay_text appartenant aux paramètres régionaux ; titre de visionneuse partagé facultatif. La copie d'introduction de la galerie est intentionnellement séparée. |
| Paramètres et variantes | variant: grid, masonry, collage; columns: 2–5; gap: none, sm, md, lg; aspect_ratio: auto, square, 4:3, 16:9, portrait; captions_mode: hidden, below, overlay, on-hover; overlay_mode: none, gradient, solid; lightbox_enabled: boolean. |
| Enfants/médias | gallery_items ou gallery_media_ids faisant référence à des enregistrements multimédias d'images ; pas de blocage des enfants. |
| HTML | .wb-gallery.wb-gallery--{variant} propriétaire de la racine avec des éléments de galerie, des médias réactifs, des légendes et une visionneuse facultative appartenant au registre sous la racine de superposition canonique. |
| Exemple d'apparence | Grille de produits égale, maçonnerie éditoriale à hauteur naturelle ou collage en vedette. |
| Éviter | Ajout d'un titre/description dans la galerie ; composez un en-tête de contenu ou un texte enrichi avant celui-ci. |
download — Télécharger
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | Étiquette du bouton translations.title et copie d'assistance translations.subtitle. |
| Paramètres et variantes | settings.variant: primary, secondary, ghost. |
| Enfants/médias | Document direct/autre media_id ; pas d'enfants. |
| HTML | .wb-stack.wb-gap-2 propriétaire de la racine avec <a class="wb-btn …" download> et paragraphe d'assistance facultatif. |
| Exemple d'apparence | Bouton « Télécharger le guide » avec description du fichier. |
| Éviter | Fiches de fichiers externes uniquement ; utilisez Fichier. |
file — Déposer
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | translations.title, translations.content ; URL de secours partagée. |
| Paramètres et variantes | Aucun. |
| Enfants/médias | Document direct/autre media_id ; les médias l’emportent sur les URL externes sécurisées. |
| HTML | Carte muette appartenant à la racine avec titre, description, bouton de téléchargement/ouverture et métadonnées du fichier. |
| Exemple d'apparence | Carte de ressources PDF téléchargeable. |
| Éviter | Téléchargements simples par boutons uniquement. |
video — Vidéo
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | translations.title, translations.content ; URL sécurisée partagée de secours. |
| Paramètres et variantes | La source détermine la vidéo native, l'iframe YouTube/Vimeo ou le bouton d'ouverture de la vidéo. |
| Enfants/médias | Vidéo directe media_id ; pas d'enfants. |
| HTML | Carte muette appartenant à la racine contenant <video>, un fournisseur <iframe> sur liste verte ou un lien sécurisé. |
| Exemple d'apparence | Vidéo de démonstration téléchargée avec titre et description modifiables. |
| Éviter | Iframe arbitraire HTML. |
— Audio Fil d'Ariane
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | translations.title, translations.content ; URL HTTP sécurisée partagée de secours. |
| Paramètres et variantes | Aucun. |
| Enfants/médias | L'administrateur et le moteur de rendu prennent en charge les médias audio sélectionnés ; pas d'enfants. |
| HTML | Carte muette appartenant à la racine avec copie et <audio controls> natif. |
| Exemple d'apparence | Leçon audio ou lecteur d'échantillons. |
| Lacune API | La liste autorisée de média direct du plan de contenu audité omet l'audio, de sorte que l'attribution media_id est rejetée même si l'administrateur et le moteur de rendu la prennent en charge. Utilisez une URL sécurisée révisée uniquement lorsque cela est approprié ou corrigez le contrat de l'API avant l'attribution du média AI. |
— Code
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | translations.title, nom de fichier/étiquette de langue translations.subtitle, corps de code translations.content. |
| Paramètres et variantes | settings.language devient data-language désinfecté. |
| Enfants/médias | Aucun. |
| HTML | Emballage générique plus <pre><code data-language="…">…</code></pre>. |
| Exemple d'apparence | Commande ou extrait de source d'apparence copiable. |
| Éviter | Scripts en prose, en mise en page ou exécutables. |
button_link — Lien du bouton
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | translations.title comme étiquette de bouton ; partagé settings.url. Au moment du rendu public, un chemin interne suit les paramètres régionaux de rendu (réécrit dans le chemin traduit de la page cible lors de la résolution) ; la valeur stockée reste partagée et brute. |
| Paramètres et variantes | settings.target: _self or _blank; partagé variant : principal/par défaut ou secondaire. L'URL accepte une URL HTTP(S) complète, un chemin de site, une ancre, une cible mailto: ou tel: sécurisée. |
| Enfants/médias | Aucun. Il s'agit d'une action éditoriale autonome et distincte de l'enfant button non géré par catalogue utilisé par Hero et CTA. |
| HTML | Wrapper générique plus <a class="wb-btn wb-btn-primary"> ou son équivalent de classe secondaire ; _blank ajoute rel="noopener noreferrer". L'URL vide ou non sécurisée n'émet aucune ancre. |
| Exemple d'apparence | Une action principale ou secondaire gérée, ou plusieurs actions organisées par un Cluster. |
| Éviter | Ancres codées en dur dans HTML ou en les remplaçant par l'enfant d'action gérée interne de Hero/CTA lorsque l'action doit être rendue à l'intérieur de cette racine promotionnelle. |
table — Tableau
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | translations.title ; translations.content sous forme de lignes séparées par des nouvelles lignes et délimitées par des barres verticales. |
| Paramètres et variantes | settings.variant: header-row/default or plain. Legacy settings.rows remains readable but is not recommended for new API content. |
| Enfants/médias | Aucun. |
| HTML | Wrapper générique contenant .wb-table-wrap > table.wb-table, <thead> en option et <tbody>. |
| Exemple d'apparence | Petit tableau de comparaison ou de spécifications. |
| Éviter | Grilles de mise en page ou ensembles de données interactifs. |
quote — Citation
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | Devis translations.content, pièces d'attribution translations.title et translations.subtitle. |
| Paramètres et variantes | settings.variant: default or testimonial. |
| Enfants/médias | Aucun. |
| HTML | Wrapper générique avec <blockquote class="wb-stack wb-gap-2"> ; le témoignage ajoute une coque de carte en sourdine. |
| Exemple d'apparence | Citation éditoriale ou témoignage client. |
| Éviter | Légendes à usage général. |
Blocs de navigation
link-list — Liste de liens
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | translations.title, translations.subtitle, translations.content ; copie du lien enfant. |
| Paramètres et variantes | settings.row_layout: index (default), stacked puts each row description under its title. settings.list_frame: joined (default), cards gives each row its own card. Independent; les deux sont accessibles en écriture via l'API. |
| Enfants/médias | Uniquement link-list-item. |
| HTML | Wrapper générique avec pile d'introduction en option et .wb-link-list, plus wb-link-list--stacked / wb-link-list--cards pour les styles sélectionnés. |
| Exemple d'apparence | Index des ressources avec titre, métadonnées, description, icônes et badges. |
link-list-item — Élément de liste de liens
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | Badge translations.title requis, subtitle, content et eyebrow en option ; URL requise partagée. |
| Paramètres et variantes | icon_slug, icon_tone, icon_size, badge_tone. |
| Enfants/médias | Image miniature media_id en option ; prévu sous Liste de liens. |
| HTML | <a class="wb-link-list-item"> with an optional leading thumbnail or icon (adding wb-link-list-item--media), title/meta/badge, and optional description. |
| Exemple d'apparence | Ligne de documentation/ressource marquée « Nouveau ». |
| Garde de rendu | Émet uniquement avec une URL et un titre sécurisés. |
page-list — Liste des pages
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | Aucune copie de page. Les titres, descriptions et vignettes proviennent de la traduction de chaque page répertoriée : name, puis list_excerpt pour revenir à seo_description, puis og_image_media_id. |
| Paramètres et variantes | scope (page_type, path_prefix, subtree_of_current), page_type, path_prefix, sort, limit (1-48), layout (cards/links), columns, show_thumbnail, show_description, exclude_current, clickable_card. |
| Enfants/médias | Ni l'un ni l'autre. Les lignes proviennent d'une requête de page ; les vignettes sont résolues à partir de l'image Open Graph de chaque traduction de page. |
| HTML | wb-grid d'articles wb-card (ou racines de carte à liaison unique lorsque clickable_card est activé), ou un wb-link-list d'ancres wb-link-list-item. |
| Exemple d'apparence | Un index à trois colonnes de fiches guides, chacune étant liée à son titre. |
| Garde de rendu | N'émet rien lorsque la requête ne renvoie aucune page ou lorsque la portée n'est pas configurée. L'état publié, le site, la traduction des paramètres régionaux de rendu, les pages source Shared Slot et la page d'hébergement sont filtrés dans la requête et ne sont pas des paramètres. |
application — Bloc d'application
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | Aucune copie éditoriale. Sélectionne une application intégrée enregistrée dans la base de données par stable application_handle. |
| Paramètres et variantes | application_settings est validé par rapport au schéma de définition sélectionné. Les paramètres de présentation appartenant au CMS sont width, loading, aspect_ratio, min_height, show_loading_state et show_failure_state. |
| Enfants/médias | Ni l'un ni l'autre. Les actifs exécutables appartiennent à la définition de l'application enregistrée et ne peuvent pas être fournis via du contenu en bloc ou des médias. |
| HTML | Les applications en ligne reçoivent un .wb-application__mount généré ; Les applications iframe reçoivent une iframe en bac à sable appartenant au CMS. CSS et JavaScript déclarés par les définitions prêtes se chargent une fois par page. |
| Création d'API | Inscriptible via la validation/application du contenu et le correctif des paramètres de blocage direct. Découvrez les handles avec GET /webadmin/api/applications et les schémas avec /applications/{application}/schema ; ces lectures nécessitent applications.read. La mutation du registre n'est pas exposée. |
| Garde de rendu | Les définitions manquantes, non valides ou en double ne chargent pas les ressources ni ne s'exécutent. Ils ne restituent rien à moins que l'état d'échec générique traduit du bloc ne soit activé. |
navigation-auto — Navigation automatique
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | Aucune copie de page ; menu de navigation CMS sélectionné. |
| Paramètres et variantes | menu_key à partir d’emplacements de menu connus. Les touches de pied de page/légales affichent des liens empilés ; primaire/par défaut restitue les liens groupés de type bouton. |
| Enfants/médias | Enregistrements de navigation, ne bloquent pas les enfants. |
| HTML | Wrapper générique plus arborescence sémantique <nav> et <ul>. |
| Exemple d'apparence | Menu de navigation de compatibilité dans un emplacement. |
| Recommandation | Préférez Navbar Navigation pour les nouveaux en-têtes partagés. |
| Lacune du registre des contrats | Ce handle publié a un formulaire d'administration et un moteur de rendu, mais aucune entrée dans BlockTypeContractRegistry au niveau de la ligne de base de l'audit. Ne déduisez pas un contrat d'API en direct complet jusqu'à ce que la découverte le confirme. |
toc — Table des matières
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | Titre partagé facultatif. |
| Paramètres et variantes | Aucun. |
| Enfants/médias | Lit les blocs d'en-tête publiés dans le même emplacement avec des ancres valides et des variantes H2/H3, dans l'ordre du document. |
| HTML | Wrapper générique avec une liste de liens nav.wb-section-nav générée - une primitive WebBlocks UI autonome, pas wb-link-list. |
| Comportement en direct | La mise en surbrillance de la position de défilement est fournie gratuitement par le module WBSectionNav fourni dans le même webblocks-ui.js que la mise en page publique est déjà chargée ; le moteur de rendu ne possède pas de JavaScript propre. |
| Exemple d'apparence | Liste « Contenu » pour une longue page de documentation. |
| Garde de rendu | N'émet rien lorsqu'il n'existe aucune rubrique éligible. |
breadcrumb — Fil d'Ariane
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | home_label partagé ; le titre de la page actuelle provient de la page. |
| Paramètres et variantes | include_current: boolean. |
| Enfants/médias | Utilise le contexte de page/site/locale. |
| HTML | Emballage générique plus <nav class="wb-breadcrumb"><ol class="wb-breadcrumb-list">…</ol></nav>. |
| Exemple d'apparence | Accueil / Catégorie / Page actuelle. |
header-actions — Actions d'en-tête
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | Aucune copie. |
| Paramètres et variantes | Booléens show_search, show_mode_toggle, show_accent_toggle, show_language_switcher. Les contrôles publics de préréglage/accent sont actuellement supprimés par le modèle de thème public au niveau du site. |
| Enfants/médias | Aucun. |
| HTML | Wrapper générique et contrôles d'icônes compacts .wb-topbar-actions. |
| Exemple d'apparence | Actions de recherche et de mode clair/sombre/auto sur le côté droit d’une barre de navigation. |
| Éviter | CTA commerciaux. |
sticky-navbar — Barre de navigation
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | Pas de copie directe ; layout_name en option pour l'éditeur uniquement. |
| Paramètres et variantes | sticky_mode: sticky/default, static, fixed. |
| Enfants/médias | Enfants autorisés : conteneur, cluster, en-tête, plain_text, texte enrichi, button_link, marque de barre de navigation, navigation dans la barre de navigation, actions d'en-tête, formulaire de recherche. Au moins un enfant requis par les plans API. |
| HTML | <nav class="wb-navbar …" data-wb-public-block-type="sticky-navbar">…</nav> propriétaire de la racine. |
| Exemple d'apparence | En-tête partagé : Barre de navigation → Conteneur → Cluster (entre) → Marque + navigation/actions. |
| Éviter | Un deuxième shell d'en-tête personnalisé. |
navbar-brand — Marque de la barre de navigation
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | translations.title, translations.subtitle ; URL partagée, cible, étiquette aria. |
| Paramètres et variantes | url ; target: _self or _blank; aria_label. |
| Enfants/médias | Image facultative media_id pour le logo. |
| HTML | Wrapper générique plus <a class="wb-navbar-brand"> avec image et copie d'identité en option. |
| Exemple d'apparence | Logo, nom du site et slogan concis. |
navbar-navigation — Navigation dans la barre de navigation
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | Titre partagé en tant que label ARIA ; menu de navigation sélectionné. |
| Paramètres et variantes | menu_key ; active_indicator: underline, pill, dot, background, none; active_matching: path, section, current-page, exact, off. |
| Enfants/médias | Arborescence des éléments de navigation CMS. |
| HTML | Wrapper générique plus bureau .wb-navbar-links, liste déroulante mobile WebBlocks UI, classes actives et listes déroulantes de groupe. |
| Exemple d'apparence | Navigation principale réactive avec menu burger automatique. |
sidebar-brand — Marque de la barre latérale
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | translations.title, translations.subtitle ; URL partagée, cible, étiquette aria. |
| Paramètres et variantes | Même contrat de liaison sécurisée que Navbar Brand. |
| Enfants/médias | Image facultative media_id pour le logo. |
| HTML | Emballage générique plus <a class="wb-sidebar-brand"> avec logo et copie d'identité. |
| Exemple d'apparence | Logo/titre de la documentation en haut d'une barre latérale. |
sidebar-navigation — Navigation dans la barre latérale
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | translations.title comme étiquette ARIA ; layout_name en option pour l'éditeur uniquement. |
| Paramètres et variantes | menu_key en option ; show_icons: boolean; active_matching: path, current-page, exact. |
| Enfants/médias | Soit les enregistrements de navigation CMS, soit le manuel sidebar-nav-item / sidebar-nav-group ; au moins un enfant est requis dans les plans d'API manuels. |
| HTML | Wrapper générique plus structures de barre latérale <nav class="wb-sidebar-nav"> et WebBlocks UI. |
| Exemple d'apparence | Barre latérale de documentation avec indication de section active. |
sidebar-nav-item — Élément de navigation dans la barre latérale
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | translations.title requis ; URL et cible partagées. |
| Paramètres et variantes | icon du catalogue ; active_mode: exact, path, current-page, manual; manual_active: boolean. |
| Enfants/médias | Aucun; prévu sous Navigation dans la barre latérale ou Groupe de navigation dans la barre latérale. |
| HTML | <a class="wb-sidebar-link"> or nested .wb-nav-group-item, with optional icon and active state. |
| Exemple d'apparence | Lien de documentation manuelle. |
sidebar-nav-group — Groupe de navigation dans la barre latérale
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | translations.title requis ; layout_name en option pour l'éditeur uniquement. |
| Paramètres et variantes | icon ; initially_open: boolean. |
| Enfants/médias | Uniquement sidebar-nav-item. |
| HTML | .wb-nav-group with button toggle, arrow, icon, and .wb-nav-group-items. |
| Exemple d'apparence | Groupe « Guides » pliable dans une barre latérale de documents. |
search-form — Formulaire de recherche
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | Étiquette translations.title, espace réservé translations.content, étiquette de soumission translations.subtitle. |
| Paramètres et variantes | settings.variant: primary or secondary; show_button: boolean. |
| Enfants/médias | Aucun; nécessite un itinéraire de recherche de site résoluble. |
| HTML | Wrapper générique plus <form role="search" class="wb-cluster …">, entrée native et bouton WebBlocks en option. |
| Exemple d'apparence | Champ de recherche du site dans un en-tête ou une page. |
sidebar-footer — Pied de page de la barre latérale
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | Note de bas de page translations.title, translations.content, translations.subtitle. |
| Paramètres et variantes | settings.variant: info, success, warning, danger. |
| Enfants/médias | Aucun. |
| HTML | Wrapper générique plus .wb-sidebar-footer, .wb-callout tonique et note muette facultative. |
| Exemple d'apparence | Petite notice de documentation ou note de version. |
Blocs de motif, de forme et d'engagement
alert — Alerte
| Domaine du contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | translations.title, requis translations.content. |
| Paramètres et variantes | settings.variant: info, success, warning, danger. |
| Enfants/médias | Aucun. |
| HTML | Wrapper générique plus <div class="wb-alert wb-alert-{tone}"> et titre facultatif. |
| Exemple d'apparence | Avertissement en ligne, note de réussite ou message d'information. |
| Éviter | Promotions marketing. |
contact_form — Formulaire de contact
| Zone de contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | title, content, submit_label, success_message, consent_label appartenant aux paramètres régionaux. |
| Paramètres et variantes | recipient_email ; send_email_notification ; store_submissions reste la propriété du produit dans le contrat natif ; consent_required (booléen, faux par défaut). |
| Consentement | Définissez consent_required et attribuez aux paramètres régionaux un consent_label pour afficher une case à cocher de consentement requis. Le libellé est traduit parce qu’il s’agit de l’avis. Une soumission acceptée stocke consent_accepted_at ainsi qu'une copie du texte, donc la modification ultérieure du bloc ne peut pas changer ce qu'un ancien visiteur est enregistré comme ayant accepté. Un consentement requis sans formulation pour les paramètres régionaux résolus n'affiche aucune case à cocher plutôt qu'une case sans étiquette. consent_required est fermé au PATCH : la suppression d'une mention légale d'un formulaire en direct est une décision de l'opérateur. |
| Politique de notification du site | Les formulaires de contact et les plugins participants partagent Site.notification_settings, lus via GET /webadmin/api/sites/{site}/notifications (content.read) et modifiés via PATCH (site-settings.write, à l'échelle du site). Champs : notification_mode (full, alert_only), notification_frequency (immediate, batched, daily), batch_minutes (1–60), daily_summary (booléen), summary_hour (0 à 23 dans le fuseau horaire du site). Les champs PATCH omis sont conservés ; les valeurs invalides, nulles et inconnues sont rejetées. Ce sont les paramètres du site, ne bloquez jamais les champs PATCH. |
| Confidentialité des notifications | alert_only contient uniquement une copie de site de confiance, des décomptes et des liens de boîte de réception CMS authentifiés normaux. Aucun nom/adresse du visiteur, sujet/corps, adresse IP, informations du navigateur, URL source/référent, réponse du visiteur, en-têtes ou pièces jointes personnalisés. Les mailables minimaux séparés ne reçoivent jamais de modèles de visiteurs. full conserve les notifications détaillées, y compris les lots détaillés. Les résumés quotidiens contiennent toujours des décomptes et des liens protégés, y compris lorsque le mode de contenu sélectionné est full. Les plugins ne peuvent pas remplacer le mode de confidentialité du site. |
| Délai de notification | Les nouveaux sites sont par défaut alert_only, batched, dix minutes, un résumé daily activé à 09h00. Les migrations de mise à niveau préservent le comportement complet/immédiat existant avec les résumés désactivés. Le courrier de contact par lots envoie immédiatement la première alerte, puis combine les messages suivants par site/canal/destinataire. Des lots de chat en direct par conversation afin que chaque conversation reçoive immédiatement sa première alerte hors ligne. daily envoie un résumé combiné par site/destinataire/jour ; avec daily_summary activé, le travail en attente existant est rappelé à daily. Les messages de contact lus restent en attente de réponse jusqu'à ce qu'ils soient répondus/archivés ; Les messages spam/mis en quarantaine/archivés et désinscrits sont exclus. |
| Livraison et extension du plugin | webblocks:notifications:dispatch is registered every minute with the Laravel scheduler; les hôtes doivent l'exécuter et utiliser un cache partagé prenant en charge les verrous atomiques lors de l'exécution de plusieurs nœuds de calcul. L'inscription stocke uniquement les identifiants et le statut du site/canal/source, avec des clés source uniques ; la politique est relue avant la livraison. Les échecs sont génériques et ne sont jamais réessayés automatiquement. Les tentatives interrompues échouent après 15 minutes. Les événements de terminal et l’état de répartition inactif sont supprimés après 30 jours. GET expose les résultats des messages à l'échelle du site et les derniers résultats de résumé quotidien ; le panneau Paramètres du site et les boîtes de réception existantes affichent l'état de livraison. Les plugins activés enregistrent un adaptateur SiteNotificationChannel via SiteNotificationChannels avec son identifiant de plugin, possédant les sources, les destinataires, l'éligibilité, le courrier détaillé et les décomptes en attente au niveau du site ; les plugins désactivés ne sont pas distribués. |
| Notifications du panneau | Depuis CMS 1.96.0, l’en-tête d’administration partagé renvoie au panneau de notifications du Dashboard avec l’action WebBlocks UI wb-btn wb-btn-ghost wb-btn-icon et le compteur wb-btn-badge. Les nombres visibles sont plafonnés à 99+ ; le libellé accessible conserve le nombre exact. Les responsables des opérations voient les totaux de messages non lus (new) et en attente de réponse (new + read) des sites accessibles, ainsi qu’un avertissement si un site accessible exige des courriels planifiés et que l’état enregistré est non vérifié, retardé, en échec ou indisponible. Depuis CMS 1.97.0, le badge compte uniquement les messages non lus ; les messages lus en attente de réponse et les avertissements de planificateur/schéma restent des états distincts du Dashboard sans contribuer au badge. Sans message non lu, la cloche reste visible sans nombre. La cellule Actions de la ligne du site utilise l’icône standard d’affichage WebBlocks UI avec une infobulle traduite et un libellé accessible expliquant l’ouverture des messages en attente de réponse. Le travail enregistré est visible indépendamment du consentement au courrier, des destinataires, du résultat de livraison ou des preuves du planificateur. Aucun nom, adresse, objet, contenu ou IP de visiteur ne figure dans le résumé. Les lectures n’envoient aucun courrier, ne consomment aucun événement, ne marquent rien comme lu et n’établissent pas la santé du planificateur. Les nombres sont actualisés à chaque chargement d’une page du panneau ; il s’agit de l’état partagé actuel de la boîte, pas d’un historique individuel ni d’une interrogation automatique. Les liens utilisent GET /webadmin/contact-messages?site={id} ; le sélecteur de site est validé et conservé dans les URL sûres de retour à la boîte. Les messages répondus, archivés, indésirables et en quarantaine sont exclus ; l’absence de schéma affiche un avertissement de migration plutôt qu’une boîte vide. Live Chat conserve son indicateur distinct de panneau du plugin, limité par permissions et site, qui fonctionne aussi sans courriels planifiés. |
| État et conditions préalables du planificateur | CMS 1.95.1 enregistre dans la base du CMS un rappel réellement planifié chaque minute, séparément des démarrages/fins/échecs de la commande de notifications. Le champ required dérivé de la politique du site vaut true pour la livraison groupée/quotidienne ou les résumés quotidiens. Depuis CMS 1.95.2, le Dashboard présente un seul avis de santé avec des liens vers tous les sites accessibles aux responsables des opérations, y compris les anciens sites à livraison immédiate uniquement. La gravité dépend de l’existence d’un site accessible nécessitant des notifications planifiées ; les sites inaccessibles n’interviennent pas. Les politiques immédiates sans résumé quotidien conservent une carte informative expliquant que la planification est facultative pour ces notifications ; les paramètres et l’API GET des notifications du site affichent scheduler_health avec les états global/planificateur/processus et les horodatages UTC. L’absence de preuves reste unverified ; les preuves de plus de 300 secondes sont delayed ; les erreurs de traitement et le schéma indisponible sont explicites ; une exécution actuelle inachevée peut être running. L’envoi manuel et les lectures de santé ne créent pas de signal de présence du planificateur. La commande en lecture seule webblocks:scheduler:status --json réussit uniquement pour un état sain vérifié. L’exécution du planificateur ne garantit ni la livraison SMTP/en boîte ni la santé de chaque nœud. L’installateur et l’avis de configuration invité expliquent le courrier fonctionnel, APP_URL canonique, un planificateur géré par le serveur chaque minute et un cache partagé à verrous atomiques pour plusieurs processus ; le CMS n’installe jamais cron. Les plugins de notifications activés peuvent utiliser le même service SchedulerHealth dans leurs paramètres et contrôles de santé. |
| Enfants/médias | Aucun. |
| HTML | Wrapper générique autour de section.wb-card natif, formulaire protégé par CSRF, champ anti-spam généré par le moteur de rendu, entrées WebBlocks, zone de texte, case à cocher de consentement facultative, erreurs de validation et bouton d'envoi. |
| Exemple d'apparence | Formulaire de contact entièrement géré stocké dans les messages de contact avec notification facultative. |
| Éviter | Formulaire brut HTML, champs de pot de miel personnalisés ou remplacement mailto:. |
rating — Notation
| Zone de contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | Le titre et le texte d’accompagnement facultatifs par langue (title, subtitle) utilisent les traductions de texte. L’ancien settings.title reste une valeur de repli ; le produit traduit les libellés habituels. |
| Paramètres et variantes | scale: fixed 5; allow_change: boolean; show_summary: boolean; data_scope (CMS 1.97.0): block (par défaut, conserve des zones de retour distinctes) ou page (même site/page enregistré, survit au remplacement du bloc). L’éditeur et le PATCH du bloc prennent en charge la portée. |
| Enfants/médias | utilise content_ratings ; pas d'enfants. |
| HTML | <section class="wb-card"> propriétaire de la racine avec H3 en option, .wb-rating-stars partiellement rempli, résumé et boutons de soumission .wb-rating-input sans JS. |
| Exemple d'apparence | Évaluation des pages cinq étoiles avec moyenne et nombre de réponses. |
| Remarque | Seuls les votes actifs sur 5 points entrent dans le résumé public. La portée de page conserve le hash de session lors du remplacement du bloc, sérialise les écritures sous un verrou de page et reconnaît les hash de bloc conservés pour la session actuelle. Les anciens hash orphelins ne peuvent être associés ni dédupliqués automatiquement ; les lignes existantes restent inchangées jusqu’à la mise à jour d’un vote reconnu. Le formulaire indique le vote actuel avec aria-pressed et désactive les saisies répétées lorsque allow_change vaut false ; le serveur l’impose aussi. GET ne crée pas d’identifiant de visiteur. |
comments — Commentaires
| Zone de contrat | Comportement basé sur la source |
|---|---|
| Contenu modifiable | Aucune copie de visiteur créée en bloc ; les traductions de produits fournissent des étiquettes et des messages. |
| Paramètres et variantes | form_enabled, show_approved, show_author_name; sort_order: newest or oldest; data_scope (CMS 1.97.0): block (par défaut) ou page. La portée de page inclut les enregistrements approuvés du même site/page enregistré, même si leur bloc d’origine a été supprimé ; les pages et sites voisins restent exclus. |
| Enfants/médias | Utilise comment_entries modéré ; pas d'enfants. |
| HTML | Racine propre <section class="wb-card wb-public-comments"> avec régions Comments/liste et Leave a comment/formulaire libellées séparément (CMS 1.97.1), titres traduits par le produit et badge du nombre approuvé. Auteur/date partagent une ligne de métadonnées avec retour à la ligne ; le texte multiligne échappé utilise des espacements compacts. Le formulaire a une surface discrète adaptée au thème, une zone de texte de trois lignes et un champ de nom compact qui s’élargit sur téléphone. Il conserve la pagination par 25 entrées (comments_page_{block_id}, avec conservation du fragment et de la requête), la protection CSRF native, les champs antispam, la validation ciblée et l’action d’envoi. Les visibilités de la liste et du formulaire restent indépendantes. |
| Exemple d'apparence | Commentaires modérés sous un article ou un guide produit. |
| Éviter | Stockage de commentaires personnalisés ou balisage de formulaire brut. |
Bloc avancé réservé aux humains
html — HTML (de confiance)
| Domaine du contrat | Comportement basé sur la source et politique cible |
|---|---|
| Objectif | Examen de la trappe d'évacuation humaine pour un balisage fiable qui n'a pas encore de contrat de produit structuré. |
| Contenu modifiable par l'administrateur | Contenu HTML de confiance. Le registre de traduction actuel le traite comme un contenu de famille de texte. |
| Paramètres et variantes | Aucun. Les fragments de superposition/extrémité de corps reconnus peuvent être extraits vers des registres de packages. |
| Enfants/médias | Pas d'enfants. |
| HTML | Wrapper générique plus un <div> interne simple contenant un balisage fiable ; les fragments extraits peuvent être rendus en dehors de la racine visible. |
| Création d'API | Interdit. Aucune création, mise à jour, remplacement, mutation de topologie, mutation destructrice, mutation par étapes ou mutation de publication. |
| Comportement de l'IA | Signalez une lacune de capacité et proposez un bloc/une variante/un moteur de rendu structuré. Ne générez jamais de charge utile HTML inscriptible. |
Poignées héritées et du moteur de rendu uniquement
Ne traitez pas un Blade partiel comme une preuve qu'un handle est disponible pour le nouveau contenu de l'API. La source actuelle contient des moteurs de rendu de compatibilité et des brouillons de lignes qui ne sont pas des contrats de création principaux publiés.
Les lignes du catalogue brouillon incluent :
text
card-grid
tabs
menu
faq-list
showcase-list
contact-info
Renderer uniquement, les alias, les partiels ou les descripteurs de compatibilité incluent des exemples tels que :
accordion
faq
button
callout
list
map
metric-card
stats
testimonial
gallery-viewer
sidebar-nav-item-link
sidebar-navigation-menu-item
fallback
missing-renderer
Règles :
- Ne les créez jamais simplement parce qu'un fichier de rendu existe.
- Utilisez-les uniquement si le catalogue de blocs authentifié en direct indique le descripteur exact tel que publié et utilisable pour l'installation actuelle.
- Préférez les blocs structurés canoniques documentés ci-dessus.
- Les partiels internes tels que la visionneuse de galerie et les moteurs de rendu de liens de la barre latérale ne sont jamais des types de blocs de plan de contenu.
Recettes de composition visuelle
Ce sont des arborescences de blocs gérées, et non des modèles fixes. Confirmez toutes les poignées au moment de l'exécution.
Partez de la recette la moins encadrée qui satisfait au contenu. Ne répétez pas la même recette dans des bandes de pages adjacentes et ne sélectionnez pas la recette de la carte de fonctionnalité simplement parce que la source contient trois éléments courts.
Introduction éditoriale avec médias de premier plan
section(spacing:lg)
└── container(width:xl)
└── hero(layout:split, foreground media)
├── button_link(primary)
└── button_link(secondary)
Utilisez une image grande et significative et un style de surface sobre. Choisissez layout:full-bleed lorsque l’image doit devenir une bande d’ouverture non encadrée à l’échelle de la fenêtre ; conserver split lorsque l'image est un contenu sémantique de premier plan.
Principes ou avantages non définis
section(spacing:lg)
└── container(width:xl)
└── columns(variant:plain)
├── column_item
├── column_item
└── column_item
C'est le point de départ normal pour des qualités telles que l'expérience, la communication, l'attention, la rapidité ou la fiabilité. Promouvez-le en cartes uniquement lorsque les éléments peuvent être actionnés indépendamment ou limités.
Introduction de la page marketing avec des actions distinctes
section(background optional)
└── container(width:lg)
├── hero(variant:accent, layout:centered)
└── cluster(alignment:center, gap:sm)
├── button_link(primary)
└── button_link(secondary)
Utilisez cette option uniquement lorsque la ligne d'action doit se trouver en dehors de la racine de la promotion Hero. Hero lui-même accepte les enfants Button Link dans chaque mise en page, y compris le fractionnement ; conserver les actions à l'intérieur de Hero lorsque telle est la composition prévue.
Grille de carte d'entité délimitée
section(spacing:lg)
└── container(width:lg)
├── header(h2)
└── grid(columns:3, gap:4)
├── card
│ └── card_body
│ ├── header(h3)
│ ├── plain_text
│ └── button_link
├── card
└── card
Chaque titre, paragraphe et action reste modifiable indépendamment. Réservez cette recette aux entités limitées telles que les produits, les plugins, les plans, les téléchargements ou les services avec leurs propres actions. Utilisez le site CSS pour un skin de carte cohérent spécifique au site via des crochets stables ; ne pas injecter la carte HTML.
Alternance de lignes d'image et de copie
section
└── container
├── grid(columns:2, alternate_media_text_sections:true, alternate_start:media_left)
│ ├── image
│ └── card or content stack
└── grid(columns:2, alternate_media_text_sections:true)
├── image
└── card or content stack
Utiliser l'image pour les médias de premier plan. Utilisez un bloc compatible avec l'arrière-plan uniquement lorsque l'image est sémantiquement un arrière-plan.
Barre de navigation réactive partagée
sticky-navbar(sticky)
└── container(width:lg)
└── cluster(alignment:between, width:full)
├── navbar-brand
└── cluster
├── navbar-navigation
└── header-actions
Les étiquettes et URL de navigation appartiennent aux enregistrements de navigation CMS et non à HTML.
Curseur d'image géré
slider(height:viewport, autoplay:false, show_arrows:true, show_dots:true)
├── slide(background media)
│ └── container
│ ├── header
│ ├── plain_text
│ └── button_link
└── slide(background media)
└── container
└── card
└── card_body
└── rich-text
Flux de travail de conception vers CMS
Avant d'appliquer une conception visuelle, produisez un tableau de mappage :
| Région de conception | Propriétaire du contenu | Arbre de bloc | Variante/paramètres | Crochets stables CSS | Statut de capacité |
|---|---|---|---|---|---|
| Exemple de héros | Traductions de pages et médiathèque | Section → Conteneur → Héros | accent, centré, média d'arrière-plan | [data-wb-public-block-type="hero"], .wb-promo | Pris en charge uniquement si la promotion multimédia en arrière-plan correspond au design |
Pour chaque région :
- Identifiez chaque élément modifiable de copie, média, action, badge, données de navigation et enregistrement dynamique.
- Mappez chaque élément sur un champ natif modifiable par l’administrateur.
- Confirmez les règles parent/enfant et le moteur de rendu HTML.
- Confirmez que la composition visuelle est possible avec le DOM documenté.
- Utilisez le site CSS uniquement pour la présentation que le DOM stable peut prendre en charge.
- Si un champ sémantique, un wrapper, un emplacement ou une variante est manquant, marquez la région comme non prise en charge.
- Proposez la plus petite fonctionnalité de CMS ou de plugin réutilisable : une variante de moteur de rendu, un nouveau bloc structuré, un modèle composé de blocs existants ou un bloc de domaine tel qu'une collection de produits Commerce.
- N'appliquez pas de substitut sciemment basse fidélité à moins que l'utilisateur n'approuve explicitement ce compromis.
Format du rapport sur les écarts de capacités :
Region: Storefront hero
Required editable content: title, body, two actions, foreground product image, offer badge, trust items
Current closest block: hero
Supported: title, eyebrow, body, background image, promo tone
Missing: foreground media slot, split DOM, trust-item collection, discoverable managed action child
Why CSS is insufficient: required semantic wrappers and editable fields do not exist
Recommended product change: add a reusable split/storefront Hero variant and structured trust-item children
HTML fallback: prohibited
CSS Conseils
Utilisez les calques de style dans cet ordre :
- Primitives WebBlocks UI déjà émises par le moteur de rendu.
- Jetons de thème public et rôles de couleur publics sensibles au mode.
- Paramètres et variantes de blocs natifs.
- Étroit le CSS spécifique au site à l'aide de crochets stables.
- Un moteur de rendu réutilisable ou un changement de contrat de bloc lorsque le DOM requis est manquant.
Les sélecteurs stables incluent :
body[data-wb-public-theme] {}
[data-wb-public-block-type="hero"] {}
[data-wb-public-block-type="card"] {}
.wb-promo {}
.wb-card {}
.wb-content-header {}
Ne pas utiliser le site CSS pour :
- insérer un texte essentiel avec des pseudo-éléments ;
- dépend des ID de bloc générés ;
- inférer la sémantique de l'ordre frère ;
- masquer le contenu créé par CMS simplement pour le remplacer par le contenu CSS ;
- reconstruire une mise en page manquante avec un positionnement absolu fragile ;
- code en dur les couleurs claires uniquement qui interrompent le mode clair/foncé/auto.
Écarts de source connus au niveau de référence de l'audit
Il s’agit de résultats de mise en œuvre, et non d’autorisations d’inventer un comportement :
- Résolu : cet inventaire est désormais livré sous le nom
resources/contracts/inventory.mdet est servi aux outils parGET /webadmin/api/inventory. webblocks-cms-docs/docs/block-type-contracts.mdindique 42 types de base publiés, alors que le catalogue actuel en définit 51.- Plusieurs documents existants affichent toujours les chemins de rendu réservés aux pré-packages sous
packages/webblocks-cms/...; les chemins d’accès actuels aux packages commencent àresources/views/.... - Résolu : Le HTML de confiance n'est plus accessible en écriture via l'API.
BlockTypeApiAuthoringPolicybloque tous les chemins de mutation d'API, y compris la normalisation générique, le PATCH de bloc existant et les opérations de réorganisation, de suppression de sous-arbre, d'effacement complet et de publication de Shared Slot. - Résolu : Hero et CTA sont de simples conteneurs pour les enfants
button_linkdans l'administrateur et l'API. Les champsprimary_cta/secondary_ctasurvivent sous la forme d'un raccourci à deux boutons. L'ancienne ligne de cataloguebuttonnon publiée n'est plus un bloqueur de création. - Résolu : l'éditeur d'éléments de colonne expose désormais le champ de sous-titre que la variante Colonnes
statsrestitue en tant que valeur statistique. - L'audio dispose d'un sélecteur de média d'administration normal et d'un moteur de rendu de média public, mais la liste d'autorisation de média direct du plan de contenu omet l'audio.
- Résolu : la normalisation des icônes a un seul propriétaire.
InternalContentApiOperationscontient la liste canoniquePUBLIC_ICON_BLOCK_TYPESainsi que les normalisateurs de slug/ton partagés, et le plan de contenu complet leur délègue, de sorte que les plans et les points de terminaison de bloc incrémentiels valident les icônes de la même manière. - Les paramètres de bloc API ne sont pas encore régis par un schéma de paramètres lisible par machine par bloc. Les paramètres inconnus peuvent survivre à la normalisation même lorsqu'aucun moteur de rendu ou champ d'administration ne les utilise.
- Résolu :
navigation-autodispose désormais d'un contrat documenté dansBlockTypeContractRegistryet peut être découvert via des types de blocs et un contrat de contenu. - WebBlocks UI est livré avec une anatomie
wb-footer-*(wb-footer-grid,wb-footer-brand,wb-footer-nav,wb-footer-link,wb-footer-list,wb-footer-item,wb-footer-copy,wb-footer-meta,wb-footer-text,wb-footer-logo) qu’aucun moteur de rendu CMS n’émet. Un pied de page à emplacement partagé compose à la place deswb-section/wb-container/wb-grid/wb-stack/wb-clustergénériques, de sorte que le modèle n'est accessible qu'à partir de mises en page écrites à la main. Le cosmétique depuis la version 1.50.0 a donné à.wb-slot-footersa propre surface ; un bloc de composition de pied de page reste délibérément différé plutôt qu'en attente. - Résolu :
GET /content-contractdérive sa sectionmedia_libraryde la table de routage enregistrée, de sorte quesupported_operationsetunsupported_operationsne peuvent pas dériver de ce queopenapi.jsonpublie. Le téléchargement, la récupération à distance, la suppression, le remplacement et le déplacement sont publiés comme pris en charge avec la capacité appliquée par chaque itinéraire. - Résolu : le consentement a une moitié destinée aux visiteurs. La bascule de la bannière Paramètres système affiche le modèle de consentement aux cookies de WebBlocks UI sur les pages publiques et le connecte au point de terminaison
POST /privacy-consent/syncexistant, etcontact_forma obtenusettings.consent_requiredplus unconsent_labeltraduit enregistré sur chaque soumission. - Le référentiel contient des captures d'écran de tableau de bord et de gestion de pages, mais pas de galerie de luminaires visuels canoniques par bloc/par variante. Les descriptions « Exemple d'apparence » dans cet inventaire sont donc des références dorées dérivées de la source et non des références basées sur des captures d'écran. En attendant que cette galerie existe, préférez les compositions neutres documentées et évitez de revendiquer la fidélité visuelle à partir de la seule prose.
- Résolu pour la planification :
GET /content-contractpublie désormais un contrat de direction de conception lisible par machine couvrant le caractère, la densité, la typographie, la géométrie, les images, les coins, le contraste, les rôles de rythme, la politique des cartes et les lacunes de composition connues. Il ne conserve délibérément pas d'enregistrement de style caché ; Les outils d'IA indiquent la direction dans leur plan/rapport et la mettent en œuvre via des choix de blocs pris en charge, des jetons de thème et le site stable CSS.
Examen des stocks et contrôles de fraîcheur
Le produit est propriétaire de ce contrat d'exécution. Le référentiel de documentation conserve un instantané de version généré avec une identité source distincte ; les modifications commencent dans le contrat de produit.
À partir de CMS 1.94.3, composer test:inventory et composer test:docs valident resources/contracts/inventory-review.json par rapport au contrat actuel et aux empreintes digitales de la source d'exécution. Les fichiers d'exécution modifiés, ajoutés ou supprimés et les modifications de version du produit nécessitent un nouvel examen explicite. CI et pre-push exécutent la même vérification ; la préparation de la version vérifie l'arborescence de travail et le générateur d'artefacts vérifie l'arborescence Git sélectionnée.
Après avoir examiné les champs, les énumérations, les enfants, les médias, le rendu, le comportement de l'éditeur, les autorisations et le cycle de vie du plug-in pris en charge, mettez à jour cette prose et enregistrez la révision avec composer inventory:review -- --reviewed --note="review summary". Un contrat inchangé après un changement de source n'est accepté qu'avec une explication explicite --no-authoring-impact="reason". Les enregistrements de révision ne doivent jamais être actualisés automatiquement par les scripts de CI ou de version.
L'enregistrement mécanique capture le catalogue principal publié, les règles enfants, la propriété de la racine du moteur de rendu, la stratégie d'écriture de l'API et la prise en charge des médias mobiles par les assistants de produit réels. PHPUnit compare cet enregistrement avec les assistants actuels, et la vérification des sources nécessite un en-tête d'inventaire unique pour chaque bloc principal publié. Les empreintes digitales et les comparaisons mécaniques renforcent l'examen et la cohérence structurelle ; ils ne prouvent pas le sens de chaque phrase. Les explications en prose et sans impact restent sous la responsabilité du contributeur et du réviseur.
Le tools/inventory-snapshot.php du référentiel de documentation régénère l'instantané et sa provenance inventory-source.json. Ses vérifications rejettent les modifications manuelles d'instantanés et comparent la version du produit, l'empreinte source, la somme de contrôle de révision et le contenu du document par rapport à une extraction de produit sélectionné. Des contrôles de documentation isolés vérifient la provenance enregistrée sans nécessiter le produit au moment de l'exécution. La génération d'instantanés et la publication CMS restent des opérations distinctes.
Références détaillées associées
webblocks-cms-docs/docs/ai-page-building-guide.mdwebblocks-cms-docs/docs/internal-content-api.mdwebblocks-cms-docs/docs/api-discovery.mdwebblocks-cms-docs/docs/block-type-contracts.mdwebblocks-cms-docs/docs/public-block-render-markup.mdwebblocks-cms-docs/docs/block-ui-renderer-contract.mdwebblocks-cms-docs/docs/public-theme-and-tones.mdwebblocks-cms-docs/docs/public-assets.mdwebblocks-cms-docs/docs/media-image-variants.md
Cet inventaire devrait être le premier document qu'une IA lit pour la sélection des capacités de conception de page. Les références détaillées restent utiles pour les flux de travail des points de terminaison, la compatibilité historique et les notes complètes du moteur de rendu.
Contrat de démarrage et de récupération du plugin
L'installation du catalogue et du ZIP, les mises à jour et l'activation du panneau/API valident la source du plugin,
démarrage, commandes et itinéraires du fournisseur dans un nouveau processus PHP via cms:plugin-probe.
La validation est requise même lorsqu'aucune migration n'est en attente. Une sonde ayant échoué ou expiré
laisse le package actuel actif ; les diagnostics des sous-processus ne sont pas exposés dans les réponses.
Le délai d'expiration de démarrage par défaut est de 30 secondes (webblocks-plugins.install.boot_timeout_seconds).
Les mises à jour réussies conservent le package précédent et enregistrent si les migrations ont été exécutées. Les échecs de configuration de la base de données laissent le plugin désactivé et préservent ses tables et packages. Les échecs de source/route d’exécution mettent le plugin en quarantaine ; une désactivation explicite remplace activation basée sur la configuration. Les enregistrements JSON du cycle de vie utilisent le remplacement atomique.
/webadmin/plugin-recovery et son formulaire de connexion se chargent sans source de plugin installée,
itinéraires ou commandes. Contrôles de connexion CMS existants, accès administrateur actif, autorisation Super admin et CSRF
protection s'appliquent. La récupération peut désactiver un plugin ou restaurer le package conservé lorsque
aucune migration n'a été exécutée, après une autre sonde de démarrage. Une restauration republie également ses actifs.
Il s'agit d'une récupération pour les packages gérés par le CMS ; il n'isole pas les fournisseurs d'hébergement arbitraires
ou l'exécutable sandbox PHP. La terminaison d'un processus incapable nécessite toujours le
demande de récupération plutôt qu'un gestionnaire d'erreurs en cours de processus.
Autorisation de lecture de l’état du système
GET /webadmin/api/system/health nécessite la capacité à activer explicitement system-health.read et un jeton système valable pour toute l’installation (allowed_site_ids: null), appartenant à un opérateur actif disposant de access-system. Les identifiants personnels et limités à des sites ne peuvent pas lire l’état de l’installation. Le paramètre facultatif et validé site_id filtre les vérifications des sites tout en conservant visibles celles de toute l’installation.
Le point d’accès renvoie des clés et paramètres de messages sûrs, des problèmes ordonnés, les états des catégories (healthy, warning, critical, unknown, not_applicable), des résumés de sites, des informations système et les résultats récents d’opérations. Les observations sur les sites, sauvegardes, stockage, plugins, préparation aux mises à jour et historique sont mises en cache pendant cinq minutes ; les preuves du planificateur sont lues à chaque requête. Les vérifications inconnues et facultatives restent distinctes des vérifications réussies. Lire ou actualiser l’état ne modifie pas le contenu, ne rapproche pas les enregistrements de sauvegardes, n’envoie pas de courrier, n’exécute ni nettoyage ni mise à jour, ne récupère pas de métadonnées de versions et ne génère pas de preuve du planificateur. Les composants de rapport des plugins conservent leur contrat existant de rapport d’état ; les messages bruts et les détails d’exceptions sont exclus de cette vue.
Les routes opérationnelles existantes restent disponibles. Les destinations Aide des plugins rejoignent Système et celles de Maintenance sont regroupées par la clé stable du groupe de maintenance ; l’entrée Aide principale renvoie directement à la documentation. L’état constitue une preuve à examiner, et non une autorisation de publier du contenu, restaurer une sauvegarde ou mettre à jour un hôte. Les vérifications de recherche comparent les périmètres admissibles de pages publiées et de langues aux lignes de l’index ; elles ne prouvent pas l’actualité du texte. La disponibilité des sauvegardes ne prouve pas l’intégrité de la restauration. La préparation à la mise à jour reste distincte du fonctionnement normal du site.