Personnaliser Panier

Bonjour,

Nouvel utilisateur Hikashop, je travaille sur un site Joomla 2.5.
J'ai vu sur un autre post du forum qu'il est possible de personnaliser le bouton "Ajouter au Panier" avec le code CSS suivant :

.hikashop_cart_module{
background-image:url('my_website.com/my_image.png');
background-repeat:no-repeat;
background-position:right top;
}

J'ai ajouté donc ce code sur le CSS correspondant à la partie publique en mettant l'adresse complète avec les http:// de mon image, mais aucune modification sur le front (j'ai bien entendu enregistré la modification et vérifié que le lien est correct)

Voila, si quelqu'un a une petite idée je suis tout ouïe.

Cordialement

Bonsoir,

Pourriez vous essayer avec ce CSS ?

avec add_cart.png votre image.

Bonsoir,

Merci de votre réponse.

Je viens de tester votre proposition, en mettant l'URL en entier j'arrive à afficher mon bouton, mais il s'affiche par dessus du bouton orange d'origine "ajouter au panier"

Cordialement,

Pourriez vous fournir un lien pour que nous puissions voir cela ?
Cela doit venir de votre template...

Bien sur, pour le moment le site est en cours de réalisation, j'ai installé la version "Starter" pour faire les premiers test, à partir de juin il passera en production avec la version "Business"

pikandroll.fr/new2/pik-and-roll-shop/product/1-miami-bmx-black-72

Merci de votre aide

Par contre le lien ne s'affiche pas sur mon post alors que quand je l'édite il est bien visible (?)

Voila, je viens de réussir à afficher le lien. :blink:

Il va falloir que vous ajoutiez ce code CSS dans le CSS de votre template pour désactiver le bouton du template:

.hikashop_product_stock .art-button-wrapper .art-button-l,.hikashop_product_stock .art-button-wrapper .art-button-r {
background-image: none !important;
}

Un grand merci à vous deux pour votre aide, je viens d'appliquer votre proposition sur mon template, et ça marche, par contre il y a toujours le mot "ajouter " par dessus, est il possible de l’enlever ?

Et une dernière petite question, est-il possible de modifier la taille de l'emplacement ou le bouton s'affiche ? je lui est donné une taille de 50x50 pixels et il apparait coupé.

En espérant ne pas abuser de votre patience. :whistle:


Cordialement,

Bonjour,

Je vous recommende d'apprendre le CSS et l'utilisation de firebug si vous souhaitez modifier les styles de votre site dans le futur:
www.tutorial9.net/tutorials/web-tutorial...opment-with-firebug/
Nous faisons ici le support d'HikaShop, pas la personnalisation des styles de votre site/template.

Il suffit de faire ainsi:

.hikashop_product_quantity_main .hikashop_product_stock .button {
height: 50px;
color: transparent;
}

Bonjour Nicolas,

Merci de votre réponse.

En fait je me suis mal exprimé, je ne suis surement pas un expert en CSS, mais j'ai me débrouille suffisamment pour l'adapter à mes besoins, le souci est que même en définissant 50px de hauteur, ceci ne se répercute pas sur mon affichage. Voici le code CSS tel qu'il est :

.hikashop_product_quantity_main .hikashop_product_stock .button {
background-image: url( pikandroll.fr/new2/images/Images-Boutique/Panier/panier2.png );
background-repeat:no-repeat;
background-position:right top;
width: 50px;
height: 50px;
}

Je vais ajouter l'option "color: transparent;" à laquelle je n'avais pas pensé.

Il s'agit peut être du la taille du block en non pas de la taille de l'image ?


Je vous remercie de votre aide, je vais trouver la dernier modif à faire.

Cordialement,

C'est encore à cause du CSS de votre template.
Le span autour du bouton force la hauteur à 30px.
Il faut désactiver cela.

Avec par exemple ce CSS:
.hikashop_product_quantity_main .hikashop_product_stock .art-button-wrapper{
height: 50px !important;
}

Merci c'est impeccable.

Désolé, j'ai parlé trop vite, c'était impeccable avec la version starter, mais dès que j'ai installé la version Business l'affichage n'est plus correct même en ajoutant les corrections que fonctionnaient avec la version gratuite .

:blush:

J'ai fait tour avec Firebug, mais rien ne ressemble à ce que je vois derrière mon bouton shopping

"pikandroll.fr/new2/pik-and-roll-shop/product/1-miami-bmx-black-72"

Sur la version Starter l'affichage était correct avec le code suivant :

.hikashop_product_quantity_main .hikashop_product_stock .button {
background-image: url(pikandroll.fr/new2/images/Images-Boutique/Panier/panier2.png);
background-repeat:no-repeat;
background-position:right top;
width: 50px;
height: 50px;
}

Mais ça ne marche pas sur la version Business.

Je ne vois pas ce code mais celui ci dans votre fichier CSS pikandroll.fr/new2/media/com_hikashop/css/frontend_custom.css : Si vous utilisiez le code que vous avez mis dans votre message, cela devrait mieux fonctionner

Merci de votre réponse,

Effectivement, le code n'y était pas sur le fichier CSS.

Je viens de l'ajouter, mais il affiche toujours le bouton à moitié coupé et derrière celui-ci une partie du bouton de mon template que je voudrais faire disparaitre.

:sick:

Merci de rajouter le CSS que je vous avez indiqué auparavant:

.hikashop_product_quantity_main .hikashop_product_stock .art-button-wrapper{
height: 50px !important;
}
.hikashop_product_stock .art-button-wrapper .art-button-l,.hikashop_product_stock .art-button-wrapper .art-button-r {
background-image: none !important;
}

Merci pour votre patience, cette fois-ci c'est bon.

Cordialement,

Bonsoir,

Je viens vers vous pour deux petits soucis,

1er : Je n'arrive pas à afficher le détail du panier dans le mini panier, il est seulement inscrit 1,2,3 produits mais il n'est pas mentionné de quels produits il s'agit.

2eme : Je n'arrive pas à personnaliser le panier comme dans la version de démo d'hikashop, mon panier est "plat" sans décors, comment puis je l'améliorer avec du css?

Merci beacoup par avance

Mr Azzi

Bonjour,

1 - Le mini panier est justement fait pour être mini-maliste.
Si vous désactivez l'option "mini", il sera plus comme ce que vous cherchez.

2 - je vous recommande de regarder la configuration du module dans le site de démonstration (vous trouverez des options comme "suffix css" dans la partie module joomla) et également le côté CSS du site de démonstration.
www.hikashop.com/support/support/documen...ize-the-display.html

Si vous souhaitez ajouter des images comme dans notre site de démonstration, il faudra les créer pour votre template.
Il est également possible d'utiliser un template compatible HikaShop (fournissant ce genre d'intégration) ou alors vous pouvez utiliser notre pack de style HikaShop (qui est donc du style et pas un template).

Cordialement,