Waimia.
Réserver un audit →

CTA Sections

cta-split-visual

stable Bibliothèque Contenu inline (instance)

Pousser à l'action

Bandeau CTA asymetrique 2 colonnes : texte kicker/titre/body/boutons a gauche, visuel SVG decoratif a droite. Distinct des CTA centres.

cta split visual banner
Ouvrir dans le builder

Instances sur le site

Global 0 instance en page composable

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

Aperçu

Comment l'utiliser

Intention

Pousser à l'action

Rôle de page

Conversion

Modèle de contenu

Contenu inline (instance)

Effets

Apparition au scroll

Interactions

Défilement

Éléments

Illustration au trait Boutons

Mise en page

2 colonnes Média à droite Scindé

Contrat de slots

Champ Nature Type Requis Bilingue Bornes / valeurs
kicker Contenu text Non fr / en ·
h2 Contenu text Oui fr / en ·
body Contenu richtext Non fr / en ·
cta_primary Contenu object Oui · ·
cta_secondary Contenu object Non · ·
background Présentation enum Non · paper · paper-2 · paper-3 · ink · accent

Déclinaisons · 17

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

  • CTA scindé · fond papier

    curée
    cta-split-visual--paper

  • CTA scindé · fond papier 3

    curée
    cta-split-visual--paper-3

  • CTA scindé · fond encre

    curée
    cta-split-visual--ink

  • CTA scindé · fond accent

    curée
    cta-split-visual--accent

  • cta-split-visual · équilibré

    générée
    cta-split-visual--1-1

  • cta-split-visual · média dominant · média à gauche

    générée
    cta-split-visual--1-2-left

  • cta-split-visual · média dominant · média à droite

    générée
    cta-split-visual--1-2-right

  • cta-split-visual · texte dominant · média à gauche

    générée
    cta-split-visual--2-1-left

  • cta-split-visual · texte dominant · média à droite

    générée
    cta-split-visual--2-1-right

  • cta-split-visual · média large · média à gauche

    générée
    cta-split-visual--2-3-left

  • cta-split-visual · média large · média à droite

    générée
    cta-split-visual--2-3-right

  • cta-split-visual · texte large · média à gauche

    générée
    cta-split-visual--3-2-left

  • cta-split-visual · texte large · média à droite

    générée
    cta-split-visual--3-2-right

  • cta-split-visual · média très large · média à gauche

    générée
    cta-split-visual--1-3-left

  • cta-split-visual · média très large · média à droite

    générée
    cta-split-visual--1-3-right

  • cta-split-visual · texte très large · média à gauche

    générée
    cta-split-visual--3-1-left

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 scindé · fond papier

    curée
    cta-split-visual--paper
    background:paper
    Ouvrir dans le builder

  • CTA scindé · fond papier 3

    curée
    cta-split-visual--paper-3
    background:paper-3
    Ouvrir dans le builder

  • CTA scindé · fond encre

    curée
    cta-split-visual--ink
    background:ink
    Ouvrir dans le builder

  • CTA scindé · fond accent

    curée
    cta-split-visual--accent
    background:accent
    Ouvrir dans le builder

  • cta-split-visual · équilibré

    générée
    cta-split-visual--1-1
    proportion:1-1
    Ouvrir dans le builder

  • cta-split-visual · média dominant · média à gauche

    générée
    cta-split-visual--1-2-left
    proportion:1-2mediaSide:left
    Ouvrir dans le builder

  • cta-split-visual · média dominant · média à droite

    générée
    cta-split-visual--1-2-right
    proportion:1-2mediaSide:right
    Ouvrir dans le builder

  • cta-split-visual · texte dominant · média à gauche

    générée
    cta-split-visual--2-1-left
    proportion:2-1mediaSide:left
    Ouvrir dans le builder

  • cta-split-visual · texte dominant · média à droite

    générée
    cta-split-visual--2-1-right
    proportion:2-1mediaSide:right
    Ouvrir dans le builder

  • cta-split-visual · média large · média à gauche

    générée
    cta-split-visual--2-3-left
    proportion:2-3mediaSide:left
    Ouvrir dans le builder

  • cta-split-visual · média large · média à droite

    générée
    cta-split-visual--2-3-right
    proportion:2-3mediaSide:right
    Ouvrir dans le builder

  • cta-split-visual · texte large · média à gauche

    générée
    cta-split-visual--3-2-left
    proportion:3-2mediaSide:left
    Ouvrir dans le builder

  • cta-split-visual · texte large · média à droite

    générée
    cta-split-visual--3-2-right
    proportion:3-2mediaSide:right
    Ouvrir dans le builder

  • cta-split-visual · média très large · média à gauche

    générée
    cta-split-visual--1-3-left
    proportion:1-3mediaSide:left
    Ouvrir dans le builder

  • cta-split-visual · média très large · média à droite

    générée
    cta-split-visual--1-3-right
    proportion:1-3mediaSide:right
    Ouvrir dans le builder

  • cta-split-visual · texte très large · média à gauche

    générée
    cta-split-visual--3-1-left
    proportion:3-1mediaSide:left
    Ouvrir dans le builder

