WooCommerce: Add Product Inquiry Form on Single Product Page

WooCommerce Add Product Inquiry Form on Single Product Page

In this tutorial, I’ll show you how you can add an inquiry form on a single product page. We’ll use Contact Form 7 plugin to create the inquiry form.

Step 1: Create Inquiry Form

Install CF7 and create your inquiry form

Step 2: Add code

Now, you have to add this code by creating a site-specific plugin or by editing child themes functions.php file. Now replace with your contact form 7 shortcode in [paste_your_contact_form_7_shortcode_here] this line.

/* Product Inquiry Form */

add_action( 'woocommerce_single_product_summary', 'emuslearner_woocommerce_cf7_single_product', 30 );
function emuslearner_woocommerce_cf7_single_product() {
$title = get_the_title();
   echo '<button type="submit" id="trigger_cf" class="single_add_to_cart_button button alt">Product Inquiry</button>';
   echo '<div id="product_inq" style="display:none">';
   echo do_shortcode('[paste_your_contact_form_7_shortcode_here]');
   echo '</div>';
   wc_enqueue_js( "
      $('#trigger_cf').on('click', function(){
         if ( $(this).text() == 'Product Inquiry' ) {
         } else {
            $('#trigger_cf').html('Product Inquiry');
   " );

/* Product Inquiry Form */

add some css style to hide the Subject field

Leave a Reply

Sign Up for Our Newsletters

Get notified of the best deals on our WordPress themes.

You May Also Like