Remarque : même si nos guides les plus populaires ont été traduits en français, certains guides sont uniquement disponibles en anglais.

Personnaliser les boutons

Utilisez les styles du site pour modifier l’apparence des boutons de votre site. Vous pouvez changer la couleur, la forme et le style du texte, ce qui est un excellent moyen de créer des appels à l’action en concordance avec le style général de votre site. Pour vous aider à assurer un design uniforme sur tout votre site, les modifications de style apportées aux boutons sont appliquées à la plupart des boutons de votre site.

Avant de commencer

La méthode pour personnaliser les boutons de votre site dépend de la version de votre site.

Consultez Personnaliser les boutons de site pour modifier les boutons suivants :

  • Boutons Ajouter au panier
  • Les Blocs Bouton
  • Boutons des blocs Don
  • Boutons Envoyer des blocs Formulaire
  • Bouton du bloc d’inscription des membres

Consultez Personnaliser les autres boutons pour modifier les boutons suivants :

  • Boutons des blocs Newsletter
  • Icône Panier

Consultez Personnaliser les boutons de site pour modifier les boutons suivants :

  • Boutons Ajouter au panier
  • Les Blocs Bouton
  • Boutons des blocs Don
  • Boutons Envoyer des blocs Formulaire
  • Boutons des blocs Newsletter
  • Bouton du bloc d’inscription des membres

Consultez Personnaliser les autres boutons pour modifier les boutons suivants :

  • Boutons de la page de couverture
  • Blocs Image
  • Icône Panier
  • Boutons de bannière ou de navigation spécifiques au template

Pour personnaliser lʼicône du panier, consultez lʼarticle Affichage de lʼicône Panier. Si votre panier nʼapparaît pas, consultez nos conseils de dépannage.

Personnaliser les boutons de site

La méthode pour personnaliser les boutons à lʼéchelle du site dépend de la version de votre site.

Pour personnaliser l’aspect des boutons de votre site, ouvrez le panneau Styles du site, puis cliquez sur Boutons. Il peut arriver que certains ajustements n’affectent pas tous les boutons de votre site. Par exemple, pour conserver la disposition du bloc Newsletter, l’ajustement Marge intérieure n’affectera pas les boutons du bloc Newsletter.

Les boutons reprennent les couleurs et polices utilisées sur votre site.

Pour modifier le style de la plupart des boutons de votre site : 

  1. Dans le panneau Pages, sélectionnez une page sur laquelle se trouvent des boutons.
  2. Dans le Menu principal, cliquez sur Design, puis sur Styles du site.
  3. Faites défiler l’écran vers le bas jusqu’à Boutons. Dans les blocs Bouton, la section s’appelle Bloc Bouton (petit), (moyen) ou (grand).

Utilisez les ajustements suivants :

  • Style de bouton : choisissez Gras ,Contour ouEn relief.
  • Forme du bouton : choisissez entre carré, arrondi ou rond.
  • Couleur du bouton : changez la couleur d’arrière-plan du bouton.
  • Couleur du texte du bouton : changez la couleur du texte.
  • Police du bouton : changez la police. Vous ne pouvez pas changer la taille du texte des boutons des blocs Formulaire et des blocs Newsletter.
Astuce : pour le style Contour, le texte s’affiche automatiquement en noir ou en blanc en cas de survol, selon la valeur définie pour Couleur du bouton.

Personnaliser les autres boutons

La méthode pour personnaliser les autres boutons de site dépend de la version de votre site.

Les Blocs Boutons et les blocs avec des boutons intégrés, comme les Blocs Newsletter, disposent d'options de style supplémentaires :

  1. Cliquez sur l'option Modifier correspondant à cette page.
  2. Cliquez sur le bloc, puis sur lʼicône crayon pour modifier le texte et lʼalignement. Vous pouvez également ajuster la taille des blocs Bouton.

Quelques types de boutons ont des options de style différentes :

Modifier le texte du bouton

Pour créer vos propres appels à l’action, vous pouvez modifier le texte par défaut de la plupart des boutons de votre site.

Bloc Formulaire et bloc Newsletter

Pour modifier le bouton Soumettre sur les blocs Formulaire et Newsletter :

  1. Double-cliquez sur le bloc pour ouvrir l'éditeur de blocs.
  2. Dans l'onglet Contenu, modifiez le texte dans le champ de texte du Bouton.

Bouton Ajouter au panier

Pour modifier le bouton Ajouter au panier d'un produit :

  1. Double-cliquez sur le produit pour ouvrir l'éditeur de produits.
  2. Cliquez sur Bouton personnalisé, puis activez l'option Libellé de bouton personnalisé.
  3. Modifiez le texte dans le champ Libellé.
  4. Cliquez sur Appliquer.

Bloc Bouton

Pour modifier le texte d'un bloc Bouton, procédez comme suit :

  1. Cliquez sur Modifier sur la page, puis cliquez sur le bouton pour modifier directement le texte.
  2. Vous pouvez également ouvrir l'éditeur de blocs et modifier le champ Texte.

Boutons de navigation (version 7.0 uniquement)

Dans les familles de templates Brine et Bedford, vous pouvez modifier le texte du bouton de navigation dans l’en-tête en changeant le titre de la navigation.

Couleurs de remplacement du bouton

Le fonctionnement des couleurs de boutons diffère selon la version de votre site.

Une couleur alternative apparaît sur les boutons lorsque vous les survolez, selon le style du bouton.

Pour définir le style du bouton, personnalisez les boutons du site, puis cliquez sur Styles. Dans le menu déroulant, sélectionnez Gras ou Contour.

  • Si vous sélectionnez Gras, la couleur d’arrière-plan du bouton reste la même lorsque vous le survolez.
  • Si vous sélectionnez Contour, la couleur d’arrière-plan alternative s’affiche lors du survol. La couleur alternative dépend des paramètres de couleur de votre site.

Selon le template choisi et la configuration de votre site, un ajustement Alternatif ou (Superposition) peut apparaître dans la section des styles du site. Ces options apparaissent pour les boutons qui sont affichés par-dessus :

  • des images d’arrière-plan (bannières de section d’index, par exemple) ;
  • des zones d’arrière-plan avec des couleurs différentes de l’arrière-plan principal (pieds de page standard ou secondaires, par exemple).

Utilisez cette option pour que les boutons soient plus visibles sur ces arrière-plans uniques. Selon le style de votre bouton, d’autres ajustements Alternatif et (Superposition) peuvent également être disponibles.

Cet article vous a-t-il été utile ?
Utilisateurs qui ont trouvé cela utile : 45 sur 448
Personnaliser les boutons