Bonsoir,
Je l'ai fait il y a quelques jours mais pas le temps de le mettre dans un papier cadeau, donc pour t'éviter de chercher( et au cas où vous trouveriez des améliorations)
Transformer les liens "ajouter au panier" ( par exemple dans le fichier produit.html ) comme cela :
( remplacer monsite.com par votre nom de domaine )
<p><a class="acheter" href="http://monsite.com/thelia-svn/?fond=ajout_panier&id_produit=#PRODUIT_ID" onclick="javascript:ajout_panier('#REF'); return false;" rel="superbox[iframe][700x500]"><span><span>::ajouterpanier::</span></span></a></p>
Dans produit.html, insérer le javascript (la fonction ajout_panier )qui suit après le code que vous avez déjà pour la superbox
<script type="text/javascript">
$(function(){
$.superbox.settings = {
overlayOpacity: .8,
closeTxt: "::fermer::",
loadTxt: "::chargement::...",
nextTxt: "::imgsuiv::",
prevTxt: "::imgprec::"
};
$.superbox();
});
function ajout_panier($ref,$prix,$titre){
//Ajout du produit
$.ajax({
type: "GET",
url: "index.php?fond=panier",
data: { action : "ajouter" , ref : $ref},
success: function(html){ // this happen after we get result
var obj = null;
function checkHover() {
if (obj) {
obj.find('ul').fadeOut('fast');
} //if
} //checkHover
$('#contenuPanier > li').live('hover', function() {
if (obj) {
obj.find('ul').slideUp('fast');
obj = null;
} //if
$(this).find('ul').slideDown('fast');
}, function() {
obj = $(this);
setTimeout(
"checkHover()",
0); // si vous souhaitez retarder la disparition, c'est ici
});
}
})
$("#monPanier").load("index.php?fond=petit_panier");
};
</script>
Créer le fichier ajout_panier.html dans template ( c'est le template du contenu de la popup qui va s'ouvrir, vous pouvez la modifier comme un template normal, ajout de boucles...):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
#INCLURE "template/meta_produit.html"
</head>
<body>
<div id="contenu">
<div class="blocProduit">
<THELIA_PROD type="PRODUIT" id="#PRODUIT_ID">
<h2>#TITRE</h2>
<div class="blocDImages">
<THELIA_img type="IMAGE" num="1" produit="#ID" largeur="342">
<THELIA_ZOOM type="IMAGE" num="1" id="#ID" largeur="500">
<a href="#IMAGE" rel="superbox[gallery][my_gallery]" class="grandeImage">
</THELIA_ZOOM>
<img src="#IMAGE" alt="#PRODTITRE" title="#PRODTITRE"/>
</a>
</THELIA_img>
</div>
<div class="introProduit">
<div class="chapo">#CHAPO</div>
#PROMO[<span class="prixProduit">#PRIX2 €</span> ::changprix:: #PRIX €][<span class="prixProduit">#PRIX €</span>]
</div>
<div class="description">#DESCRIPTION</div>
</THELIA_PROD>
</div>
</div>
</body>
</html>
En faisant ce qu'il y a au dessus, les produits sont bien ajoutés au panier sans rafraichir la page, mais pour avoir le panier dans le header qui s'actualise il faut ajouter ce fichier dans le dossier template.
Fichier petit_panier.html
<h3>::achats::</h3>
<ul id="contenuPanier">
<li>
<T_PANIER>
<a href="#URLPANIER" class="panier">::contient:: #PANIER_NBART ::article::</a>
<THELIA_PANIER type="PANIER">
</THELIA_PANIER>
<ul class="listeProduits">
<THELIA_panier type="PANIER">
<li><a href="#URLPANIER"><span class="nomArticle">#TITRE</span><span class="quantite">x #QUANTITE</span><span class="total">#TOTAL €</span></a></li>
</THELIA_panier>
<li><a href="#URLPANIER" class="totalCommande"><span class="titreTotal">::total:: :</span><span class="total">#PANIER_TOTAL €</span></a></li>
</ul>
</T_PANIER>
::paniervide::
<//T_PANIER>
</li>
</ul>
Cela fait quelques jours que j'ai fait ça, j'espère pas avoir oublié un bout de code.
Nicolas.
Last edited by boyquotes (23-09-2011 23:28:20)