CTA Sections
closing-cta-band
stable Sur waimia · 1 Contenu inline (instance)Pousser à l'action
Bande CTA de cloture sur fond ink : kicker + titre display-lg (accent italique) + bouton primaire. Titre rendu en HTML (accent <em>).
Instances sur le site
Global 0 instance en page composable
-
src/components/templates/AuthorPageTemplate.astro
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 | Oui | fr / en | · |
h2_html | Contenu | richtext | Oui | fr / en | · |
button_label | Contenu | text | Oui | fr / en | · |
button_href | Contenu | url | Oui | · | · |
Déclinaisons · 17
Combinaisons nommées « variante × palette × densité » appliquées à ce composant, prévisualisées en rendu isolé. 3 curées, 14 générées. Échantillon des 12 premières générées (sur 14) ; toutes accessibles en rendu isolé.
-
CTA de clôture · papier
curéeclosing-cta-band--paper -
CTA de clôture · papier 2
curéeclosing-cta-band--paper-2 -
CTA de clôture · papier 3
curéeclosing-cta-band--paper-3 -
closing-cta-band · en ligne · aligné début
généréeclosing-cta-band--inline-start -
closing-cta-band · en ligne · centré
généréeclosing-cta-band--inline-center -
closing-cta-band · empilé · aligné début
généréeclosing-cta-band--stacked-start -
closing-cta-band · empilé · centré
généréeclosing-cta-band--stacked-center -
closing-cta-band · centré · aligné début
généréeclosing-cta-band--centered-start -
closing-cta-band · centré · centré
généréeclosing-cta-band--centered-center -
closing-cta-band · pleine largeur · aligné début
généréeclosing-cta-band--full-bleed-start -
closing-cta-band · pleine largeur · centré
généréeclosing-cta-band--full-bleed-center -
closing-cta-band · split image · aligné début
généréeclosing-cta-band--split-image-start -
closing-cta-band · split image · centré
généréeclosing-cta-band--split-image-center -
closing-cta-band · encadré · aligné début
généréeclosing-cta-band--boxed-start -
closing-cta-band · encadré · centré
généréeclosing-cta-band--boxed-center
Comparer les déclinaisons · 15
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.
-
CTA de clôture · papier
curéeclosing-cta-band--paperbackground:paperOuvrir dans le builder -
CTA de clôture · papier 2
curéeclosing-cta-band--paper-2background:paper-2Ouvrir dans le builder -
CTA de clôture · papier 3
curéeclosing-cta-band--paper-3background:paper-3Ouvrir dans le builder -
closing-cta-band · en ligne · aligné début
généréeclosing-cta-band--inline-startlayout:inlinealign:startOuvrir dans le builder -
closing-cta-band · en ligne · centré
généréeclosing-cta-band--inline-centerlayout:inlinealign:centerOuvrir dans le builder -
closing-cta-band · empilé · aligné début
généréeclosing-cta-band--stacked-startlayout:stackedalign:startOuvrir dans le builder -
closing-cta-band · empilé · centré
généréeclosing-cta-band--stacked-centerlayout:stackedalign:centerOuvrir dans le builder -
closing-cta-band · centré · aligné début
généréeclosing-cta-band--centered-startlayout:centeredalign:startOuvrir dans le builder -
closing-cta-band · centré · centré
généréeclosing-cta-band--centered-centerlayout:centeredalign:centerOuvrir dans le builder -
closing-cta-band · pleine largeur · aligné début
généréeclosing-cta-band--full-bleed-startlayout:full-bleedalign:startOuvrir dans le builder -
closing-cta-band · pleine largeur · centré
généréeclosing-cta-band--full-bleed-centerlayout:full-bleedalign:centerOuvrir dans le builder -
closing-cta-band · split image · aligné début
généréeclosing-cta-band--split-image-startlayout:split-imagealign:startOuvrir dans le builder -
closing-cta-band · split image · centré
généréeclosing-cta-band--split-image-centerlayout:split-imagealign:centerOuvrir dans le builder -
closing-cta-band · encadré · aligné début
généréeclosing-cta-band--boxed-startlayout:boxedalign:startOuvrir dans le builder -
closing-cta-band · encadré · centré
généréeclosing-cta-band--boxed-centerlayout:boxedalign:centerOuvrir 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.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.cta-inline stable CTA inline discret pour insérer une action contextuelle dans un contenu existant.
BoutonsPleine largeur 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.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.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.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.newsletter-band stable Bande newsletter fond sombre : titre éditorial large à gauche, formulaire capture email à droite.
Apparition au scrollSurvolDéfilement +4 12 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.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.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.Code
Données de la section (à placer dans sections[])
{
"type": "closing-cta-band",
"kicker_fr": "§ Travailler ensemble",
"kicker_en": "§ Work together",
"h2_html_fr": "Le mardi on câble.<em> Le vendredi on mesure.</em>",
"h2_html_en": "On Tuesday we wire.<em> On Friday we measure.</em>",
"button_label_fr": "Câbler mon système →",
"button_label_en": "Wire my system →",
"button_href": "/contact"
}/library/section/closing-cta-band.json
Chemin du détail machine
/library/section/closing-cta-band.json