Jump to content

[ RESOLU ] Le curseur ajouter au panier s'est modifié.

BoutikShop69
 Share

Recommended Posts

BoutikShop69 Newbie

BoutikShop69

Posted
Posted (edited)

Bonjour

 

Sur mes pages produits, le curseur sur le bouton ajouter au panier s'est modifié, au lieu d'une main qui indique naturellement que l'image est cliquable, c'est une flèche : par défaut cela indique que l'image est non cliquable.  :wacko:

 

Comment faire pour réparer manuellement l'appel du lien qui s'est cassé ?

 

Voir une {page produit}.

 

Le site tourne sous prestashop 1.4.4.0

 

En vous remerciant par avance pour votre aide.  :)

 

Cordialement.

Edited by shooping (see edit history)
Link to comment
Share on other sites
BoutikShop69 Newbie

BoutikShop69

Posted
  • Author
Posted (edited)

Bonjour Yopixel,

 

Merci pour votre réponse, j'essaierai.

 

Sinon c'est vers quelle ligne que je dois l'ajouter exactement ?

 

Et reviendrai donner le résultat.  :)

 

C'est en essayant une autre méthode pour les codes sur les réseaux sociaux, que j'ai cassé cet appel de lien pour le bouton ajouter au panier sur la page produit. 

 

Cordialement.

Edited by shooping (see edit history)
Link to comment
Share on other sites
BoutikShop69 Newbie

BoutikShop69

Posted
  • Author
Posted

Bonjour, ajoutez : input.addcartpanier:hover{cursor: pointer}; dans votre global.css

(Essayez d’alléger cette page, très longue à charger = cause de plantage).

 

Bonjour

 

J'aimerai avoir une précision supplémentaire par rapport à votre indication, car j'ai ceci dans mon global css : 

 