Sections liées

Même famille

about-story-split stable

Récit fondateur en deux colonnes : texte narratif de mission à gauche, timeline de jalons datés à droite. Raconte l’histoire de la marque sans verbiage.

split-media About Sections Illustration au traitListeFrise chronologique +3 17 décl.
architecture-diagram stable

Diagramme d'architecture signature : N canaux d'entrée vers un système central et M sorties, avec boucle d'amélioration continue.

split-media Feature Sections Apparition au scrollDéfilementIllustration au trait +1 23 décl.
asymmetric-services stable

Services en rangées asymétriques (AsymmetricServiceRow) qui alternent gauche/droite : numéro display, nom, body et flèche, signature de /manifesto Acte II.

split-media Manifesto Sections Apparition au scrollDéfilement1 colonne 15 décl.
case-split stable

Cas client en split dark/light 50/50 : récit du cas à gauche (titre, body, CTA) et résultats chiffrés à droite.

split-media Testimonial Sections Apparition au scrollSurvolDéfilement +4 13 décl.
feature-split-media stable

Une feature majeure exposée en deux colonnes : texte et points clés d’un côté, mockup ou capture de l’autre. Le champ reversed permet d’alterner les côtés au fil de la page.

split-media Feature Sections Apparition au scrollDéfilementImage +6 25 décl.
feature-zigzag stable

Lignes alternées visuel/texte (gauche-droite, droite-gauche) pour presenter les fonctionnalites cles d'une offre avec un rythme editorial fort.

split-media Feature Sections Apparition au scrollDéfilementIllustration au trait +6 25 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.

band CTA Sections 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>).

band CTA Sections Apparition au scrollSurvolBoutons +1 17 décl.
cta-band stable

Bandeau CTA horizontal pour relancer une action au milieu ou en fin de parcours.

band CTA Sections BoutonsPleine largeur 17 décl.
cta-final stable

CTA final pour conclure une page et orienter vers l'action de conversion principale.

band CTA Sections 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.

form-panel CTA Sections SurvolBoutonsFormulaire +3 13 décl.
cta-inline stable

CTA inline discret pour insérer une action contextuelle dans un contenu existant.

band CTA Sections BoutonsPleine largeur 18 décl.

Similaires

newsletter-band stable

Bande newsletter fond sombre : titre éditorial large à gauche, formulaire capture email à droite.

band CTA Sections Apparition au scrollSurvolDéfilement +4 12 décl.
department-cta stable

Clôture CTA sur fond ink : Dingbat, titre display italique, body et deux boutons (rendez-vous + lien secondaire).

band CTA Sections Apparition au scrollSurvolDéfilement +3 14 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).

list CTA Sections Survol1 colonne 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.

band CTA Sections Boutons2 colonnesScindé 27 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.

band Newsletter Sections Illustration au traitBoutonsFormulaire +3 17 décl.
contact-form stable

Section contact avec formulaire (nom, email, message) et colonne coordonnées, action vers /api/contact, bilingue.

form-panel Contact Sections SurvolIllustration au traitBoutons +4 9 décl.

Code

Données de la section (à placer dans sections[])

{
  "type": "cta-split-visual",
  "kicker_fr": "Prochaine étape · audit gratuit",
  "kicker_en": "Next step · free audit",
  "h2_fr": "Accélérez votre <i>transformation IA</i> en 5 jours",
  "h2_en": "Accelerate your <i>AI transformation</i> in 5 days",
  "body_fr": "Un audit offert, un plan d'action concret et un premier workflow livré avant la fin de la semaine.",
  "body_en": "A free audit, a concrete action plan and a first workflow delivered before the end of the week.",
  "cta_primary": {
    "label_fr": "Reserver mon audit",
    "label_en": "Book my audit",
    "href": "/contact",
    "variant": "primary",
    "mag": 0.16
  },
  "cta_secondary": {
    "label_fr": "Voir les offres",
    "label_en": "View offers",
    "href": "/services",
    "variant": "ghost"
  },
  "background": "paper-2"
}

Pour un agent / MCP

Détail machine de cette section (intention, rôle, contrat de slots, sections liées).

/library/section/cta-split-visual.json

Chemin du détail machine

/library/section/cta-split-visual.json