Nous mettons à votre disposition notre extension WooCommerce (WordPress) disponible sur notre GitLab. En effet, l’extension vous permettra de dissocier la fonctionnalité de votre thème. Pour ce fait, vous allez pouvoir changer votre design si vous le souhaitez sans avoir à refaire les mêmes manœuvres. Téléchargez et installez sur votre site web. Il est cependant important de noter que c’est fonctionnel avec les conditions suivantes:
Comme bonnes pratiques, nous vous recommanderons de faire des tests avant de le mettre en ligne. Vous pouvez, par exemple, installer sur un serveur local ou un site web test.
Il existe plusieurs extensions pour WooCommerce qui permettent de remplacer le bouton d’ajout au panier par un lien vers un formulaire. Je vais vous expliquer comment le faire avec l’extension « YITH WooCommerce Request a Quote ».
Maintenant, le bouton d’ajout au panier sur vos pages de produits WooCommerce sera remplacé par un lien vers le formulaire de demande de devis. Les clients pourront utiliser ce formulaire pour présenter une demande de devis pour le produit plutôt que de l’ajouter directement au panier.
<?php
add_filter( 'woocommerce_loop_add_to_cart_link', 'replace_add_to_cart_button_with_form', 10, 2 );
function replace_add_to_cart_button_with_form( $button, $product ) {
// Récupère l'ID du produit
$product_id = $product->get_id();
// Crée un lien vers le formulaire de commande personnalisé
$link = get_permalink( $product_id ) . '#custom-order-form';
// Remplace le bouton "Ajouter au panier" par un lien vers le formulaire personnalisé
$button = '<a href="' . $link . '" class="button">' . __("Demande de devis", "woocommerce") . '</a>';
return $button;
}
Dans ce code, la fonction replace_add_to_cart_button_with_form
récupère l’ID du produit et crée un lien vers le formulaire de commande personnalisé en ajoutant un identifiant à l’URL du produit. Ensuite, elle remplace le bouton « Ajouter au panier» par un lien vers le formulaire personnalisé.
Vous devrez ensuite créer le formulaire personnalisé et le placer à l’emplacement de l’ID que vous avez ajouté à l’URL. Par exemple, si l’identifiant est #custom-order-form
, vous pouvez placer le formulaire à l’endroit où vous voulez qu’il apparaisse sur la page grâce à cet identifiant dans votre code HTML.