Cet article explique comment personnaliser l'apparence du bouton « Personnaliser le design » dans ta boutique Shopify, ainsi que comment afficher ou masquer les boutons « Ajouter au panier » et « Acheter maintenant » pour les produits disponibles à la personnalisation.

Tu as deux options pour styliser le bouton « Personnaliser le design » dans ta boutique Shopify : utiliser Gelato+ ou le CSS.

Si tu es abonné Gelato+ et que tu utilises l'un des thèmes suivants – Dawn, Debut, Studio, Craft ou Simple – tu peux personnaliser ton bouton directement depuis ton tableau de bord Gelato. Voici comment :

Depuis ici, tu peux modifier le texte, la couleur de fond, la couleur de bordure et la couleur du texte du bouton « Personnaliser le design ». Tu peux également personnaliser les boutons « Ajouter au panier » et « Retour aux achats » qui apparaissent dans les coins supérieurs gauche et droit du Design Editor.

Si tu n'as pas d'abonnement Gelato+, tu peux personnaliser le bouton « Personnaliser le design » de Shopify en utilisant du CSS. Le bouton peut être référencé dans le CSS via le sélecteur d'ID #ge-personalize.

Tu peux trouver plus d'informations sur comment ajouter du CSS personnalisé ici. Consulte la documentation de ton thème Shopify ou contacte le développeur de ton thème pour plus de détails sur la façon de procéder.

Par exemple, tu peux changer la couleur du bouton en noir en ajoutant le CSS suivant à ton thème :

Tu peux aussi personnaliser le bouton « Ajouter au panier » en utilisant du CSS. Le bouton peut être référencé dans le CSS via le sélecteur d'ID #ge-add-to-cart. Par exemple, tu peux modifier la largeur, la couleur et la taille de la police du bouton « Ajouter au panier » avec le CSS suivant :

Tu peux choisir d'afficher ou de masquer les boutons « Ajouter au panier » et « Acheter maintenant » sur les pages de produits qui permettent la personnalisation. Ce paramètre se trouve dans la section Personalization de ton tableau de bord Gelato, comme décrit ci-dessus.