CTA Sections
newsletter-band
stable Bibliothèque Contenu inline (instance)Pousser à l'action
Bande newsletter fond sombre : titre éditorial large à gauche, formulaire capture email à droite.
Instances sur le site
Global 0 instance en page composable
Aperçu
Comment l'utiliser
| Champ | Nature | Type | Requis | Bilingue | Bornes / valeurs |
|---|---|---|---|---|---|
background | Présentation | enum | Non | · | paper · paper-2 · paper-3 · ink |
kicker | Contenu | text | Non | fr / en | · |
h2 | Contenu | text | Oui | fr / en | · |
lead | Contenu | text | Non | fr / en | · |
placeholder | Contenu | text | Non | fr / en | · |
cta_label | Contenu | text | Non | fr / en | · |
hint | Contenu | text | Non | fr / en | · |
form_action | Contenu | text | Non | · | · |
Déclinaisons · 12
Combinaisons nommées « variante × palette × densité » appliquées à ce composant, prévisualisées en rendu isolé. 3 curées, 9 générées.
-
Bande newsletter · fond papier
curéenewsletter-band--paper -
Bande newsletter · fond papier 2
curéenewsletter-band--paper-2 -
Bande newsletter · fond papier 3
curéenewsletter-band--paper-3 -
newsletter-band · colonne unique
généréenewsletter-band--single-col -
newsletter-band · deux colonnes
généréenewsletter-band--two-col -
newsletter-band · en ligne
généréenewsletter-band--inline -
newsletter-band · split avec média
généréenewsletter-band--split-with-media -
newsletter-band · multi-étapes
généréenewsletter-band--multi-step -
newsletter-band · carte encadrée
généréenewsletter-band--boxed-card -
newsletter-band · deux étapes
généréenewsletter-band--two-step -
newsletter-band · compact en ligne
généréenewsletter-band--compact-inline -
newsletter-band · pleine largeur
généréenewsletter-band--full-width
Comparer les déclinaisons · 12
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.
-
Bande newsletter · fond papier
curéenewsletter-band--paperbackground:paperOuvrir dans le builder -
Bande newsletter · fond papier 2
curéenewsletter-band--paper-2background:paper-2Ouvrir dans le builder -
Bande newsletter · fond papier 3
curéenewsletter-band--paper-3background:paper-3Ouvrir dans le builder -
newsletter-band · colonne unique
généréenewsletter-band--single-collayout:single-colOuvrir dans le builder -
newsletter-band · deux colonnes
généréenewsletter-band--two-collayout:two-colOuvrir dans le builder -
newsletter-band · en ligne
généréenewsletter-band--inlinelayout:inlineOuvrir dans le builder -
newsletter-band · split avec média
généréenewsletter-band--split-with-medialayout:split-with-mediaOuvrir dans le builder -
newsletter-band · multi-étapes
généréenewsletter-band--multi-steplayout:multi-stepOuvrir dans le builder -
newsletter-band · carte encadrée
généréenewsletter-band--boxed-cardlayout:boxed-cardOuvrir dans le builder -
newsletter-band · deux étapes
généréenewsletter-band--two-steplayout:two-stepOuvrir dans le builder -
newsletter-band · compact en ligne
généréenewsletter-band--compact-inlinelayout:compact-inlineOuvrir dans le builder -
newsletter-band · pleine largeur
généréenewsletter-band--full-widthlayout:full-widthOuvrir dans le builder
Sections liées
Même famille
announcement-banner stable Bandeau d’annonce/promo fin : badge optionnel, texte court et lien, bouton de fermeture optionnel (dismissible), variantes accent, encre ou paper-2.
SurvolBoutonsIcônes +2 17 décl.branded-callout stable Callout de marque fond paper-2 avec kicker §, titre display italique et corps de deux paragraphes, CTA optionnel.
Apparition au scrollDéfilementBoutons +1 20 décl.closing-cta-band stable Bande CTA de cloture sur fond ink : kicker + titre display-lg (accent italique) + bouton primaire. Titre rendu en HTML (accent <em>).
Apparition au scrollSurvolBoutons +1 17 décl.comparison-pricing-callout stable Bloc « pourquoi nous » en trois colonnes de propositions de valeur, terminé par un CTA et une mention. Sert de pont entre les features et la page tarifaire.
Illustration au traitListe3 colonnes 18 décl.cta-band stable Bandeau CTA horizontal pour relancer une action au milieu ou en fin de parcours.
BoutonsPleine largeur 17 décl.cta-final stable CTA final pour conclure une page et orienter vers l'action de conversion principale.
Apparition au scrollSurvolDéfilement +3 18 décl.Même catégorie
branded-callout stable Callout de marque fond paper-2 avec kicker §, titre display italique et corps de deux paragraphes, CTA optionnel.
Apparition au scrollDéfilementBoutons +1 20 décl.closing-cta-band stable Bande CTA de cloture sur fond ink : kicker + titre display-lg (accent italique) + bouton primaire. Titre rendu en HTML (accent <em>).
Apparition au scrollSurvolBoutons +1 17 décl.cta-band stable Bandeau CTA horizontal pour relancer une action au milieu ou en fin de parcours.
BoutonsPleine largeur 17 décl.cta-final stable CTA final pour conclure une page et orienter vers l'action de conversion principale.
Apparition au scrollSurvolDéfilement +3 18 décl.cta-form-inline stable Bande CTA avec mini-formulaire inline (email et bouton), pour capter un lead ou une inscription newsletter à l'instant d'intention.
SurvolBoutonsFormulaire +3 13 décl.cta-inline stable CTA inline discret pour insérer une action contextuelle dans un contenu existant.
BoutonsPleine largeur 18 décl.Similaires
department-cta stable Clôture CTA sur fond ink : Dingbat, titre display italique, body et deux boutons (rendez-vous + lien secondaire).
Apparition au scrollSurvolDéfilement +3 14 décl.cta-split-visual stable Bandeau CTA asymetrique 2 colonnes : texte kicker/titre/body/boutons a gauche, visuel SVG decoratif a droite. Distinct des CTA centres.
Apparition au scrollDéfilementIllustration au trait +4 17 décl.footer-cta-band stable Bande CTA finale pleine largeur (titre, sous-titre, un à deux boutons), pensée comme le climax juste avant le footer. Sombre par défaut pour trancher avec la page.
Boutons2 colonnesScindé 27 décl.tunnel-step-nav stable Pied de navigation d'étape tunnel : lien prev optionnel + cta (primary/accent/ghost) + barre méta (lecture + retour offre).
Survol1 colonne 17 décl.cta-newsletter-footer stable Capture email compacte multi-colonne de type pré-footer : titre, champ, bouton et mention RGPD sur une ligne. Sombre par défaut pour clore la page sur l’abonnement.
Illustration au traitBoutonsFormulaire +3 17 décl.newsletter-signup-section stable Section d'inscription newsletter pleine largeur (réutilise NewsletterSignup), fonds au choix dont ink pour un climax de page.
BoutonsCentré 17 décl.Code
Données de la section (à placer dans sections[])
{
"type": "newsletter-band",
"kicker_fr": "La lettre",
"kicker_en": "The letter",
"h2_fr": "Un <i>essai</i> par mois. Jamais de promotion.",
"h2_en": "One <i>essay</i> per month. Never a pitch.",
"lead_fr": "Des analyses longues sur ce qui marche vraiment en IA appliquée, sans jargon ni hype.",
"lead_en": "Long-form analysis of what actually works in applied AI, no jargon, no hype.",
"placeholder_fr": "votre@email.com",
"placeholder_en": "your@email.com",
"cta_label_fr": "S'abonner →",
"cta_label_en": "Subscribe →",
"hint_fr": "Sans spam · Désinscription en 1 clic",
"hint_en": "No spam · Unsubscribe in 1 click"
}/library/section/newsletter-band.json
Chemin du détail machine
/library/section/newsletter-band.json