将所选产品变体数据传递到Contact Form 7查询表

Question

通过WooCommerce,我使用Contact Form 7和Product Info Request插件在单个产品页面中添加表单,因为我需要一种功能,允许用户发送有关产品的查询请求(简单的联系表单).

你可以理解看到这个截图:

我的所有产品都是可变产品,具有变化(来自属性).

有没有办法检索客户选择的变体并通过联系表格7发送？

例如 :

用户选择颜色黑色和尺寸s,然后填写表格,当发送电子邮件时,除了接收经典信息(姓名,电子邮件ecc ..),我还收到所选的属性(在这种情况下black和s)

Answer 1

\n

更新： 添加了 WC 3+ 兼容性

\n

\n

我已经测试过它，它不会发送与所选变体相关的任何数据，因为它只是在“添加到购物车”按钮下方输出所选的联系表单（在单个产品页面中）。此外，这个插件已经两年多没有更新了，所以它有点过时了。

\n

\n

好消息：有效的解决方案

\n

\n

我找到了这个相关答案： 联系表 7 中的产品名称 WooCommerce

\n

它解释了如何在产品选项卡中设置联系表单 7 短代码并在电子邮件中显示所选产品标题。

\n

因此，根据这个答案，我已经转置了代码，就像插件正在做的那样使用它（就在“添加到购物车”按钮下方）。

\n

在此示例/答案中，我在变量产品 2 中为产品变体设置了属性：Color和Size。

\n

这是我Contact form 7将在代码中使用的表单的设置：

\n

<label> Your Name (required)\n    [text* your-name] </label>\n\n<label> Your Email (required)\n    [email* your-email] </label>\n\n<label> Subject (required)\n    [text* your-subject class:product_name] </label>\n\n<label> Your Message\n    [textarea your-message] </label>\n\n[submit "Send"]\n\n[text your-product class:product_details]\n

\n

在这里我添加了这个文本字段[text your-product class:product_details]。因此，您还需要在“邮件[your-product]正文”内的“邮件”设置选项卡标签中添加，以将其添加到您的电子邮件中：

\n

<label> Your Name (required)\n    [text* your-name] </label>\n\n<label> Your Email (required)\n    [email* your-email] </label>\n\n<label> Subject (required)\n    [text* your-subject class:product_name] </label>\n\n<label> Your Message\n    [textarea your-message] </label>\n\n[submit "Send"]\n\n[text your-product class:product_details]\n

\n

PHP代码自定义函数挂接在woocommerce_after_add_to_cart_formaction hook中：

\n

add_action( \'woocommerce_after_add_to_cart_form\', \'product_enquiry_custom_form\' );\nfunction product_enquiry_custom_form() {\n\n    global $product, $post;\n\n    // Set HERE your Contact Form 7 shortcode:\n    $contact_form_shortcode = \'[contact-form-7 id="382" title="form"]\';\n\n    // compatibility with WC +3\n    $product_id = method_exists( $product, \'get_id\' ) ? $product->get_id() : $product->id;\n    $product_title = $post->post_title;\n\n    // The email subject for the "Subject Field"\n    $email_subject = __( \'Enquire about\', \'woocommerce\' ) . \' \' . $product_title;\n\n    foreach($product->get_available_variations() as $variation){\n        $variation_id = $variation[\'variation_id\'];\n        foreach($variation[\'attributes\'] as $key => $value){\n            $key = ucfirst( str_replace( \'attribute_pa_\', \'\', $key ) );\n            $variations_attributes[$variation_id][$key] = $value;\n        }\n    }\n    // Just for testing the output of $variations_attributes\n    // echo \'<pre>\'; print_r( $variations_attributes ); echo \'</pre>\';\n\n\n    ## CSS INJECTED RULES ## (You can also remve this and add the CSS to the style.css file of your theme\n    ?>\n    <style>\n        .wpcf7-form-control-wrap.your-product{ opacity:0;width:0px;height:0px;overflow: hidden;display:block;margin:0;padding:0;}\n    </style>\n\n    <?php\n\n\n    // Displaying the title for the form (optional)\n    echo \'<h3>\'.$email_subject.\'</h3><br>\n        <div class="enquiry-form">\' . do_shortcode( $contact_form_shortcode ) . \'</div>\';\n\n\n    ## THE JQUERY SCRIPT ##\n    ?>\n    <script>\n        (function($){\n\n            <?php\n                // Passing the product variations attributes array to javascript\n                $js_array = json_encode($variations_attributes);\n                echo \'var $variationsAttributes = \'. $js_array ;\n            ?>\n\n            // Displaying the subject in the subject field\n            $(\'.product_name\').val(\'<?php echo $email_subject; ?>\');\n\n            ////////// ATTRIBUTES VARIATIONS SECTION ///////////\n\n            var $attributes;\n\n            $(\'td.value select\').blur(function() {\n                var $variationId = $(\'input[name="variation_id"]\').val();\n                // console.log(\'variationId: \'+$variationId);\n                if (typeof $variationId !== \'undefined\' ){\n                    for(key in $variationsAttributes){\n                        if( key == $variationId ){\n                            $attributes = $variationsAttributes[key];\n                            break;\n                        }\n                    }\n\n                }\n                if ( typeof $attributes !== \'undefined\' ){\n                    // console.log(\'Attributes: \'+JSON.stringify($attributes));\n                    var $attributesString = \'\';\n                    for(var attrKey in $attributes){\n                        $attributesString += \' \' + attrKey + \': \' + $attributes[attrKey] + \' \xe2\x80\x94 \';\n                    }\n                   $(\'.product_details\').val( \'Product <?php echo $product_title; ?> (ID <?php echo $product_id; ?>): \' + $attributesString );\n                }\n            });\n\n        })(jQuery);\n    </script>\n\n    <?php\n}\n

\n

代码位于活动子主题（或主题）的 function.php 文件中或任何插件文件中。

\n

\n

您将确切地了解该插件使用附加功能所做的事情：

\n

\n
• 自定义产品标题，作为邮件主题。
\n
• 所选变体属性名称标签+附加字段中的值（将被隐藏）。
\n

\n

\n

以下是我的测试服务器的屏幕截图：

\n

具有所选属性的产品:\n

\n

我在表单上得到的内容（我没有隐藏特殊文本字段来向您显示 jQuery 提取的数据）：\n

\n

如您所见，您在电子邮件\xe2\x80\xa6中获得了需要发送的数据

\n

一旦我选择了产品的属性并填写了表单的其他字段，当我提交此表单时，我会收到以下电子邮件：

\n

\n

From: John Smith <j.smith@themain.com>\nSubject: Enquire about Ship Your Idea\n\nProduct: Product Ship Your Idea (ID 40):  Color: black \xe2\x80\x94  Size: 12 \xe2\x80\x94\n\nMessage Body:\nI send this request about this very nice product \xe2\x80\xa6 I send this request about this very nice product \xe2\x80\xa6\n\n--\nThis e-mail was sent from a contact form 7\n

\n

\n

所以一切都按照您的预期工作，这是一个经过测试的示例答案。

\n