L’objectif de ce tutoriel est de voir comment créer un bouton d’appel à l’action dans le menu de Divi. Mettre en évidence un bouton qui incite au clic vous permettra d’augmenter le taux de conversion auprès de vos visiteurs. Ce tutoriel est simple et rapide, il se réalise en deux étapes.
Première étape : le menu
Rendez-vous dans le menu via « apparence -> menu » puis ajouter une classe CSS. Dans notre exemple, la classe est nommée btn-appel-action. Si le champ Classes CSS n’est pas affiché, n’oubliez pas de cocher la case Classes CSS dans les options de l’écran.
La première étape est terminée, ce n’est ni plus ni moins que de la manipulation du menu dans WordPress.
Nous pouvons passer à la deuxième étape.
Deuxième étape : le code CSS
Dans cette deuxième étape, nous allons ajouter le code CSS. Vous pouvez l’ajouter soit dans votre feuille de style de votre thème enfant, soit dans les options du thème Divi.
/* Bouton appel à l'action */
.btn-appel-action a {
background-color: #E51D67;
border-radius: 5px;
padding:10px 10px !important;
color: #fff;
}
Il ne reste plus qu’à changer les valeurs de background-color et color en fonction de votre charte graphique.
Si vous souhaitez un bouton avec des coins plus arrondis, il suffit d’augmenter la valeur de border-radius.