CTA Sections
cta-final
stable Sur waimia · 4 Contenu inline (instance)Pousser à l'action
CTA final pour conclure une page et orienter vers l'action de conversion principale.
Instances sur le site
Global 0 instance en page composable
-
src/components/templates/ConversionFunnelTemplate.astro -
src/components/templates/UtilityTemplate.astro -
src/pages/atlas.astro -
src/pages/en/atlas.astro
Aperçu
Comment l'utiliser
| Champ | Nature | Type | Requis | Bilingue | Bornes / valeurs |
|---|---|---|---|---|---|
h2 | Contenu | text | Oui | fr / en | · |
body | Contenu | richtext | Non | fr / en | · |
cta_primary | Contenu | object | Oui | · | · |
cta_secondary | Contenu | object | Non | · | · |
chapter_num | Contenu | text | Non | · | · |
chapter_title | Contenu | text | Non | fr / en | · |
availability | Contenu | text | Non | fr / en | · |
reassurance | Contenu | text | Non | fr / en | · |
background | Présentation | enum | Non | · | paper · paper-2 · paper-3 · ink · accent |
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é.
-
CTA final · fond papier 2
curéecta-final--paper-2 -
CTA final · fond papier 3
curéecta-final--paper-3 -
CTA final · fond encre
curéecta-final--ink -
CTA final · fond accent
curéecta-final--accent -
cta-final · en ligne · aligné début
généréecta-final--inline-start -
cta-final · en ligne · centré
généréecta-final--inline-center -
cta-final · empilé · aligné début
généréecta-final--stacked-start -
cta-final · empilé · centré
généréecta-final--stacked-center -
cta-final · centré · aligné début
généréecta-final--centered-start -
cta-final · centré · centré
généréecta-final--centered-center -
cta-final · pleine largeur · aligné début
généréecta-final--full-bleed-start -
cta-final · pleine largeur · centré
généréecta-final--full-bleed-center -
cta-final · split image · aligné début
généréecta-final--split-image-start -
cta-final · split image · centré
généréecta-final--split-image-center -
cta-final · encadré · aligné début
généréecta-final--boxed-start -
cta-final · encadré · centré
généréecta-final--boxed-center
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.
-
CTA final · fond papier 2
curéecta-final--paper-2background:paper-2Ouvrir dans le builder -
CTA final · fond papier 3
curéecta-final--paper-3background:paper-3Ouvrir dans le builder -
CTA final · fond encre
curéecta-final--inkbackground:inkOuvrir dans le builder -
CTA final · fond accent
curéecta-final--accentbackground:accentOuvrir dans le builder -
cta-final · en ligne · aligné début
généréecta-final--inline-startlayout:inlinealign:startOuvrir dans le builder -
cta-final · en ligne · centré
généréecta-final--inline-centerlayout:inlinealign:centerOuvrir dans le builder -
cta-final · empilé · aligné début
généréecta-final--stacked-startlayout:stackedalign:startOuvrir dans le builder -
cta-final · empilé · centré
généréecta-final--stacked-centerlayout:stackedalign:centerOuvrir dans le builder -
cta-final · centré · aligné début
généréecta-final--centered-startlayout:centeredalign:startOuvrir dans le builder -
cta-final · centré · centré
généréecta-final--centered-centerlayout:centeredalign:centerOuvrir dans le builder -
cta-final · pleine largeur · aligné début
généréecta-final--full-bleed-startlayout:full-bleedalign:startOuvrir dans le builder -
cta-final · pleine largeur · centré
généréecta-final--full-bleed-centerlayout:full-bleedalign:centerOuvrir dans le builder -
cta-final · split image · aligné début
généréecta-final--split-image-startlayout:split-imagealign:startOuvrir dans le builder -
cta-final · split image · centré
généréecta-final--split-image-centerlayout:split-imagealign:centerOuvrir dans le builder -
cta-final · encadré · aligné début
généréecta-final--boxed-startlayout:boxedalign:startOuvrir dans le builder -
cta-final · encadré · centré
généréecta-final--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.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-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.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-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": "cta-final",
"chapter_num": "FIG V · 5.0",
"chapter_title_fr": "Acte V · Passer à l'action",
"chapter_title_en": "Act V · Act",
"h2_fr": "Stop le <i>théâtre</i>. Câbler.",
"h2_en": "Stop the <i>theatre</i>. Wire it.",
"body_fr": "45 minutes. On regarde. On audite. On chiffre. Si on n'a rien à vous proposer, on le dit. On ne relance pas.",
"body_en": "45 minutes. We look. We audit. We price. If we have nothing to offer, we say so. No follow-up.",
"availability_fr": "● DISPONIBLE · RÉPONSE SOUS 24H",
"availability_en": "● AVAILABLE · RESPONSE IN 24H",
"cta_primary": {
"label_fr": "Câbler →",
"label_en": "Wire it →",
"href": "/contact",
"variant": "primary"
},
"cta_secondary": {
"label_fr": "bonjour@waimia.com",
"label_en": "bonjour@waimia.com",
"href": "mailto:bonjour@waimia.com",
"variant": "ghost"
},
"reassurance_fr": "Diagnostic <i>gratuit</i> · sans engagement · réponse <i>sous 24h</i>.",
"reassurance_en": "Free <i>diagnostic</i> · no commitment · response <i>within 24h</i>.",
"background": "paper"
}/library/section/cta-final.json
Chemin du détail machine
/library/section/cta-final.json