Comment créer un CTA efficaces avec Elementor

Bonjour à tous, je suis Carlota de l’agence wiiv et dans cette vidéo, nous allons voir comment configurer un CTA sur votre site wordpress elementor.

Qu’est-ce qu’un CTA ?

Quand on parle de CTA il s’agit de l’acronyme de Call to action, et c’est, un bouton que vous allez placer sur votre site web ou même peut-être dans un email qui va amener votre visiteur à effectuer une action.
Son objectif, va être de convertir vos visiteurs en client. Et vous l’aurez deviné, c’est un excellent levier marketing que vous devez bien maîtriser.

Vous pouvez intégrer un CTA à chaque étape du tunnel de conversion et à différents endroit de votre site, tout d’abord, par exemple.

1. Lors de la première étape du tunnel de conversion, c’est-dire la prise de conscience. Votre visiteur et en recherche d’information, il a certains besoins. Et donc à cette étape vous allez lui proposer par exemple de s’inscrire à votre newsletter, ou encore de télécharger à un livre blanc ou un guide que vous avez créé.
2. Ensuite, lors de dans la deuxième étape de votre tunnel, la considération, votre visiteur, il a déjà commencé à s’informer à comparer des produit. Donc, à ce moment-là, vous allez plutôt lui proposer de télécharger une brochure ou des éléments qui lui apportent plus d’informations sur vos produits.
3. Et finalement, dans l’étape de décision, la votre visiteur est mûre, il est prêt à acheter et donc vous allez plutôt lui proposer des CTA, telle que acheter maintenant ou encore demander un devis ou prenez rendez-vous.

Comme vous pouvez le voir il existe de nombreux type de CTA. Vous devez donc prévoir en amont quel type de CTA s’adapte le plus à votre à votre entreprise et ou vous allez le positionner.

Par exemple, pour une entreprise qui évolue dans le BtoB. On va plutôt inciter à une demande de devis ou encore à prendre un rendez-vous. Alors que dans une entreprise accès, BtoC, ça va plutôt être ajouter au panier ou s’inscrire à la newsletter.

Quel design et text pour votre CTA ?

En ce qui concerne le design de votre CTA il existe de nombreuses possibilités. Ceux-ci vont dépendre tout d’abord de votre identité visuelle, qu’il faut bien respecter. Mais au-déla de ça, vous pouvez l’envisager, soit comme un élément fixe au milieu de votre page, soit comme un pop-up qui apparaîtrait à un moment donné sur votre site. Comme par exemple lors de votre arrivé sur la page ou encore lorsque vous cherchez à fermer celle-ci.

Et finalement, dernier point à bien envisager ça va être le texte que vous allez mettre dans votre CTA. Lorsque vous créer votre Call to action, il faut tout d’abord que vous soyez très clair. Donnez envie à votre visiteur de cliquez sur votre CTA en seulement quelques mots. Pour cela vous pouvez donc utiliser des verbes d’action, pour vraiment les encouragées, à cliquer ou un renseigner leur adresse email.

Comment créer votre CTA sur Elementor?

Maintenant, passons à l’action et créons notre propre CTA en utilisant Elementor. Pour cela, nous allons nous inspirer du CTA suivant que nous utilisons sur le site web de l’agence Wiiv. Dans ce CTA, nous avons différentes possibilités d’action. Tout d’abord, nous avons la possibilité de nous rendre sur d’autres pages du site à travers les boutons « Votre solution sur mesure » ou « Voir les outils gratuits », mais également la possibilité de s’inscrire via un formulaire pour recevoir nos conseils et astuces par email.

Pour reproduire ce CTA, nous nous rendrons sur notre site de démo, qui est ici, puis tout en bas de notre interface de modification de page Elementor, nous recréerons ce CTA.

Dans ce CTA, nous avons tout d’abord une section avec 3 colonnes où nous retrouvons un sur-titre et un titre, puis nos deux boutons. Nous allons donc ajouter une section grâce à la flexbox, puis nous ajouterons nos conteneurs que nous configurerons pour avoir la même largeur. Dans le premier conteneur, nous ajouterons des éléments de titre Elementor, puis dans les deux autres conteneurs, nous ajouterons des éléments bouton.

Nous avons bien ajouté nos éléments et maintenant nous allons les configurer pour qu’ils s’adaptent à l’image de marque de Wiiv.

Elements Elementor Bouton

Contenu
La première étape de configuration de votre bouton va être de renseigner le contenu de celui-ci. Dans le champ texte, nous pouvons ajouter le contenu de notre CTA. Pour le premier bouton, nous ajoutons alors le texte « Votre solution sur mesure », puis dans le champ lien, nous allons ajouter le lien vers la page où nous souhaitons rediriger votre visiteur. Ensuite, dans le champ Icône, nous allons ajouter une icône à la suite de notre texte.

Style
Ensuite, nous allons configurer le design de ce bouton, en respectant la charte graphique et l’identité de la marque Wiiv. Dans notre cas, nous allons réaliser un bouton avec une bordure et un texte orange de Wiiv. Ce bouton aura également un rayon de bordure de 5 pixels. Puis nous allons configurer le design du bouton pour le survol. Lors du passage de la souris, la couleur du CTA va donc changer pour devenir jaune.

Après avoir réalisé ce premier bouton, nous pouvons donc faire la même chose pour le deuxième bouton, qui cette fois-ci aura une couleur d’arrière-plan qui changera lors du passage de la souris

Elements Elementor Formulaire

Après nos éléments de boutons, venez créer le formulaire d’ajout à la newsletter. Pour cela, nous allons créer une section où nous ajouterons un élément de formulaire. Pour l’instant, notre formulaire ne ressemble pas à grand-chose. Donc, tout d’abord, configurons les champs de notre formulaire. Pour cela, dans la partie champs du formulaire, ajoutons un champ nom et un champ email que nous rendrons obligatoires. Grâce à Elementor, vous avez la possibilité d’ajouter les champs que vous souhaitez et de configurer leur largeur en fonction de vos besoins.

Ensuite, dans la section des actions après envoi, vous pouvez configurer ce qu’il se passera après que votre visiteur ait ajouté ces renseignements. Vous pouvez, par exemple, collecter les envois sur votre backoffice Elementor, ou encore recevoir le formulaire complété sur votre adresse email, ou encore, si vous avez un compte Mailchimp, choisir d’alimenter une audience.

Pour l’exemple, nous choisirons simplement de collecter les envois, mais également de recevoir le formulaire complété par email.

Finalement, dans la partie Email, vous pouvez configurer les paramètres de l’email que vous recevrez lorsque le formulaire sera complété. Vous pouvez donc renseigner le mail qui recevrez le formulaire, ainsi que l’objet du mail et son contenu.

Après avoir configuré votre formulaire, vous pouvez maintenant vous attaquer au design de ce dernier. Pour cela, dans la partie style, nous allons configurer les couleurs des champs, ainsi que du bouton du formulaire, et finalement, les différents messages de succès ou d’erreur de soumission du formulaire.

Et voilà comment vous lancer dans la création de votre CTA sur Elementor.