Sélectionner une page


La solution la plus évidente n’est pas toujours la meilleure.

Bonne nouvelle, Divi propose plusieurs moyens de résoudre un problème. C’est ce qui le rend si charmant et amusant: si vous aimez résoudre des énigmes, vous vous amuserez beaucoup.

Problème du jour: Comment créer un bouton bicolore, avec un espacement vertical et une icône pour indiquer clairement l’appel à l’action.

Nous souhaitons recevoir:

bouton Divi bicolore

Tutoriel sur la création d’un bouton bicolore avec Divi

D’abord nous allons Ajouter un module « Résumé » (également connu sous le nom de Blurb en anglais) avec les paramètres suivants:

  • Utilisez des symboles: Oui
  • Sélectionnez le symbole +
  • Positionnez l’image à gauche du texte

Ensuite, vous devez créer la séparation verticale à gauche du bouton. Pour ce faire, nous allons Utilisez le fond dégradé Comme indiqué ci-dessous. L’astuce consiste à définir une position de départ plus élevée que la position finale pour obtenir une séparation nette. Une direction de gradient de 90 ° crée une séparation verticale.

Enfin, vous devez ajouter du code CSS sur l’onglet avancé et dans le champ « Argument image » comme indiqué ci-dessous. Ce code vous permet de déplacer l’icône de présentation pour la centrer manuellement:

bas: 5px;
gauche: 10px;
Position: relative;

Vous pouvez modifier la valeur des propriétés « Bas » et « Gauche » pour positionner le symbole comme vous le souhaitez.



Source link

Recent Posts