Как получать заказы в гугл форму?

Начиная с версии 6.8.0 подключать форму вручную не нужно код гугл формы для приема заказов генерирует скрипт гугл таблицы. Поэтому, если вы хотите получать заказы в гугл таблицу и в почту, просто создайте копию магазина на гугл таблицах 2.2 и запустите макрос из правого верхнего угла, как в этом уроке

После этого в строке №6 google_form вкладки system будет сгенерирован чистый код гугл формы. Вы можете продолжить делать магазин на гугл таблицах или перейти на Excel или добавлять товары вручную через меню галочка.

Так же можно использовать код из ячейки в чистом виде для любых своих проектов.

В бесплатной CMS для интернет магазина HEEG.HTML функцию отправки заказа (форма отправляет письмо на почту) и ведения таблицы заказов берет на себя бесплатный сервис "Гугл формы". Благодаря этому сервису все ваши заказы хранятся в удобной таблице, с которой могут работать одновременно несколько менеджеров по персональному доступу. Пример таблицы из демо-магазина можно посмотреть здесь https://docs.google.com/spreadsheets/d/1cEUxBevucIvfwj1g8ctD2C4uAIsN90M44ynLLf9aScw/ (фома заполняется автоматически при заказе)

Начиная с версии 5.0 заказы из тестовых магазинов приходят в таблицу https://docs.google.com/spreadsheets/d/1XpwKOhR7Q4nSfBEOJxhAqAIgdCRZoHb5du7fOAxKS-A/ Вместо дополнения можно добавить скрипт гугл формы и настроить его под себя. Скрипт имеет целый ряд преимуществ перед дополнением. Например таблица товаров при отправки скриптом становится "читабельной". Так же у срипта отсутствует реклама дополнения в конце каждого письма с заказом и есть возможность отправлять разные письма в магазин и клиенту.

function onSubmit() {
var  form = FormApp.getActiveForm();
 var formResponses = form.getResponses();
 var newline ="";
 var emailQuotaRemaining = MailApp.getRemainingDailyQuota();

var clientsMail="info@heeg.ru";
var shopmail="info@heeg.ru";

var tableorders ="<br><a href='https://docs.google.com/spreadsheets/d/1XpwKOhR7Q4nSfBEOJxhAqAIgdCRZoHb5du7fOAxKS-A/'> ОТКРЫТЬ ТАБЛИЦУ С ЗАКАЗАМИ<\/a>"  
  
  
var k=formResponses.length-1;
var textlog="<tr><td>порядковый номер: <\/td><td>"+ (k + 1).toString()+"<\/td><\/tr>";

   var formResponse = formResponses[k];
   var itemResponses = formResponse.getItemResponses();
   for (var j = 0; j < itemResponses.length; j++) {
     var itemResponse = itemResponses[j];
    newline="<br><tr><td><b>"  +  itemResponse.getItem().getTitle() +":<\/b><\/td><td>" +  itemResponse.getResponse()+" <\/td><\/tr>"
   if (itemResponse.getItem().getTitle()=="manager_comments"){
     newline= "<table cellspacing='0' border='1'>" + itemResponse.getResponse().replace(/\[/g ,"<tr><td>").replace(/\|/g ,"<\/td><td>").replace(/\]/g ,"<\/td><\/tr>") +"<\/table> " ; 
      }
    if (itemResponse.getItem().getTitle()=="email"){
     clientsMail=itemResponse.getResponse();
      }  
     
     
   var textlog =  textlog + newline; 
   }




                    
  MailApp.sendEmail({to:shopmail, name:"Магазин ПОДАРКОВ" ,  subject: "Поступил заказ", htmlBody: textlog+"<br>квота:"+emailQuotaRemaining+tableorders});                 
 
  
  if(clientsMail!="info@heeg.ru"){ 
MailApp.sendEmail({to: clientsMail, name:"МагазинПОДАРКОВ" ,  subject: "Спасибо за ваш заказ!", htmlBody: textlog});  
  }  
}

После добавления скрипта к гугл форме необходимо включить тригер проекта (в скриптах кнопка с часиками) , чтобы скрипт срабатывал при появлении нового заказа.

Обратите внимание, что скрипт берет таблицу заказа из колонки manager_comments, а почту клиента из клонки email, поэтому если вам захочется переименовать эти поля, не забудьте переименовать их в скрипте.

Так же обратите внимание, что немножко изменился вид ссылки на заказ. Появился симпол "?" вместо второго "#" так как некоторые почтовые сервисы не понимали ссылки с двойным "#"

Клиенту и магазину скрипт отправляет разные письма, если клиент не заполнил свою почту и вместо нее стоит "почта заглушка", то скрипт не отправляет дубликат и квота (100 писем в день) не расходуется.

