Dans un récent commentaire, on nous demandait comment il était possible de diviser la confirmation de commande en 3 étapes sous WP e-Commerce. À savoir, séparer la calcul des frais de port, les informations de livraison et le paiement.
Je vais vous montrer comment faire en partant d’une installation vierge et en se basant sur TwentyEleven. Mais avant toute chose, comme il s’agit ici de mon premier billet, permettez moi de me présenter. Je m’appelle Goran, cela fait trois ans que je développe des sites grâce à WP e-Commerce, et je fais parti de l’équipe de développement d’Inside da WeB. Voila pour les présentations.
Avant les hostilités
Avant de voir comment faire pour découper l’étape de confirmation de commande en plusieurs étapes, parlons un peu de notre installation. Afin d’être le plus univers possible, je suis parti de la dernière version de WordPress (3.4.2 à ce jour), de la dernière version de WPEC (3.8.8.5) et du thème TwentyEleven.
Pour pouvoir suivre ce petit guide, il vous faut donc :
- une installation fraiche de WordPress,
- installer la dernière version de WP e-Commerce
Après avoir tout installé, il faut maintenant configurer les frais de port (j’utilise pour ma part le mode flat rate), les taxes, les méthodes de paiement et tout ce qui vous semblera approprié de configurer avant de vous lancer dans le découpage en petit morceau du processus de confirmation de commande avec WPEC. Je ne rentrerais pas dans les détails relatifs à ces configuration, référez-vous à notre guide WP e-Commerce pour ça.
Pour que nous puissions être en mesure de voir le processus de confirmation de commande, faut-il encore avoir au moins un produit dans sa boutique. Je le dis, on sait jamais 😉
Attends Chérie, ça va trancher
Maintenant que les préliminaires sont terminées, sortons les couteaux de bouchers pour attaquer le découpage. WPEC regroupe l’ensemble de la procédure de confirmation de commande dans le fichier :
wpsc-shopping_cart_page.php
Vous retrouverez ce fichier dans le répertoire de base du plugin WPEC ou bien dans le repertoire de votre thème, si vous avez copiez les fichiers dedans comme il est recommandé de le faire.
Qu’on se le dise, ce fichier n’est pas des plus simple à comprendre. Un vrai code spaghetti avec tous ces if/else/while. Il est par conséquent très facile, non pas de la mettre à jour, mais de tout casser. Alors avant toute modification, faites bien attention à faire une sauvegarde, pour revenir en arrière facilement, sinon… vous risqueriez d’être bien embêté à un moment ou un autre.
La première étape de notre découpage se concentrera sur la partie résumé du chariot et frais de port. Par soucis de simplicité, j’utilise ici les flat rate. Rien ne vous interdit d’utiliser une autre méthode de calcul des frais de port.
En dessous de la ligne 14 qui dit :
<div id="checkout_page_container">
Insérons la première étape de la confirmation de commande :
<div id="etape1">
Il nous reste maintenant à fermer les balises de la première étape au niveau de la livraison. Ça se passe ligne 196, là où le script vérifie la validité de la méthode de livraison. Ainsi, l’internaute restera bloqué sur cette partie de la procédure tant quelle ne sera pas correctement validé.
Donc, ligne 196, en dessous de :
<?php return; ?>
insérez la balise fermante :
</div>
Ce qui nous donnera ceci dans le code :
</div></div></div> <?php return; ?>
Maintenant, rendez-vous ligne 216 en dessous de :
<?php do_action('wpsc_before_form_of_shopping_cart'); ?>
Nous ajoutons ces quatre lignes :
<div id="to_step2">Suivant > </div> </div><!--- fin wpsc_shopping_cart_container ---> </div><!--- fin étape 1 ----> <div id="etape2">
Vous noterez que div est un container pour la navigation entre les étapes une et deux. Ce lien de navigation apparaitra donc uniquement si l’internaute a correctement rempli la partie frais de port.
Pour clore cette ouverture de balise et insérer les liens de navigation pour revenir à l’étape un ou suivre à l’étape trois, rendez-vous ligne 459 :
<table class='wpsc_checkout_table table-4'>
En dessous, insérez ces lignes de code :
<div id="to_step1">< Retour </div><div id="to_step3">Suivant > </div> </div><!---- fin step2 ---> <div id="etape3"> <table class='wpsc_checkout_table table-4'>
Les liens de navigation pour passer de l’étape deux à l’étape trois vont se loger juste après la fermeture du formulaire, ligne 520. Ce qui nous donnera :
<div class='clear'></div> </form> <div id="to_step2_from_step3">< Retour</div> </div> </div><!--Fermeture checkout_page_container-->
Pour la dernière étape, pas besoin de balise fermante, celle fournit de base fera parfaitement son office.
Pour que les liens de navigation fonctionnent et que les étapes soient masquées il va nous falloir insérer ces quelques lignes de javascript :
<script type="text/javascript">
jQuery('#etape2').css('display','none');
jQuery('#etape3').css('display','none');
jQuery('#to_step1').click(function(){
jQuery('#etape1').css('display','block');
jQuery('#etape2').css('display','none');
jQuery('#etape3').css('display','none');
});
jQuery('#to_step2').click(function(){
jQuery('#etape1').css('display','none');
jQuery('#etape2').css('display','block');
jQuery('#etape3').css('display','none');
});
jQuery('#to_step3').click(function(){
jQuery('#etape1').css('display','none');
jQuery('#etape2').css('display','none');
jQuery('#etape3').css('display','block');
});
jQuery('#to_step2_from_step3').click(function(){
jQuery('#etape1').css('display','none');
jQuery('#etape2').css('display','block');
jQuery('#etape3').css('display','none');
});
//If errors appear in the form filling step - after submitting the form display the 'step2' so they can correct it
var str = jQuery("p.validation-error").text();
if (str !==''){
jQuery("div#etape1").css('display','none');
jQuery("div#etape2").css('display','block');
jQuery("div#etape3").css('display','none');
};
</script>
<style type="text/css">
#to_step1 {width: 50%; text-align: center; font-weight: bold;float:left; display:inline;color:#1982D1;}
#to_step2 {width: 50%; text-align: center; font-weight: bold;float:left; display:inline;color:#1982D1;}
#to_step3 {width: 50%; text-align: center; font-weight: bold;float:left; display:inline;color:#1982D1;}
#to_step2_from_step3 {width: 50%; text-align: center; font-weight: bold;float:left; display:inline;color:#1982D1;}
</style>
Bien entendu, rien ne vous empêche ici de rajouter un peu de jQuery pour épicer un peu ce formulaire et lui donner plus de saveur.
Si vous souhaitez que j’aborde un point particulier dans le développement de WP E-Commerce, faites le moi savoir dans les commentaires et pourquoi pas, cela pourrait devenir un article 😉
J’espère vous avoir aidé et si vous aussi vous souhaitez apporter votre pierre dans le partage de la connaissance autours de WP E-Commerce… nous serions heureux de partager !
Pour pousser plus loin votre expérience avec WordPress, pensez aussi à notre site dédié à l’affiliation sur les thèmes WordPress pro, et les plugins WordPress pro. N’hésitez pas non plus à découvrir notre guide pour le référencement WordPress.
etape
Bonjour,
Pourrait-on avoir le rendu online du code pour se faire une idée.
Je suis sur la même problématique de présentation et d’agencement de cette page.
Nous avons un site en mode création : http://lebondecorateur.fr
Je souhaiterais remanier le code de la page “wpsc-shopping_cart_page” avec l’exemple ci-dessus, à savoir, un processus d’étape et du jquery.
Pouvez-vous m’aider?
Cordialement,
Olivier
Bonjour,
j’ai un développement à réaliser avec cette fonctionnalité, l’astuce est-elle toujours d’actualité ?
Merci, pour l’astuce, et pour vos réponse.
@JB : Wp-Ecommerce est bien meilleur que Woo Commerce selon moi. La communauté est plus grande et il a plus d’addons. Je ne sais pas ce qu’en pense les autres ici ?
Bonjour, as-tu eu l’occasion de tester le concurrent de Wp- Ecommerce : Woo Commerce. Si c’est le cas, quel est pour toi le meilleur.
Je n’arrive pas encore à me décider.
Merci d’avance
s’agissant des éléments de livraison, WPBC est imbuvable, et “livraison france” est désormais intégrer dedans.
Y aurait il une solution? un plugin? en espérant que la gestion des livraisons ne soit pas à faire à la main;)….
merci !
Bonjour, merci pour cet article.
Pour un client, je dois faire un site de livraison de repas avec paiement à la livraison, est ce que ce plugin permet de le gérer ou bien avec cet article on peut faire “sauter” la case paiement?
Merci
Je tien a te signalé que Les id etape1, etape2 et etape3 n ‘apparaisse pas dans ton code js a la place on trouve step 1, step2, et step3 et parreil dans l’autre sens (step1, step2, et step3 introuvable dans le html) il faut donc modifié ton article sur c’est partie la je pense car quand au lieu de mettre etape on met step dans le html sa fonctionne mais bon y a encore du boulot !!!!
Je viens de modifier cette petite erreur. J’ai pris l’habitude de toujours développer en anglais… mais comme je veux rester le plus clair possible.
Merci de ton attention.
J’avais pas vu la MAJ JS Merci
Ben du coup j’ai le choix entre 2 version maintenant je vais essayé la tienne et je te donnerais un retour très vite !!
En tout cas merci à toi cet article ne pouvais pas mieux tombé !
Écoute, c’était aussi un peu le but, de rendre service 😉
Un grand merci
Je vous donne mes codes façon jQuery et ma page “wpsc-shopping_cart_page” si quelqu’un peut me corriger car je viens de débuter une formation et donc le niveau n’est pas encore là:
J’ai donc sécurisé le formulaire et caché tous ce qui me gênais (hide, show) en fonction d’une variable (etape).
Donc voici les code jQuery:
jQuery(document).ready(function() {
function bonmail(email){
var reg = new RegExp(‘^[a-z0-9]+([_|.|-]{1}[a-z0-9]+)*@[a-z0-9]+([_|.|-]{1}[a-z0-9]+)*[.]{1}[a-z]{2,6}$’, ‘i’);
if(reg.test(email)){
return true;
}
else{
return false;
}
}
function bonPrenom(prenom, moin, plus){
if(prenom plus || prenom === “Prénom”){
return false;
}
else{
return true;
}
}
function condition(){
var check = jQuery(‘#shippingSameBilling’).attr(‘checked’);
if(check === “checked”){
jQuery(“.table-2 .etape3”).hide();
}
else
{
jQuery(“.table-2 .etape3”).show();
}
}
jQuery(“#agree”).click(function(){
});
var etape = 1;
if(etape === 1){
jQuery(“.submit_form”).hide();
jQuery(“.revenir”).hide();
jQuery(“.productcart”).css(“display”, “block”);
jQuery(“.checkout_cart”).css(“display”, “block”);
jQuery(“.etape1”).css(“display”, “block”);
jQuery(“#LoginWithAjax_Form”).hide();
jQuery(“.wpsc_registration_form”).css(“display”, “none”);
jQuery(“.wpsc_right_registration”).css(“display”, “none”);
jQuery(“.wpsc_email_address “).css(“display”, “none”);
jQuery(“.etape2”).css(“display”, “none”);
jQuery(“.etape3”).css(“display”, “none”);
jQuery(“.etape4”).css(“display”, “none”);
jQuery(“.wpsc_gateway_container “).css(“display”, “none”);
jQuery(“.table-4”).css(“display”, “none”);
jQuery(“#les_etapes”).css(“background”, “url(‘http://rap-aulnay-sous.com/baseinbox/osmosez/wordpress/wp-content/themes/DeepFocus/images/etapes-paiement.png’) no-repeat scroll 0 0 transparent”);
}
var test = jQuery(‘.validation-error’).length;
if(test > 0){
etape = ‘tout’;
}
if(etape === ‘tout’){
jQuery(“.valider”).hide();
jQuery(“.submit_form”).show();
jQuery(“.productcart”).css(“display”, “none”);
jQuery(“.title”).css(“display”, “none”);
jQuery(“.checkout_cart”).css(“display”, “none”);
jQuery(“.etape1”).css(“display”, “none”);
jQuery(“.wpsc_registration_form”).css(“display”, “block”);
jQuery(“.wpsc_right_registration”).css(“display”, “block”);
jQuery(“.wpsc_email_address “).css(“display”, “block”);
jQuery(“.etape2”).css(“display”, “none”);
jQuery(“.etape3”).css(“display”, “none”);
jQuery(“.etape4”).css(“display”, “block”);
jQuery(“.wpsc_gateway_container “).css(“display”, “block”);
jQuery(“.table-4”).css(“display”, “block”);
jQuery(“.etape_1”).css(“color”, ‘black’);
jQuery(“.etape_2”).css(“color”, ‘black’);
jQuery(“.etape_3”).css(“color”, ‘red’);
condition();
alert(“Merci de fournir des information valide !!!”);
}
jQuery(“.valider”).click(function(){
etape += 1;
var valeur_mail_log = jQuery(‘#user_email’).val();
if(bonmail(valeur_mail_log) === false && etape === 3){
var nb_v_mail_log = jQuery(‘.mail_log_error’).length;
if(nb_v_mail_log > 0){
}
if(nb_v_mail_log === 1 && etape === 3){
var validation = false;
}
else{
jQuery(‘#user_email’).after(‘Merci d’entrer un Email valide.’);
}
var validation_log = false;
}
else{
jQuery(‘.mail_log_error’).remove();
}
var v_user_name = jQuery(‘#log’).val();
if(bonPrenom(v_user_name, 3, 29) === false && etape === 3){
var nb_error_mess = jQuery(‘.usr_name_error’).length;
if(nb_error_mess > 0){
}
if(nb_error_mess === 1 && etape === 3){
var validation = false;
}
else{
jQuery(‘#log’).after(‘Merci d’entrer un nom d’utilisateur valide.’);
}
var validation_log = false;
}
else{
jQuery(‘.usr_name_error’).remove();
}
var v_mdp = jQuery(‘#pwd’).val();
// alert(v_mdp);
if(bonPrenom(v_mdp, 4, 29) === false && etape === 3){
var nb_error_mdp = jQuery(‘.mdp_error’).length;
if(nb_error_mdp > 0){
}
if(nb_error_mdp === 1 && etape === 3){
var validation = false;
}
else{
jQuery(‘#pwd’).after(‘Merci d’entrer un mot de passe valide.’);
}
var validation_log = false;
}
else{
jQuery(‘.mdp_error’).remove();
}
//———–ETAPE 3 Validation DEBUT
var valeur_mail = jQuery(‘#wpsc_checkout_form_9’).val();
if(bonmail(valeur_mail) === false && etape === 4){
var nb_v_mail = jQuery(‘.mail_error’).length;
if(nb_v_mail > 0){
}
if(nb_v_mail === 1 && etape === 4){
var validation = false;
}
else{
jQuery(‘#wpsc_checkout_form_9’).after(‘Merci d’entrer un Email valide.’);
}
var validation = false;
}
else{
jQuery(‘.mail_error’).remove();
}
//———–
var prenom = jQuery(‘#wpsc_checkout_form_2’).attr(“value”);
var nb_v_prenom = prenom.length;
if(etape === 4 && prenom === “Prénom” || nb_v_prenom 29 ){
var error_prenom = jQuery(‘.prenom_error’).length;
if(error_prenom > 0){
var validation = false;
}
else{
jQuery(‘#wpsc_checkout_form_2’).after(‘Merci d’entrer un Prénom valide.’);
}
var validation = false;
}
else{
jQuery(‘.prenom_error’).remove();
}
//———–
var nom = jQuery(‘#wpsc_checkout_form_3’).attr(“value”);
var nb_v_nom = nom.length;
if(etape === 4 && nom === “Nom” || nb_v_nom 29 ){
var error_nom = jQuery(‘.nom_error’).length;
if(error_nom > 0){
var validation = false;
}
else{
jQuery(‘#wpsc_checkout_form_3’).after(‘Merci d’entrer un Nom valide.’);
}
var validation = false;
}
else{
jQuery(‘.nom_error’).remove();
}
//———–
var adresse = jQuery(‘#wpsc_checkout_form_4’).val();
var nb_v_adresse = adresse.length;
if(etape === 4 && adresse === “Adresse” || nb_v_adresse 29 ){
var error_adresse = jQuery(‘.adresse_error’).length;
if(error_adresse > 0){
var validation = false;
}
else{
jQuery(‘#wpsc_checkout_form_4’).after(‘Merci d’entrer une Adresse valide.’);
}
var validation = false;
}
else{
jQuery(‘.adresse_error’).remove();
}
//———–
var ville = jQuery(‘#wpsc_checkout_form_5’).attr(“value”);
var nb_v_ville = ville.length;
if(etape === 4 && ville === “Ville” || nb_v_ville 29 ){
var error_ville = jQuery(‘.ville_error’).length;
if(error_ville > 0){
var validation = false;
}
else{
jQuery(‘#wpsc_checkout_form_5’).after(‘Merci d’entrer un nom de ville valide.’);
}
var validation = false;
}
else{
jQuery(‘.ville_error’).remove();
}
//————
var code_postale = jQuery(‘#wpsc_checkout_form_8’).attr(“value”);
var nb_v_code_postale = code_postale.length;
if(etape === 4 && code_postale === “Code Postal” || nb_v_code_postale 29 ){
var error_code_postale = jQuery(‘.code_postale_error’).length;
if(error_code_postale > 0){
var validation = false;
}
else{
jQuery(‘#wpsc_checkout_form_8’).after(‘Merci d’entrer un Code Postale valide.’);
}
var validation = false;
}
else{
jQuery(‘.code_postale_error’).remove();
}
//———–
var telephone = jQuery(‘#wpsc_checkout_form_18’).attr(“value”);
var nb_v_telephone = telephone.length;
if(etape === 4 && telephone === “Téléphone” || nb_v_telephone 29 ){
var error_telephone = jQuery(‘.telephone_error’).length;
if(error_telephone > 0){
var validation = false;
}
else{
jQuery(‘#wpsc_checkout_form_18’).after(‘Merci d’entrer un n° de téléphone valide.’);
}
var validation = false;
}
else{
jQuery(‘.telephone_error’).remove();
}
//————
if(validation === false){
etape = 3;
alert(“Vous devez vous identifier ou vous inscrire pour continuer votre achat”);
}
if(validation_log === false){
etape = 2;
// alert(“il faut envoyer un formulaire valide pour passer l’etape suivante”);
}
//———–ETAPE 3 Validation FIN
if(document.getElementById(‘wpadminbar’) && etape === 2){
etape = 3;
jQuery(“.submit_form”).hide();
jQuery(“.revenir”).show();
jQuery(“.title”).hide();
jQuery(“.productcart”).hide();
jQuery(“.checkout_cart”).hide();
jQuery(“.etape1”).hide();
jQuery(“#les_etapes”).css(“background”, “url(‘http://rap-aulnay-sous.com/baseinbox/osmosez/wordpress/wp-content/themes/DeepFocus/images/etapes-paiement.png’) no-repeat scroll 0 -150px transparent”);
condition();
}
if(etape === 2 ){
jQuery(“.submit_form”).hide();
jQuery(“.title”).hide();
jQuery(“.productcart”).hide();
jQuery(“.checkout_cart”).hide();
jQuery(“.etape1”).hide();
jQuery(“#LoginWithAjax_Form”).show();
jQuery(“.valider”).show();
jQuery(“.revenir”).show();
jQuery(“.wpsc_registration_form”).show();
jQuery(“.etape_1”).css(“color”, ‘black’);
jQuery(“.etape_2”).css(“color”, ‘red’);
jQuery(“#les_etapes”).css(“background”, “url(‘http://rap-aulnay-sous.com/baseinbox/osmosez/wordpress/wp-content/themes/DeepFocus/images/etapes-paiement.png’) no-repeat scroll 0 -150px transparent”);
}
else if(etape === 3){
jQuery(“.submit_form”).hide();
jQuery(“.wpsc_registration_form”).hide();
jQuery(‘.table-1, .table-2’).css(“float”, “left”).css(“width”, “450px”).css(“height”, “100%”);
jQuery(“.valider”).show();
jQuery(“.revenir”).show();
jQuery(“.wpsc_right_registration”).show();
jQuery(“.wpsc_email_address”).show();
jQuery(“.etape2”).show();
jQuery(“.etape3”).show();
condition();
jQuery(“#les_etapes”).css(“background”, “url(‘http://rap-aulnay-sous.com/baseinbox/osmosez/wordpress/wp-content/themes/DeepFocus/images/etapes-paiement.png’) no-repeat scroll 0 -150px transparent”);
}
else if(etape === 4){
jQuery(“.valider”).hide();
jQuery(“.submit_form”).show();
jQuery(“.wpsc_right_registration”).hide();
jQuery(“.wpsc_email_address”).hide();
jQuery(“.etape2”).hide();
jQuery(“.etape3”).hide();
jQuery(‘.table-1, .table-2’).css(“float”, “none”).css(“width”, “auto”).css(“height”, “auto”);
jQuery(“.etape4”).show();
jQuery(“.wpsc_gateway_container”).show();
jQuery(“.table-4”).show();
jQuery(“.etape_2”).css(“color”, ‘black’);
jQuery(“.etape_3”).css(“color”, ‘red’);
jQuery(“#les_etapes”).css(“background”, “url(‘http://rap-aulnay-sous.com/baseinbox/osmosez/wordpress/wp-content/themes/DeepFocus/images/etapes-paiement.png’) no-repeat scroll 0 -240px transparent”);
}
return false;
});
jQuery(“.revenir”).click(function(){
etape -= 1;
if(document.getElementById(‘wpadminbar’) && etape === 2){
etape = 1;
}
if(etape === 1){
jQuery(“.submit_form”).hide();
jQuery(“.revenir”).hide();
jQuery(“.productcart”).css(“display”, “block”);
jQuery(“.checkout_cart”).css(“display”, “block”);
jQuery(“.etape1”).css(“display”, “block”);
jQuery(“.title”).show();
jQuery(“.valider”).show();
jQuery(“.wpsc_registration_form”).css(“display”, “none”);
jQuery(“.wpsc_right_registration”).css(“display”, “none”);
jQuery(“.wpsc_email_address “).css(“display”, “none”);
jQuery(“.etape2”).css(“display”, “none”);
jQuery(“.etape3”).css(“display”, “none”);
jQuery(“.etape4”).css(“display”, “none”);
jQuery(“.wpsc_gateway_container “).css(“display”, “none”);
jQuery(“.table-4”).css(“display”, “none”);
jQuery(“.etape_1”).css(“color”, ‘red’);
jQuery(“.etape_2”).css(“color”, ‘black’);
jQuery(“.etape_3”).css(“color”, ‘black’);
}
if(etape === 2 ){
jQuery(“.submit_form”).hide();
jQuery(“.wpsc_right_registration”).hide();
jQuery(“.wpsc_email_address”).hide();
jQuery(“.etape2”).hide();
jQuery(“.etape3”).hide();
jQuery(“.valider”).show(1500);
jQuery(“.revenir”).show(1500);
jQuery(“.wpsc_registration_form”).show();
jQuery(“.etape_1”).css(“color”, ‘black’);
jQuery(“.etape_2”).css(“color”, ‘red’);
jQuery(“.etape_3”).css(“color”, ‘black’);
jQuery(‘.table-1, .table-2’).css(“float”, “none”).css(“width”, “auto”).css(“height”, “auto”);
}
else if(etape === 3){
jQuery(“.valider”).show();
jQuery(“.revenir”).show();
jQuery(“.submit_form”).hide();
jQuery(“.etape4”).hide();
jQuery(“.wpsc_gateway_container”).hide();
jQuery(“.table-4”).hide();
jQuery(‘.table-1, .table-2’).css(“float”, “left”).css(“width”, “450px”).css(“height”, “100%”);
jQuery(“.wpsc_right_registration”).show();
jQuery(“.wpsc_email_address”).show();
jQuery(“.etape2”).show();
jQuery(“.etape3”).show();
condition();
jQuery(“.etape_1”).css(“color”, ‘black’);
jQuery(“.etape_2”).css(“color”, ‘red’);
jQuery(“.etape_3”).css(“color”, ‘black’);
}
else if(etape === 4){
jQuery(“.valider”).hide();
jQuery(“.submit_form”).show();
jQuery(“.wpsc_right_registration”).hide();
jQuery(“.wpsc_email_address”).hide();
jQuery(“.etape2”).hide();
jQuery(“.etape3”).hide();
jQuery(“.etape4”).show();
jQuery(“.wpsc_gateway_container”).show();
jQuery(“.table-4”).show();
}
return false;
});
jQuery(“.submit_form”).click(function(){
var checked = jQuery(‘#agree’).attr(‘checked’);
if(checked !== ‘checked’){
alert(‘Il faut acceptez les condition générale des ventes’);
return false;
}
});
});
Et ici ma page “wpsc-shopping_cart_page”:
<?php
global $wpsc_cart, $wpdb, $wpsc_checkout, $wpsc_gateway, $wpsc_coupons;
$wpsc_checkout = new wpsc_checkout();
$wpsc_gateway = new wpsc_gateways();
$alt = 0;
if(isset($_SESSION['coupon_numbers']))
$wpsc_coupons = new wpsc_coupons($_SESSION['coupon_numbers']);
if(wpsc_cart_item_count() < 1) :
_e('Oops, there is nothing in your cart.', 'wpsc') . "” . __(‘Please visit our shop’, ‘wpsc’) . ““;
return;
endif;
?>
<!— Etape 1
– Etape 2
– Etape 3–>
<tr class="product_row product_row_ “>
<td class="firstcol wpsc_product_image wpsc_product_image_”>
<img src="” alt=”” title=”” class=”product_image” />
<a href="”>
<td class="wpsc_product_name wpsc_product_name_”>
<a href="”>
<td class="wpsc_product_quantity wpsc_product_quantity_”>
<form action="” method=”post” class=”adjustform qty”>
<input type="text" name="quantity" size="2" value="” />
<input type="hidden" name="key" value="” />
<input type="submit" value="” name=”submit” />
<td class="wpsc_product_price wpsc_product_price_”>
<td class="wpsc_product_remove wpsc_product_remove_”>
<form action="” method=”post” class=”adjustform remove”>
<input type="hidden" name="key" value="” />
<input type="submit" value="” name=”submit” />
:
<form method="post" action="”>
<input type="text" name="coupon_num" id="coupon_num" value="coupons_name; ?>” />
<input type="submit" value="” />
<tr class='’>
<td class='wpsc_shipping_quote_name wpsc_shipping_quote_name_’ colspan=’3′>
<label for='’>
<td class='wpsc_shipping_quote_price wpsc_shipping_quote_price_’ style=’text-align:center;’>
<label for='’>
<td class='wpsc_shipping_quote_radio wpsc_shipping_quote_radio_’ style=’text-align:center;’>
<input type='radio' id='’ onclick=’switchmethod(“”, “”)’ value=” name=’shipping_method’ />
<input disabled=’disabled’ type=’radio’ id=” value=” name=’shipping_method’ />
wpec_taxes_isenabled()):
?>
<?php
foreach($_SESSION['wpsc_checkout_user_error_messages'] as $user_error )
echo $user_error."n”;
$_SESSION[‘wpsc_checkout_user_error_messages’] = array();
?>
false,
‘redirect’ => home_url( $_SERVER[‘REQUEST_URI’] )
);
wp_login_form( $args );
?>
<form class='wpsc_checkout_forms' action='’ method=’post’ enctype=”multipart/form-data”>
:
:
:
<input type="text" name="user_email" id="user_email" value="” size=”20″ />
1):?>
<table class='wpsc_checkout_table table-‘>
<tr >
<td colspan=’2′>
<input type='checkbox' value='true' name='shippingSameBilling' id='shippingSameBilling' />
<td class='’>
<label for='’>
<td class='’>
<label for='’>
checkout_item->unique_name == ‘billingemail’){ ?>
<?php $email_markup =
"
” . __(‘Enter your email address’, ‘wpsc’) . ”
” . wpsc_checkout_form_field();
if(wpsc_the_checkout_item_error() != ”)
$email_markup .= “” . wpsc_the_checkout_item_error() . “”;
$email_markup .= “”;
}else{ ?>
<td class='’>
<label for='’>
1): // if we have more than one gateway enabled, offer the user a choice ?>
<input type="radio" value="” name=”custom_gateway” class=”custom_gateway”/>
<img src="” alt=”” style=”position:relative; top:5px;” />
<table class='wpsc_checkout_table ‘>
<input name='custom_gateway' value='’ type=’hidden’ />
<table class='wpsc_checkout_table ‘>
<?php printf(__("I agree to the Terms and Conditions“, “wpsc”), site_url(“?termsandconds=true&width=360&height=400”)); ?> *
:
0)): ?>
:
:
<input type='submit' value='’ name=’submit’ class=’make_purchase wpsc_buy_button submit_form’ />
Etape precedente Etape suivante
Voila et la il me reste la vérification de doublons en Ajax, j’ai du mal encore mais j’y travaille activement !!!!
Si quelqu’un peut m’aider à améliorer mon code ???
Merci à vous !!!
Ton commentaire était parti en spa, le voila publié 😉
premier billet, premier commentaire ?
un problème de wp e-commerce est la non reconnaissance des variantes par merchant google (si j’ai bien compris ce qu’il demande) par contre il me semble que le plugin product options est mieux visible en tout cas lui affiche le poids (pas les variantes).
ce billet ne me concerne pas car je n’emploie pas parce qu’il ne reconnait que les $. quant à weight lui ne reconnait que les pound. Le “livraison française” n’est pas terrible. J’emploie donc weight par country. très bien !
Merci pour ce tuto, j’ai suivi toute les étape, mais j avouerai que je n’ais pas compris car pour l’instant j’ai juste ajouté du code dans ma page et à l’affichage rien a changé.
En effet étant encore débutant en développement sous wordpress je ne vois pas quel est la suite de toute les étape cité ici mais je ne vois pas du tout logiquement on devrait creer 2 page et divisé alors notre code en trois comme tu nous la montré mais alors comment faire alors la ???
Je viens de rajouter la partie JavaScript. Normalement, ça devrait être tout bon.