[ /* global button */

input.button_mini, input.button_small, input.button, input.button_large,
input.button_mini_disabled, input.button_small_disabled, input.button_disabled, input.button_large_disabled,
input.exclusive_mini, input.exclusive_small, input.exclusive, input.exclusive_large,
input.exclusive_mini_disabled, input.exclusive_small_disabled, input.exclusive_disabled, input.exclusive_large_disabled,
a.button_mini, a.button_small, a.button, a.button_large,
a.exclusive_mini, a.exclusive_small, a.exclusive, a.exclusive_large,
span.button_mini, span.button_small, span.button, span.button_large,
span.exclusive_mini, span.exclusive_small, span.exclusive, span.exclusive_large, span.exclusive_large_disabled {
background-repeat: no-repeat;
background-position: top left;
border: none;
color: black!important;
font-weight: bold;
font-size: 10px!important;
text-align: center;
text-decoration: none!important;
cursor: pointer;
display: block;
line-height: 19px;
height: 18px;
}
 
/* input button */
input.button_mini, input.button_small, input.button, input.button_large,
input.button_mini_disabled, input.button_small_disabled, input.button_disabled, input.button_large_disabled,
input.exclusive_mini, input.exclusive_small, input.exclusive, input.exclusive_large,
input.exclusive_mini_disabled, input.exclusive_small_disabled, input.exclusive_disabled, input.exclusive_large_disabled {
padding-bottom: 2px
}
 
/* disabled button */
input.button_mini_disabled, input.button_small_disabled, input.button_disabled, input.button_large_disabled,
input.exclusive_mini_disabled, input.exclusive_small_disabled, input.exclusive_disabled, input.exclusive_large_disabled,
span.button_mini, span.button_small, span.button, span.button_large,
span.exclusive_mini, span.exclusive_small, span.exclusive, span.exclusive_large, span.exclusive_large_disabled {
background-position: left -36px;
        color: #888!important
}
 
/* exclusive button */
input.exclusive_mini, input.exclusive_small, input.exclusive, input.exclusive_large,
input.exclusive_mini_disabled, input.exclusive_small_disabled, input.exclusive_disabled, input.exclusive_large_disabled,
a.exclusive_mini, a.exclusive_small, a.exclusive, a.exclusive_large,
span.exclusive_mini, span.exclusive_small, span.exclusive, span.exclusive_large, span.exclusive_large_disabled {
color: white!important
}
 
/* exclusive disabled button */
input.exclusive_mini_disabled, input.exclusive_small_disabled, input.exclusive_disabled, input.exclusive_large_disabled, span.exclusive_mini, span.exclusive_small, span.exclusive, span.exclusive_large {
color: #488c40!important
}
 
/* hover button */
input.button_mini:hover, input.button_small:hover, input.button:hover, input.button_large:hover,
input.exclusive_mini:hover, input.exclusive_small:hover, input.exclusive:hover, input.exclusive_large:hover,
a.button_mini:hover, a.button_small:hover, a.button:hover, a.button_large:hover,
a.exclusive_mini:hover, a.exclusive_small:hover, a.exclusive:hover, a.exclusive_large:hover {
background-position: left -18px
}
 
/* exclusive hover button */
input.exclusive_mini:hover, input.exclusive_small:hover, input.exclusive:hover, input.exclusive_large:hover, a.exclusive_mini:hover, a.exclusive_small:hover, a.exclusive:hover, a.exclusive_large:hover {
color: white!important
}
 
/* classic buttons */
input.button_mini, input.button_mini_disabled, input.exclusive_mini, input.exclusive_mini_disabled, a.button_mini, a.exclusive_mini, span.button_mini, span.exclusive_mini {
width: 30px;
background-image: url('../img/button-mini.png')
}
input.button_small, input.button_small_disabled, input.exclusive_small, input.exclusive_small_disabled, a.button_small, a.exclusive_small, span.button_small, span.exclusive_small {
width: 60px;
background-image: url('../img/button-small.png')
}
input.button, input.button_disabled, input.exclusive, input.exclusive_disabled, a.button, a.exclusive, span.button, span.exclusive {
width: 140px;
        height: 18px;
        background-image: url('../img/button-medium.png')
}
input.button_large, input.button_large_disabled, input.exclusive_large, input.exclusive_large_disabled, a.button_large, a.exclusive_large, span.button_large, span.exclusive_large, span.exclusive_large_disabled {
width: 180px;
background-image: url('../img/button-large.png')
}
 
/* exclusive button */
input.exclusive, input.exclusive_disabled, a.exclusive, span.exclusive { background-image: url('../img/button-medium_exclusive.png') }
input.exclusive_mini, input.exclusive_mini_disabled, a.exclusive_mini, span.exclusive_mini { background-image: url('../img/button-mini_exclusive.gif') }
input.exclusive_small, input.exclusive_small_disabled, a.exclusive_small, span.exclusive_small { background-image: url('../img/button-small_exclusive.gif') }
input.exclusive_large, input.exclusive_large_disabled, a.exclusive_large, span.exclusive_large, span.exclusive_large_disabled { background-image: url('../img/button-large_exclusive.gif') } ]
 
Dans mon fichier product.css, j'avais mis ceci pour le bouton ajouter au panier : 
 
[#primary_block p.buttons_bottom_block input.addcartpanier, input.addcartpanier_disabled, a.addcartpanier, span.addcartpanier {
        background-image: url("../img/addcartpanier.png");
        background-position: center center;
        background-color: transparent;
        border: none;
        margin-left: 11px;
        margin-top: 0;
        margin-bottom: -1px;
        color: #ffffff!important;
        font-size: 13px!important;
        text-align: center!important; 
        padding-top: 15px!important;
        font-weight: bold;
        text-transform: uppercase;
        width: 180px!important;
        height: 74px!important;
        min-height: 74px!important;
        white-space: nowrap;
}
#primary_block p.buttons_bottom_block input.addcartpanier:hover, input.addcartpanier_disabled:hover, a.addcartpanier:hover, span.addcartpanier:hover {
        background-image: url("../img/addcarthover.png");
        background-position: center center;
        background-color: transparent;
        border: none;
        margin-left: 11px;
        margin-top: 0;
        margin-bottom: -1px;
        color: #ffffff!important;
        font-size: 13px!important;
        text-align: center!important; 
        padding-top: 15px!important;
        font-weight: bold;
        text-transform: uppercase;
        width: 180px!important;
        height: 74px!important;
        min-height: 74px!important;
        white-space: nowrap;]
 