Для привязки гугл формы к вашему магазину нужна почта на G-mail. Заходим в гугл формы и создаем новую форму с текстовыми полями как в форме ниже (названия менять нельзя). поля просто текстовые безо всяких проверок и подсказок. Потом привязываем ее к гугл табличке (зеленая кнопка с крестом)

 

Если вам не удается просмотреть или отправить форму, заполните ее здесь.

Заказ в интернет магазине

Ваша корзина
* Обязательно

    order_number
    name
    email
    telephone
    delivery_adress
    link_for_your_order
    client_comments
    manager_comments


 

потом ставим себе дополнение Notify (или Email Notifications for Forms если вам нужны все данные заказа в письме) и показываем из какого поля почту брать для отправки напоминания И ПОЧТУ ВАШЕГО МАГАЗИНА (она не обязательно должна быть g-mail). Когда сделаете форму - отправляете сами себе ее на почту.

Иногда письмо с кодом формы на почту не приходит, или в полях отсутвуют (пустые) aria-label в этом случае получить код формы можно нажав кнопку "глазик" (просмотр), а потом также "показать код" формы через правый клик, заменить верхнюю часть по инструкции ниже и добавить код <input type="submit" name="rsubmit" value="Готово"> в самый конец перед </form>

Теперь пойдет самая сложная часть. В письме с формой щелкаем правой кнопкой мыши и выбираем "проинспектировать элемент" если в IE и "показать код" если ты в хроме.

из дерева нужно скопировать этот кусок кода  и немножко поменять начало и конец формы, как должно получится я выделил зеленым в двух местах. 1D4cho-vxcDc-pnLhhMSODcHMfOoc6Om9vtO9iIjsbkc - это код  формы демо-магазина, у вас будет свой код. Взять его можно из  места, которое я выделил желтым.

 

<div id="style_14569137620000000154_BODY"><div style="width: 576px; display: inline;"><div itemtype="http://schema.org/ViewAction" itemprop="action">
</div>

Если вам не удается просмотреть или отправить форму, заполните ее <a href="https://docs.google.com/forms/d/1D4cho-vxcDc-pnLhhMSODcHMfOoc6Om9vtO9iIjsbkc/viewform?c=0&amp;w=1&amp;usp=mail_form_link" target="_blank">здесь</a>.
<p></p>
<div dir="ltr"><div><h1 style="margin: 0.67em 0px;" dir="ltr">Заказ в интернет магазине</h1></div>
<div style="display: inline; white-space: pre-wrap;"><div style="font: inherit; margin: 0px 0px 1em; width: 99%; white-space: pre-wrap; -ms-word-wrap: break-word; font-size-adjust: inherit; font-stretch: inherit;" dir="ltr">Ваша корзина</div>

<div style="color: rgb(196, 59, 29);">*&nbsp;Обязательно</div></div>
<div><div>

<iframe name="my_iframe" style="display:none;"></iframe>
<form action="https://docs.google.com/forms/d/1D4cho-vxcDc-pnLhhMSODcHMfOoc6Om9vtO9iIjsbkc/formResponse" method="POST" target="my_iframe" >


<ol role="list">
/   здесь  идет код вашей формы
<input type="submit" name="rsubmit" value="Готово">
</td>
</tr></tbody></table></div></ol></form></div>
<div><div></div>
<div><div></div>
</div></div>
</div></div>
<br>
</div></div>

 

 Полученную форму нужно вставить в статью http://novye-podarki.ru/heeg.html#google_form 
(вместо novye-podarki – адрес вашего магазина) и собственно все, теперь все заказы будут уходить в вашу форму на гугле.

 

ДОПОЛНЕНИЕ:

 

вот так выглядит код одного поля в форме гугл

<div role="listitem">
<div style="margin: 12px 0px;" dir="auto"><div style="margin-top: 0px; margin-bottom: 1.5em; margin-left: 0px; vertical-align: middle; max-width: 100%;">
<div style="font-weight: bold; margin-top: 0.83em; margin-bottom: 0.83em; display: block;">order_number
</div>
<div style="margin: 0.1em 0px 0.25em; color: rgb(102, 102, 102); display: block;" dir="auto"></div>
<input name="entry.380347480" title="" dir="auto" aria-label="order_number" type="text" value="">

 

 

По номеру entry    форма в магазине связывается с гугл формой. Код этот выдается гуглом при создании формы и он уникален для каждого поля каждой формы и его менять нельзя. (у вас будут свои номера)


а в aria-label мы показываем скрипту магазина в поле с каким лейблом записывать информацию о заказе.

Позднее, для того чтобы пользователи не спамили в вашу форму напрямую. Можно добавить проверку в номер заказа, чтобы он содержал Z_ а поле со ссылкой на заказ http

Во второй части видеоурока описано как правильно подключить гугл форму.