Submit your selected product variation data to the contact form request form 7

Question

With WooCommerce, I use Contact Form 7 and Product Information Request to add a form inside individual product pages, because I need functionality that allows users to send a request for requests (a simple contact form).

You can understand what this screenshot looks like:

My whole product is a variable product with variations (from attributes).

Is there a way to get the selected options by the client and send it via contact form 7?

For instance:

The user selects the color black and size s, then fills out the form and when the email is sent, in addition to receiving the classical information (name, email address ecc ..) I also receive the selected attribute (in this case, and ) black s

Answer 1

UPDATED: Added compatibility with WC 3+

I tested it and it will not send any data related to the selected options, because it simply displays the selected contact form below the "Add to Cart" button (on pages with one product). In addition, this plugin has not been updated since more than 2 years, so it is deprecated.

:

: WooCommerce 7

, 7 .

, , , ( ).

/ 2 : Color Size.

Contact form 7 , :

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

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

<label> Subject (required)
    [text* your-subject class:product_name] </label>

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

[submit "Send"]

[text your-product class:product_details]

[text your-product class:product_details]. "" [your-product] " ", :

From: [your-name] <[your-email]>
Subject: [your-subject]

Product: [your-product]

Message Body:
[your-message]

--------------
This e-mail was sent from a contact form 7

funtion PHP woocommerce_after_add_to_cart_form:

add_action( 'woocommerce_after_add_to_cart_form', 'product_enquiry_custom_form' );
function product_enquiry_custom_form() {

    global $product, $post;

    // Set HERE your Contact Form 7 shortcode:
    $contact_form_shortcode = '[contact-form-7 id="382" title="form"]';

    // compatibility with WC +3
    $product_id = method_exists( $product, 'get_id' ) ? $product->get_id() : $product->id;
    $product_title = $post->post_title;

    // The email subject for the "Subject Field"
    $email_subject = __( 'Enquire about', 'woocommerce' ) . ' ' . $product_title;

    foreach($product->get_available_variations() as $variation){
        $variation_id = $variation['variation_id'];
        foreach($variation['attributes'] as $key => $value){
            $key = ucfirst( str_replace( 'attribute_pa_', '', $key ) );
            $variations_attributes[$variation_id][$key] = $value;
        }
    }
    // Just for testing the output of $variations_attributes
    // echo '<pre>'; print_r( $variations_attributes ); echo '</pre>';


    ## CSS INJECTED RULES ## (You can also remve this and add the CSS to the style.css file of your theme
    ?>
    <style>
        .wpcf7-form-control-wrap.your-product{ opacity:0;width:0px;height:0px;overflow: hidden;display:block;margin:0;padding:0;}
    </style>

    <?php


    // Displaying the title for the form (optional)
    echo '<h3>'.$email_subject.'</h3><br>
        <div class="enquiry-form">' . do_shortcode( $contact_form_shortcode ) . '</div>';


    ## THE JQUERY SCRIPT ##
    ?>
    <script>
        (function($){

            <?php
                // Passing the product variations attributes array to javascript
                $js_array = json_encode($variations_attributes);
                echo 'var $variationsAttributes = '. $js_array ;
            ?>

            // Displaying the subject in the subject field
            $('.product_name').val('<?php echo $email_subject; ?>');

            ////////// ATTRIBUTES VARIATIONS SECTION ///////////

            var $attributes;

            $('td.value select').blur(function() {
                var $variationId = $('input[name="variation_id"]').val();
                // console.log('variationId: '+$variationId);
                if (typeof $variationId !== 'undefined' ){
                    for(key in $variationsAttributes){
                        if( key == $variationId ){
                            $attributes = $variationsAttributes[key];
                            break;
                        }
                    }

                }
                if ( typeof $attributes !== 'undefined' ){
                    // console.log('Attributes: '+JSON.stringify($attributes));
                    var $attributesString = '';
                    for(var attrKey in $attributes){
                        $attributesString += ' ' + attrKey + ': ' + $attributes[attrKey] + ' — ';
                    }
                   $('.product_details').val( 'Product <?php echo $product_title; ?> (ID <?php echo $product_id; ?>): ' + $attributesString );
                }
            });

        })(jQuery);
    </script>

    <?php
}

function.php ( ), .

, :

• , .
• + ( ).

:

:

( , jQuery):

, , ...

, , :

From: John Smith <[e-mail]>
Subject: Enquire about Ship Your Idea

Product: Product Ship Your Idea (ID 40):  Color: black —  Size: 12 —

Message Body:
I send this request about this very nice product … I send this request about this very nice product …

--
This e-mail was sent from a contact form 7

, Everithing , , .