En vous remerciant pour votre aide.
 
Cordialement.
Link to comment
Share on other sites
BoutikShop69 Newbie

BoutikShop69

Posted
  • Author
Posted

Ajoutez-le au début de votre product.css, avec les autres propriétés.

 

Bonjour

 

Merci pour votre réponse. 

 

C'est donc sur cette ligne que je dois l'ajouter ? : 

 

#primary_block p.buttons_bottom_block input.addcartpanier:hover, input.addcartpanier_disabled:hover, a.addcartpanier:hover, span.addcartpanier:hover {

 

Cordialement.

Link to comment
Share on other sites
BoutikShop69 Newbie

BoutikShop69

Posted
  • Author
Posted (edited)

Rebonjour,  :)

 

J'ai donc modifié la ligne : #primary_block p.buttons_bottom_block input.addcartpanier:hover, 

input.addcartpanier:hover{cursor: pointer}, input.addcartpanier_disabled:hover, a.addcartpanier:hover, span.addcartpanier:hover {

 

Ca fonctionne.  :D

 

J'ai récupéré le curseur main, mais maintenant l'image reste fixe, la fonction hover qui montre une légère différence de teinte entre les deux états du bouton, ne se fait plus.

 

Cela dit l'essentiel reste tout de même : de montrer que l'image du bouton ajouter au panier est cliquable.

 

Encore merci pour l'aide.  ;)

 

Cordialement. 

Edited by shooping (see edit history)
Link to comment
Share on other sites
BoutikShop69 Newbie

BoutikShop69

Posted
  • Author
Posted

C'est parce que vous avez au passage supprimé les propriétés hover. Par exemple :hover{cursor: pointer; background:red} vous donnera un bouton rouge au survol.

 

Il faudrait donc que j'ajoute : background:rose ? Sachant que c'est la couleur du fond de l'image bouton.

 

Cordialement.

Link to comment
Share on other sites
BoutikShop69 Newbie

BoutikShop69

Posted
  • Author
Posted

Il faudrait donc que j'ajoute : background:rose ? Sachant que c'est la couleur du fond de l'image bouton.

 

Cordialement.

 

Je viens d'essayer, ça ne fonctionne pas. L'image reste fixe.

Non, remettez les anciennes propriétés du hover, comme ça vous aurez l'apparence initiale avant la modif du curseur.

 

Je ne vous suis pas. J'ai bien placé l'ajout au bon endroit ? Que dois-je modifier et comment ?

Link to comment
Share on other sites
YopixelAE Newbie

YopixelAE

Posted
Posted

Votre code doit ressembler à ça :

#primary_block p.buttons_bottom_block input.addcartpanier:hover, input.addcartpanier_disabled:hover, a.addcartpanier:hover, span.addcartpanier:hover {
cursor:pointer;
        background-image: url("../img/addcarthover.png");
        background-position: center center;
        background-color: transparent;
+ toutes les autres propriétés initiales
}
  • Like 1
Link to comment
Share on other sites
BoutikShop69 Newbie

BoutikShop69

Posted
  • Author
Posted

 

Votre code doit ressembler à ça :

#primary_block p.buttons_bottom_block input.addcartpanier:hover, input.addcartpanier_disabled:hover, a.addcartpanier:hover, span.addcartpanier:hover {
cursor:pointer;
        background-image: url("../img/addcarthover.png");
        background-position: center center;
        background-color: transparent;
+ toutes les autres propriétés initiales
}

 

 

C'est gagné ! Youpi !  ^_^

 

Je passe le post en mode résolu.

 

Encore merci pour votre aide.

 

Cordialement.

  • Like 1
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share
Go to topic listing
×
×
  • Create New...