Beaucoup d'entre vous nous font la remarque, le bouton "Achetez" tel qu'il est par défaut ne convient par forcemment au thème de votre boutique ; voici donc quelques pistes pour vous aider dans sa personnalisation.

Allez dans la rubrique "préférences" > "personnalisez votre thème" > "Configuration du thème", puis dans le champ "Feuille de style". L'exemple qui suit vous montre comment créer un bouton vert.

Pour changer sa couleur :

.productInList .buynow a:link {background:#a7e01a; color:#374a08; padding:2px 20px 2px 20px;}
.productInList .buynow a:visited {background:#a7e01a; color:#374a08; padding:2px 20px 2px 20px;}
.productInList .buynow a:hover {background:#a7e01a; color:#374a08; padding:2px 20px 2px 20px;}


Voici le résultat :


Pour lui ajouter une image de fond :

.productInList .buynow a:link {background:transparent;color:#374a08; padding:0 20px 0 20px;}

.productInList .buynow a:visited {background:transparent;color:#374a08; padding:0 20px 0 20px;}
.productInList .buynow a:hover {background:transparent;color:#374a08; padding:0 20px 0 20px;}div .buynow {height:26px;background:transparent url(/pub/background-buy.jpg) no-repeat center center;} 

Notez bien qu'il faut au préalable envoyer l'image "background-buy.jpg" (qui est le fond du bouton sans le texte) dans votre Gestionnaire d'images.

Voici le résultat :



Voilà, vous savez désormais comment changer l'apparence de votre bouton fétiche !

EDIT : pour changer le bouton dans les catégories, vous devez modifier les paramètres suivants :

.productInList .buynow a:link {background:#a7e01a; color:#374a08; padding:2px 20px 2px 20px;}
.productInList .buynow a:visited {background:#a7e01a; color:#374a08; padding:2px 20px 2px 20px;}
.productInList .buynow a:hover {background:#a7e01a; color:#374a08; padding:2px 20px 2px 20px;}

.productDetail .blocprice td.buynow  a:link {background:#a7e01a; color:#374a08; padding:2px 20px 2px 20px;}
.productDetail .blocprice td.buynow  a:visited {background:#a7e01a; color:#374a08; padding:2px 20px 2px 20px;}
.productDetail .blocprice td.buynow  a:hover {background:#a7e01a; color:#374a08; padding:2px 20px 2px 20px;}

.productDetail .blocprice td {background:#ffffff;border-color:#ffffff}

( Dans cet exemple, le tableau qui encadre le bouton a des bords et un fond blancs )