Home › Forums › WoodMart support forum › MULTISTEP PRODUCT VARIATION ENQUIRY
MULTISTEP PRODUCT VARIATION ENQUIRY
- This topic has 7 replies, 2 voices, and was last updated 6 years, 11 months ago by
Artem Temos.
-
AuthorPosts
-
August 24, 2018 at 9:26 am #74135
WebMptParticipantHi there,
position of multistep enquiry is inside of product page according.
Step 1:
First step need an action that add product variation, quantity fields, upload input and submit button. (this is graphic layout: http://prntscr.com/kmcnu3)Step 2:
Submit go to Contact Form 7 populated fields of variation, user info fields and submit button.Step 3:
Go to last step, with “thank to user for send” text only.Thanks in advance,
FabioAugust 24, 2018 at 10:32 am #74144
Artem TemosKeymasterHi,
Sorry, but your question is not quite clear for us. Are you requesting additional code customization work for your website? Sorry, but it is out of our theme’s support scope.
Regards
August 24, 2018 at 11:19 am #74152
WebMptParticipantNo I’m not requesting additional code.
Thanks anyway
FabioAugust 24, 2018 at 11:26 am #74154
Artem TemosKeymasterOK, sorry, but there is no such multistep inquiry form. You can create a simple form with Contact form 7 only.
August 24, 2018 at 11:39 am #74155
WebMptParticipantOk I understand last question, if user select variation of a product, Contact Form 7 can populate apposite fields with variation selected?
I created this one but is different because here I just need populate with product title:
http://www.pendrivepersonalizzate.it/demo/prodotto/variable-product-example/#1534949585568-50f41143-05c1August 24, 2018 at 1:05 pm #74169
Artem TemosKeymasterMaybe this article should help you to display product title in your contact form email https://contactform7.com/special-mail-tags/
August 24, 2018 at 2:49 pm #74191
WebMptParticipantI solved it like that (Code is added after add to cart button in product page, but you can change hook or hide and show where you want with CF7 shortcode):
Contact Form 7 setting:
<label>[text* your-name input-bg placeholder “Nome*”]</label>
<label>[text* your-surname input-bg placeholder “Surname*”]</label>
<label>[text* your-tel input-bg placeholder “Tel*”]</label>
<label>[email* your-email input-bg placeholder “E-mail*”]</label>
<label>[text your-subject class:product_name]</label>
<label>[text your-details class:product_details]</label>
[submit class:btn class:btn-color-primary class:btn-shape-rectangle class:btn-size-default “Send”]Contact Form 7 mail:
— Request for product —
From: [your-name] [your-surname] <[your-email]>
Product: [your-subject]
Product Variation: [your-details]Custom function:
add_action( ‘woocommerce_after_add_to_cart_form’, ‘product_enquiry_custom_form’ );
function product_enquiry_custom_form() {global $product, $post;
//Dot forget to set HERE your Contact Form 7 shortcode:
$contact_form_shortcode = ‘[contact-form-7 id="1834" title="Preventivo Rapido"]‘;// 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 = __( ‘Enquiry for’, ‘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 ‘'; print_r( $variations_attributes ); echo '
‘;
## 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 class=”enquiry-form-title”>’.$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
}Now I try to make multistep but I think is not really easy!
Best,
FabioAugust 24, 2018 at 8:07 pm #74216
Artem TemosKeymasterOK, contact us if you will have any extra questions related to our theme.
-
AuthorPosts
- You must be logged in to create new topics. Login / Register