Fait avec Chinaski

Grille de fonctionnalités

Le block feature_grid affiche un ensemble d'éléments "feature" répétés, chacun avec une icône facultative, un titre et un corps de texte. Utilisez-le pour les sections "why choose us", les mises en avant de fonctionnalités produit, ou toute liste d'arguments courts disposés côte à côte.

Champs

Champ Description Requis ?
heading Titre de la section affiché au-dessus de la grille. Exemple de placeholder : "Why choose us". Non
icon_url (par feature) URL d'une image servant d'icône à cette feature. Non
icon (par feature) Emoji ou texte SVG en ligne utilisé comme icône lorsqu'aucun icon_url n'est défini. Non
heading (par feature) Titre de la feature, par ex. "Fast setup". Non
body (par feature) Description de la feature. Accepte le HTML brut. Non

Les features sont ajoutées et supprimées avec le bouton "Add feature" ; il n'y a aucune limite fixe au nombre que vous pouvez ajouter.

Sécurité HTML

Le heading de la section, ainsi que l'icon, le heading et l'icon_url de chaque feature sont échappés et rendus en texte brut (l'icon_url n'est jamais utilisée que comme valeur d'attribut <img src>, pas rendue comme balisage). Le body de chaque feature est rendu sans échappement, donc il accepte le HTML brut, ce qui permet d'ajouter des liens, du texte en gras ou des listes dans une description de feature.

Ce block prend également en charge les contrôles d'apparence standards : couleur de fond, bordure, couleur du texte, padding, margin.

Utilisation

{{block:product-features​}}

Généralement placé sur une page marketing ou produit juste sous une section hero, pour résumer les arguments de vente clés en un coup d'œil.

Exemple

Une page de produit SaaS avec trois features, utilisant des icônes emoji à la place d'URLs d'images :

icon heading body
⚡ Fast setup Live in under 5 minutes with our <a href="/docs/quickstart">quickstart guide</a>.
🔒 Secure by default SOC 2 Type II certified. Data encrypted at rest and in transit.
📈 Scales with you From 10 to 10 million requests a day on the same plan.

heading de la section : "Why teams choose us". Comme body n'est pas échappé, le balisage du lien de la première ligne est rendu comme un lien réellement cliquable plutôt que comme des chevrons littéraux.

Lisez ce site en