article-grid

Instances sur le site

Global 0 instance en page composable

Uniquement en bibliothèque (aucune instance en page).

Aperçu

Comment l'utiliser

Déclinaisons · 18

Combinaisons nommées « variante × palette × densité » appliquées à ce composant, prévisualisées en rendu isolé. 4 curées, 14 générées. Échantillon des 12 premières générées (sur 14) ; toutes accessibles en rendu isolé.

• Grille d'articles · papier 2

  curée
  article-grid--paper-2
• Grille d'articles · papier 3

  curée
  article-grid--paper-3
• Grille d'articles · encre

  curée
  article-grid--ink
• Grille d'articles · 2 colonnes

  curée
  article-grid--cols-2
• article-grid · grille uniforme

  générée
  article-grid--grid-uniform
• article-grid · grille auto

  générée
  article-grid--grid-auto
• article-grid · grille asymétrique

  générée
  article-grid--grid-asym
• article-grid · liste

  générée
  article-grid--list
• article-grid · lignes séparées

  générée
  article-grid--rows-divided
• article-grid · bento vedette

  générée
  article-grid--bento-feature
• article-grid · vedette + split

  générée
  article-grid--featured-split
• article-grid · deux colonnes

  générée
  article-grid--two-col
• article-grid · alternance

  générée
  article-grid--alternating
• article-grid · jeu de cartes

  générée
  article-grid--cards-deck
• article-grid · liste média à gauche

  générée
  article-grid--list-media-left
• article-grid · grille 3 + vedette

  générée
  article-grid--grid-3-featured

Comparer les déclinaisons · 16

Chaque déclinaison, résumée par son écart d'axes face à la démo par défaut du type : seuls les axes qui changent une valeur sont listés. Ouvre-la dans le builder pour l'assembler dans une page.

• Grille d'articles · papier 2

  curée
  article-grid--paper-2
  background:paper-2
  Ouvrir dans le builder

• Grille d'articles · papier 3

  curée
  article-grid--paper-3
  background:paper-3
  Ouvrir dans le builder

• Grille d'articles · encre

  curée
  article-grid--ink
  background:ink
  Ouvrir dans le builder

• Grille d'articles · 2 colonnes

  curée
  article-grid--cols-2
  columns:2
  Ouvrir dans le builder

• article-grid · grille uniforme

  générée
  article-grid--grid-uniform
  layout:grid-uniform
  Ouvrir dans le builder

• article-grid · grille auto

  générée
  article-grid--grid-auto
  layout:grid-auto
  Ouvrir dans le builder

• article-grid · grille asymétrique

  générée
  article-grid--grid-asym
  layout:grid-asym
  Ouvrir dans le builder

• article-grid · liste

  générée
  article-grid--list
  layout:list
  Ouvrir dans le builder

• article-grid · lignes séparées

  générée
  article-grid--rows-divided
  layout:rows-divided
  Ouvrir dans le builder

• article-grid · bento vedette

  générée
  article-grid--bento-feature
  layout:bento-feature
  Ouvrir dans le builder

• article-grid · vedette + split

  générée
  article-grid--featured-split
  layout:featured-split
  Ouvrir dans le builder

• article-grid · deux colonnes

  générée
  article-grid--two-col
  layout:two-col
  Ouvrir dans le builder

• article-grid · alternance

  générée
  article-grid--alternating
  layout:alternating
  Ouvrir dans le builder

• article-grid · jeu de cartes

  générée
  article-grid--cards-deck
  layout:cards-deck
  Ouvrir dans le builder

• article-grid · liste média à gauche

  générée
  article-grid--list-media-left
  layout:list-media-left
  Ouvrir dans le builder

• article-grid · grille 3 + vedette

  générée
  article-grid--grid-3-featured
  layout:grid-3-featured
  Ouvrir dans le builder

Sections liées

Code

{
  "type": "article-grid",
  "kicker_fr": "[journal] · notes & analyses",
  "kicker_en": "[journal] · notes & analysis",
  "h2_fr": "Ce qu&rsquo;on apprend, on l&rsquo;<i class=\"acc\">écrit</i>.",
  "h2_en": "What we learn, we <i class=\"acc\">write</i> down.",
  "intro_fr": "Retours de terrain sur l’IA appliquée au revenue : acquisition, contenu, CRM. Sans hype, avec les chiffres.",
  "intro_en": "Field reports on AI applied to revenue: acquisition, content, CRM. No hype, with the numbers.",
  "background": "paper",
  "columns": "3",
  "articles": [
    {
      "image": "/images/illustrations/ds/money-money-paper.webp",
      "tint": 30,
      "tag_fr": "Acquisition",
      "tag_en": "Acquisition",
      "title_fr": "Réallouer un budget média chaque semaine sans casser le pipeline",
      "title_en": "Reallocating media budget weekly without breaking the pipeline",
      "excerpt_fr": "Le scoring CRM décide, pas le sentiment. Comment on câble la boucle.",
      "excerpt_en": "CRM scoring decides, not gut feeling. How we wire the loop.",
      "date": "2026-04-18",
      "read_time_fr": "6 min",
      "read_time_en": "6 min",
      "author": "Léa Marchand",
      "href": "/blog"
    },
    {
      "image": "/images/illustrations/ds/band-showing-tv-paper.webp",
      "tint": 220,
      "tag_fr": "Contenu",
      "tag_en": "Content",
      "title_fr": "Un humain relit chaque ligne : pourquoi la relecture reste le goulot",
      "title_en": "A human reviews every line: why review stays the bottleneck",
      "excerpt_fr": "La production outillée IA ne supprime pas le jugement éditorial.",
      "excerpt_en": "AI-assisted production does not remove editorial judgement.",
      "date": "2026-04-02",
      "read_time_fr": "8 min",
      "read_time_en": "8 min",
      "author": "Tomás Riveiro",
      "href": "/blog"
    },
    {
      "tag_fr": "CRM",
      "tag_en": "CRM",
      "title_fr": "Scoring honnête contre dashboards flatteurs : le test du vendredi",
      "title_en": "Honest scoring versus flattering dashboards: the Friday test",
      "excerpt_fr": "Trois métriques qui survivent à un comité, et celles qui mentent.",
      "excerpt_en": "Three metrics that survive a board, and the ones that lie.",
      "date": "2026-03-21",
      "read_time_fr": "5 min",
      "read_time_en": "5 min",
      "author": "Léa Marchand",
      "href": "/blog"
    }
  ]
}

/library/section/article-grid.json