Woocommerce Question posted in
The official Woocommerce documentation can be found here.

Pass some WooCommerce product data to Contact Form 7 enquiry form

After Display a form when the selected variation is out of stock in WooCommerce answer to my previous answer, I can display a form made with Contact Form 7 plugin, on the "Out of Stock" products of my WooCommerce store. It works for simple and variable products (product variations).

Now I would like to pass some product data to this enquiry contact form like in this answer:
Pass the chosen product variations data into Contact Form 7 enquiry form.

I would like to pass the product name (and the variation attribute "Color" value, which is "Renk" in my native language). I tried my self in all possible ways, but without any success.

Any help will be appreciated.

Tags:

2

Answers


  1. 0

    As Contact Form 7 allows hidden input field, you will set a hidden input field in your form for the product data (after the submit button) like:

    <label> Your Name (required)
    [text* your-name] </label>

<label> Your Email (required)
    [email* your-email] </label>

<label> Your Message
    [textarea* your-message] </label>

[submit "Send"]

[hidden your-product]

    Then You will add it to the mail using for example:

    Product Enquiry: [your-product]

    Now jQuery will copy the product name (and the attribute Color value) to this hidden field. Replace your all existing related code with the following:

    add_action( 'woocommerce_single_product_summary', 'add_product_outofstock_contact_form', 30, 2 );
function add_product_outofstock_contact_form() {
    global $product;

    $contact_form = do_shortcode('[contact-form-7 id="14880" title="Fiyat Sorunuz"]'); // Here the contact form shortcode

    if( $product->is_type('variable') ) {
        echo '<div class="outofstock-form" style="display:none">' . $contact_form . '</div>';
    } elseif( ! $product->is_in_stock() ) {
        echo $contact_form;
        ?>
        <script type="text/javascript">
        jQuery(function($) {
            var id   = <?php echo $product->get_id(); ?>,
                name = '<?php echo $product->get_name(); ?>';

            $('input[name="your-product"]').val(name+' ('+id+')');
        });
        </script>
        <?php
    }
}

add_filter( 'woocommerce_available_variation', 'filter_available_variation_attributes', 10, 3 );
function filter_available_variation_attributes( $data, $product, $variation ){
    if ( ! $data['is_in_stock'] ) {
        $attribute     = 'Color';

        $term_name     = $variation->get_attribute($attribute);
        $data['name']  = $product->get_name();
        $data['name'] .= $term_name ? ' - ' . $term_name : '';

    }
    return $data;
}

add_action('woocommerce_after_variations_form', 'outofstock_product_variation_js');
function outofstock_product_variation_js() {
    ?>
    <script type="text/javascript">
    jQuery(function($) {
        var contactFormObject   = $('.outofstock-form'),
            addToCartButtonObj  = $('.woocommerce-variation-add-to-cart'),
            hiddenInputFieldObj = $('input[name="your-product"]');

        $('form.variations_form').on('show_variation', function(event, data) { // On selected variation
            if ( ! data.is_in_stock  ) {
                addToCartButtonObj.hide('fast');
                contactFormObject.show('fast');
                hiddenInputFieldObj.val(data.name+' ('+data.variation_id+')');
            } else {
                addToCartButtonObj.show('fast');
                contactFormObject.hide('fast');
                hiddenInputFieldObj.val('');
            }
        }).on('hide_variation', function() { // Not on selected variation
            addToCartButtonObj.show('fast');
            contactFormObject.hide('fast');
            hiddenInputFieldObj.val('');
        });
    });
    </script>
    <?php
}

    Code goes in functions.php file of the active child theme (or active theme). Tested and works.

    Note: The code works for simple products and for variable products (product variations).

    Related:

    Login or Signup to reply.
  2. 0

    This resource from cf7 docs helped me.

    To pass product name into cf7 form:

    1. create form tag
       [hidden product-name default:shortcode_attr]
    1. add code to functions.php
        add_filter('shortcode_atts_wpcf7', 'custom_shortcode_atts_wpcf7_filter', 10, 3);
    
    function custom_shortcode_atts_wpcf7_filter($out, $pairs, $atts)
    {
      $my_attr = 'product-name';
    
      if (isset($atts[$my_attr])) {
        $out[$my_attr] = $atts[$my_attr];
      }
    
      return $out;
    }
    1. add product-name attribute to cf7 shortcode
        echo do_shortcode('[contact-form-7 id="7" title="you name it" product-url="' . get_permalink($product->get_name())  . '"]');
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search