使用WooCommerce,我使用Contact Form 7和Product Info Request插件在单个产品页面中添加表单,因为我需要一种功能,允许用户发送有关产品的查询请求(简单的联系表单)。
你可以理解看到这个截图:
我的所有产品都是变量产品,其变体为(来自属性)。
有没有办法检索客户选择的变体并通过联系表格7发送?
例如:
用户选择颜色黑色和尺寸s,然后填写表格,当发送电子邮件时,除了接收经典信息(姓名,电子邮件ecc ..)我还收到所选属性(在这种情况下 black
和 s
)
答案 0 :(得分:2)
更新: 添加了WC 3+兼容性
我已对其进行了测试,但它不会发送与所选变体相关的任何数据,因为它只是在“添加到购物车”按钮下方(在单个商品页面中)输出所选的联系表单。此外,这个插件已经超过2年没有更新,所以它已经过时了。
好新:工作解决方案
我找到了相关的答案: Product Name WooCommerce in Contact Form 7
它解释了如何在产品标签中设置联系表格7短代码,并在电子邮件中显示所选的产品标题。
所以从这个答案我转换了代码,就像插件一样使用它(就在添加到购物车按钮的下方)。
在此示例/答案中,我已在变量产品2中设置了产品变体的属性: Color
和 Size
。< / p>
这是我在我的代码中使用的表单的 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]
。所以你还需要在你的&#34; mail&#34; &#34;邮件正文&#34;中的设置标签 [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
隐藏在 woocommerce_after_add_to_cart_form
操作挂钩中的PHP代码自定义函数:
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文件中,或者放在任何插件文件中。
您将获得该插件正在使用的附加功能:
- 自定义产品标题,作为邮件的主题。
- 其他fiels(将被隐藏)中的所选变体属性名称标签+值。
以下是我的测试服务器的屏幕截图:
我在表单上得到的内容(我不会隐藏特殊文本字段以显示jQuery提取的数据):
如您所见,您可以获得需要在电子邮件中发送的数据...
一旦我选择了产品的属性并填写了表单的其他字段,当我提交此表单时,我会收到此电子邮件:
From: John Smith <j.smith@themain.com> 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
所以,正如您预期的那样,正常工作,这是一个经过实践检验的示例答案。