2017-02-10 11 views
4

С помощью WooCommerce я использую плагины Contact Form 7 и Product Info Request, чтобы добавить форму внутри отдельных страниц продукта, так как мне нужна функциональность, которая позволяет пользователям отправлять запрос продукты (мысль простая контактная форма).Передайте выбранные данные о вариациях продукта в формуляр контакта 7 форму запроса

Вы можете понять, увидеть этот скриншот:

screeshot

Весь мой продукт изменчивы продукт с вариациями (от атрибутов).

Есть ли способ получить выбранные варианты клиентом и отправить его через контактную форму 7?

Например:

Пользователь выберите черный цвет и размер s, а затем заполнить форму и, когда электронная почта отправить в дополнение получить классическую информацию (имя, адрес электронной КИО, ..) я получаю также атрибут выбран (в данном случае black и s)

Спасибо.

+0

Hi LoicTheAztec, в первую очередь большое спасибо. Я стараюсь следовать всем шагам, но когда я заполняю форму, я не получаю изменения в почте. Я добавляю [text your-product class: product_details] на вкладке модуля, а также Продукт: [ваш-продукт] на вкладке mail. – emiliano

ответ

2

ОБНОВЛЕНО: СовместимостьДобавлена ​​WC 3+

Я испытал его, и он не будет посылать какие-либо данные, относящиеся к выбраны варианты, потому что это просто выводит выбранную форму ниже оных на тележке (на страницах с одним продуктом). Кроме того, этот плагин не обновлялся с более чем 2 лет, поэтому он устарел.

ХОРОШАЯ NEW: РАБОЧЕЕ РЕШЕНИЕ

Я нашел этот связанный ответ:Product Name WooCommerce in Contact Form 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 зацепили в 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 файле вашего активного ребенка темы (или темы), или также в любой файл плагина.

вы получите именно то, что плагин делает с того, что особенности Вспомогательные:

  • Обычай название продукта, как субъекта почты.
  • Выбранные атрибуты вариантов Название метки + значения в дополнительных филях (которые будут скрыты).

Вот экран стреляет из моего тестового сервера:

Продукт с выбранными атрибутами: enter image description here

Что я получаю от формы (я не скрыть специальное текстовое поле для покажите вам вытащенные данные по jQuery): enter image description here

Как вы видите, вы получаете данные, электронная почта ...

После того, как я выбрал атрибуты продукта и наполнили другие поля формы, когда я представить эту форму, я получаю, это сообщение электронной почты:

From: John Smith <[email protected]> 
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 работает так, как вы ожидали, и это рабочий пример тестового примера.