Перейти к содержимому


Открытая Форма Заказа.


  • Авторизуйтесь для ответа в теме
Сообщений в теме: 16

#1 kost_t-human

kost_t-human

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 52 сообщений

Отправлено 04 Июнь 2013 - 17:24

Подскажите, как правильно организовать "открытую" форму заказа. Хочу сделать так, чтобы прямо на карточке товара, вместо кнопки "В корзину" было 2 поля - имя и номер телефона.  А по нажатию "Купить" сразу создавался заказ и покупателя перекидывало или на страницу заказа или просто всплывающее окошко с текстом подтверждения. А в админке появлялся новый заказ.

Это бы подняло конверсию магазина, ибо подталкивает покупателя сразу заказать.

С налета ничего не получается, не до конца понимаю механику работы движка.

Помогите пожалуйста!

Аккаунт SL-146284

#2 miyako

miyako

    Активный участник

  • Модератоpы
  • 5 372 сообщений

Отправлено 05 Июнь 2013 - 15:11

Просмотр сообщенияkost_t-human (04 Июнь 2013 - 17:24) писал:

Подскажите, как правильно организовать "открытую" форму заказа. Хочу сделать так, чтобы прямо на карточке товара, вместо кнопки "В корзину" было 2 поля - имя и номер телефона.  А по нажатию "Купить" сразу создавался заказ и покупателя перекидывало или на страницу заказа или просто всплывающее окошко с текстом подтверждения. А в админке появлялся новый заказ.

Это бы подняло конверсию магазина, ибо подталкивает покупателя сразу заказать.

С налета ничего не получается, не до конца понимаю механику работы движка.

Помогите пожалуйста!

Аккаунт SL-146284

Можно сделать в виде форме обратного звонка.
http://forum.storela...нок/#entry31876
За исключением того, что форму нужно будет вставить не на отдельную страницу, а прямо в шаблон Товар.
Можете изобарзить на скриншоте, как именно должна выглядеть карточка товара с этими полями?

#3 kost_t-human

kost_t-human

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 52 сообщений

Отправлено 05 Июнь 2013 - 15:56

Например так, как в скрине. Расположение не так важно, его и поменять можно) Главное чтобы форма работала =))

Да, на счет обратного звонка уже думал, с этим все просто, у меня как раз обратный звонок и прикручен. Но хотелось бы чтобы заказы в админку падали, а не на е-мейл. Да и капча со стороннего сервиса напрягает...
Жаль что нельзя на php сваять форму, это бы я быстро)

Прикрепленные изображения

  • 111.jpg


#4 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 217 сообщений

Отправлено 06 Июнь 2013 - 00:49

К сожалению, нельзя реализовать подобное

#5 kost_t-human

kost_t-human

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 52 сообщений

Отправлено 06 Июнь 2013 - 09:52

Просмотр сообщенияVaccina (06 Июнь 2013 - 00:49) писал:

К сожалению, нельзя реализовать подобное
А коммерческим путем реально? =) У вас есть тех отдел же, что занимается этим?

#6 kost_t-human

kost_t-human

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 52 сообщений

Отправлено 06 Июнь 2013 - 18:07

Вы хоть сумму назовите, этож не законы физики, что нарушить нельзя) в интернете все можно сделать)

#7 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 217 сообщений

Отправлено 07 Июнь 2013 - 00:54

Мы не подкупаемы :)
Вы можете оставить заявку на улучшение и доработку по сл.ссылке: storeland.reformal.ru
Чем больше голосов соберет ваша идея, тем быстрее мы поставим к себе в задачник ее для реализации.

#8 kost_t-human

kost_t-human

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 52 сообщений

Отправлено 07 Июнь 2013 - 10:18

Просмотр сообщенияVaccina (07 Июнь 2013 - 00:54) писал:

Мы не подкупаемы :)
Вы можете оставить заявку на улучшение и доработку по сл.ссылке: storeland.reformal.ru
Чем больше голосов соберет ваша идея, тем быстрее мы поставим к себе в задачник ее для реализации.
Я понимаю что неподкупаемы) Но я бы отблагодарил, если бы кто то из программистов взялся бы за работу) Вы назовите цену, и может народ подтянется и всем миром скинемся)
Для начала было бы неплохо доработать "быстрый заказ", чтобы товары не валились в корзину после каждой открытии формы. Не хочется лезть на фриланс, ибо знакомому с платформой это проще сделать.

С надеждой на лучшее, Константин.

Оставил заявку, кому интересно, голосуем) http://storeland.ref...eland?ia=473726

#9 Koderhan

Koderhan

    Активный участник

  • Модератоpы
  • 6 227 сообщений

Отправлено 07 Июнь 2013 - 11:42

Попытался сделать форму быстрого заказа на странице карточки товара.
Представленные здесь коды предназначены для шаблона Сияние.

Все данные я не стал выводить в карточке товара. А вывел лишь три основных поля как вы показали на скриншоте. И естественно другие поля для заполнения не будут доступны. Если даже у вас будет несколько видов доставки например, то пользователь не сможет выбрать их при оформление заказа данным способом.
Вот скриншот формы:
ScreenShot 652.png

Панель администратора, "Сайт"->"Редактор тем".
В файле "main.css".
Добавить после код:
		 <div class="goodsDataMainOrder cornerAll" itemscope itemprop="offerDetails" itemtype="http://data-vocabulary.org/Offer">
			 <table>
код:
				  <tr>
<td colspan="2">
<div class="oform"></div>
<div class="formContacts">
<form action="" method="post" class="contacts">
<div class="formblock">
<label for="reg_name" >ФИО*</label>
<input id="reg_name" name="form[contact][person]" value="{ORDER_FORM_CONTACT_PERSON}" maxlength="100" class="required input-text" type="text"/>
</div>
<div class="formblock">
<label for="contactEmail">E-mail{% IF ORDER_FORM_CONTACT_WANT_REGISTER %}*{% ENDIF %}</label>
<input id="contactEmail" name="form[contact][email]" value="{ORDER_FORM_CONTACT_EMAIL}" maxlength="255" class="{% IF ORDER_FORM_CONTACT_WANT_REGISTER %}required{% ENDIF %} email input-text" type="text"/>
</div>
<div class="formblock">
<label for="sites_client_phone" >Телефон для связи*</label>
<input id="sites_client_phone" name="form[contact][phone]" value="{ORDER_FORM_CONTACT_PHONE}" maxlength="255" class="required input-text" type="text"/>
</div>
<div class="formblock">
<input name="go" class="goContacts" type="button" value="Оформить заказ" />
</div>
</form>
</div>
</td>
</tr>
ScreenShot 651.png


Панель администратора, "Сайт"->"Редактор тем".
В файле "main.css".
Добавить в конец файла код:

.formContacts {
width: 100%;
padding: 12px;
}
.formContacts input {
display: block;
padding: 4px;
float: right;
margin-bottom: 9px;
}
.formContacts label {
display: block;
}


.goContacts {
font: bold 12px/30px Tahoma, Geneva, sans-serif;
color: #666;
text-decoration: none;
background: url({ASSETS_IMAGES_PATH}read_more.jpg) no-repeat left bottom;
height: 30px;
width: 128px;
padding-left: 15px;
display: block;
border-radius: 14px;
padding-bottom: -10px;
border: 0px;
color:white;
}
.goContacts:hover{
color: #fff;
background: url({ASSETS_IMAGES_PATH}read_more.jpg) no-repeat left top;

}


.formContacts .formblock {
width: 47%;
padding-top: 4px;
padding-bottom: 4px;
}

Панель администратора, "Сайт"->"Редактор тем".
В файле "main.js".
Добавить в конец файла код:
$(function() {

	$('.goContacts').click(function() {
//alert('hi');
		regName = $('#reg_name').val();
		contactEmail = $('#contactEmail').val();
		phone = $('#sites_client_phone').val();
// Быстрый заказ
		function quickorder(formSelector) {

// Находим форму, которую отправляем на сервер, для добавления товара в корзину
			var formBlock = $($(formSelector).get(0));

// Проверка на существование формы отправки запроса на добавление товара в корзину

			console.log(formBlock);
// Получаем данные формы, которые будем отправлять на сервер
			var formData = formBlock.serializeArray();

// Сообщаем серверу, что мы пришли через ajax запрос
			formData.push({name: 'ajax_q', value: 1});
// Так же сообщим ему, что нужно сразу отобразить форму быстрого заказа
			formData.push({name: 'fast_order', value: 1});

// Аяксом добавляем товар в корзину и вызываем форму быстрого заказа товара
			$.ajax({
				type: "POST",
				cache: false,
				url: formBlock.attr('action'),
				data: formData,
				success: function(data) {
//console.log(regName);
					$('.oform').hide();
					d = $(".oform").html(data);
					console.log(d);

					$(d).find('#reg_name').val(regName);
					$(d).find('#contactEmail').val(contactEmail);
					$(d).find('#sites_client_phone').val(phone);
					$(d).find('.buttons-set .submit').click();
				}
			});

			return false;
		}

		quickorder('.goodsDataForm');

	});


});


Загрузить в редактор шаблонов файл быстрого оформления заказа.
Прикрепленный файл  order_fast (1).zip   5,8К   86 Количество загрузок:
Нужно распаковывать архив и загрузить сам html файл.

Сообщение отредактировал Koderhan: 10 Июнь 2013 - 12:14
Исправления в файле main.js и Товар


#10 kost_t-human

kost_t-human

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 52 сообщений

Отправлено 08 Июнь 2013 - 14:49

Просмотр сообщенияKoderhan (07 Июнь 2013 - 11:42) писал:

Попытался сделать форму быстрого заказа на странице карточки товара. Представленные здесь коды предназначены для шаблона Сияние. Все данные я не стал выводить в карточке товара. А вывел лишь три основных поля как вы показали на скриншоте. И естественно другие поля для заполнения не будут доступны. Если даже у вас будет несколько видов доставки например, то пользователь не сможет выбрать их при оформление заказа данным способом.

Сделал, но товар прыгает в корзину, а дальше никаких действий вообще. пробовал тут - http://s740840.store...люква?from=NmU0

Перепроверил еще раз.
Сделал точно все действия.

#11 miyako

miyako

    Активный участник

  • Модератоpы
  • 5 372 сообщений

Отправлено 08 Июнь 2013 - 15:02

Просмотр сообщенияkost_t-human (08 Июнь 2013 - 14:49) писал:

Сделал, но товар прыгает в корзину, а дальше никаких действий вообще. пробовал тут - http://s740840.store...люква?from=NmU0

Перепроверил еще раз.
Сделал точно все действия.

У вас код:
<script type="text/javascript">// <![CDATA[
$(document).ready(function(){
$(".zvonok").click(function() {
//new Messi('<form action="http://main-ip.ru/mail.php" method="post"><input type="hidden" name="zagol_soob" value="" /><div style="padding: 8px 20px 0px 20px;">Номер телефона</div><div style="padding: 1px 20px 0px 20px;"><input maxlength="280" id="feedback_name" name="form[feedback_name]" value="" style="width: 360px; height: 30px; background: #FFFFFF; border: 1px solid #CCCCCC; color: #191970; border-radius: 5px; font-size: 25px;text-align:center;" type="text" /><input type="hidden" name="pole_1b" value="Номер телефона" /></div><div style="padding: 8px 20px 0px 20px;">Имя</div><div style="padding: 1px 20px 0px 20px;"><input maxlength="280" name="name" style="width: 360px; height: 30px; background: #FFFFFF; border: 1px solid #CCCCCC; color: #191970; border-radius: 5px; font-size: 25px;text-align:center;" type="text" name="pole_1a" maxlength="900" /><input type="hidden" name="pole_1b" value="Номер телефона" /></div><div style="padding: 8px 20px 0px 20px;">Число на картинке<br /> <input style="width: 120px; height: 20px; background: #FFFFFF; border: 1px solid #CCCCCC; color: #191970; border-radius: 5px;" type="text" name="captcha" maxlength="12" /></div><div style="padding: 10px 20px 10px 0px;"><a href="http://main-ip.ru/"><img src="http://main-ip.ru/captcha.php" alt="" border="0" style="padding:0px 20px;"/></a></div><div style="padding: 5px 20px 15px 20px; text-align: right; width: 358px;"><input class="btn" style="cursor: pointer; width: 200px;" type="submit" value="Отправить" /></div></div></form>',{title: 'Заказать обратный звонок', titleClass: 'info', buttons: [{id: 0, label: 'Закрыть', val: 'X'}]} );return false;
new Messi('<form action="http://s740840.storeland.ru/feedback" method="post"><input type="hidden" name="zagol_soob" value="" /><div style="padding: 8px 20px 0px 20px;">Номер телефона</div><div style="padding: 1px 20px 0px 20px;"><input maxlength="280" name="name" style="width: 360px; height: 30px; background: #FFFFFF; border: 1px solid #CCCCCC; color: #191970; border-radius: 5px; font-size: 25px;text-align:center;" type="text" name="pole_1a" maxlength="900" /><input type="hidden" name="pole_1b" value="Номер телефона" /></div><div style="padding: 8px 20px 0px 20px;">Имя</div><div style="padding: 1px 20px 0px 20px;"><input maxlength="280" name="name" style="width: 360px; height: 30px; background: #FFFFFF; border: 1px solid #CCCCCC; color: #191970; border-radius: 5px; font-size: 25px;text-align:center;" type="text" name="pole_1a" maxlength="900" /><input type="hidden" name="pole_1b" value="Номер телефона" /></div><div style="padding: 8px 20px 0px 20px;">Число на картинке<br /> <input style="width: 120px; height: 20px; background: #FFFFFF; border: 1px solid #CCCCCC; color: #191970; border-radius: 5px;" type="text" name="captcha" maxlength="12" /></div><div style="padding: 10px 20px 10px 0px;"><a href="http://main-ip.ru/"><img src="http://main-ip.ru/captcha.php" alt="" border="0" style="padding:0px 20px;"/></a></div><div style="padding: 5px 20px 15px 20px; text-align: right; width: 358px;"><input class="btn" style="cursor: pointer; width: 200px;" type="submit" value="Отправить" /></div></div></form>',{title: 'Заказать обратный звонок', titleClass: 'info', buttons: [{id: 0, label: 'Закрыть', val: 'X'}]} );return false;
}
);
});
// ]]>
  <div id="feedbackForm" style="display: none;">
Uncaught SyntaxError: Unexpected token <
<img style="margin:10px 0 10px 25px" src="http://s740840.storeland.net/logo_header2.png"/><br/>
<form method="post" action="http://s740840.storeland.ru/feedback" class="feedbackForm" enctype="multipart/form-data">
<div style="margin: 5px 25px 0 25px;">
		 <input type="hidden" name="hash" value="3773a8" />	
				  <label for="feedback_name">Представьтесь, пожалуйста</label>
		 <input style="width:250px" id="feedback_name" name="form[feedback_name]" value="" maxlength="50" class="input required" /><br /><br />
		 <input style="display:none" id="feedback_еmail" name="form[feedback_email]" value="zakaz_zvonka@ya.ru" maxlength="255" class="input required email" />
		 <label for="feedback_message">Ваш телефон</label>
		 <input id="feedback_message" name="form[feedback_message]" class="required"></input><br /><br />
		 <input type="submit" class="button_med" value="Отправить"/><br /><br /><br />
		 </div>
</form>
</div>
</script>
в шаблоне HTML стоит то тега </head>. По какой инструкции вы устанавливали кнопку Быстрый заказ?

#12 kost_t-human

kost_t-human

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 52 сообщений

Отправлено 08 Июнь 2013 - 16:04

Просмотр сообщенияmiyako (08 Июнь 2013 - 15:02) писал:

У вас код:
..................
в шаблоне HTML стоит то тега </head>. По какой инструкции вы устанавливали кнопку Быстрый заказ?

Это форма обратного звонка. Прикручивал со стороннего сервиса. по инструкции где то тут на форуме.
Быстрый заказ делал по http://forum.storela...лон/#entry58702
плюс немного другой код в скрипт где то из той же темы.

Быстрый заказ то прекрасно работает, а вот открытая форма - нивкакую

п.с. то что ошибку выдает по "вкорзину" - так это я в main.js закомментил прошлый "быстрый заказ" чтобы не мешало, искал причину. Но и с ним тоже не работало...

п.п.с только что сбросил магазин по дефолту - точно такая же история. товар попадает в корзину, но не более того.

#13 Koderhan

Koderhan

    Активный участник

  • Модератоpы
  • 6 227 сообщений

Отправлено 10 Июнь 2013 - 12:17

http://forum.storela...аза/#entry71898
Сообщение выше отредактировал. Теперь должно работать.

#14 kost_t-human

kost_t-human

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 52 сообщений

Отправлено 10 Июнь 2013 - 15:25

Просмотр сообщенияKoderhan (10 Июнь 2013 - 12:17) писал:

http://forum.storela...аза/#entry71898
Сообщение выше отредактировал. Теперь должно работать.
ОЕ!!!! Премного благодарен)))) Вы лучшие))

#15 kost_t-human

kost_t-human

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 52 сообщений

Отправлено 27 Июнь 2017 - 20:06

Как же давно я с вами :) Здравствуйте!
Осваиваю новый шаблон Лазурь.

Тестовый аккаунт SL-417973
Делал открытую форму заказа по тем же принципам, что написал уважаемый Koderhan. На странице товара все отлично получилось, а в быстром просмотре скрипты не работают :(

Прошу помощи!

#16 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 217 сообщений

Отправлено 28 Июнь 2017 - 07:06

Здравствуйте.

Попробуйте удалить вставочный код из main.js и в шаблоне HTML после <body> вставить:
<script>
$(document).ready(function () {
$('.goContacts').click(function () {
alert('hi');
regName = $('#reg_name').val();
contactEmail = $('#contactEmail').val();
phone = $('#sites_client_phone').val();
quickDeliveryComment = $('#quickDeliveryComment').val();
// Быстрый заказ
function quickorder(formSelector) {
	 // Находим форму, которую отправляем на сервер, для добавления товара в корзину
	 var formBlock = $($(formSelector).get(0));
	 // Проверка на существование формы отправки запроса на добавление товара в корзину
	 // Получаем данные формы, которые будем отправлять на сервер
	 var formData = formBlock.serializeArray();
	 // Сообщаем серверу, что мы пришли через ajax запрос
	 formData.push({
	 name: 'ajax_q',
	 value: 1
	 });
	 // Так же сообщим ему, что нужно сразу отобразить форму быстрого заказа
	 formData.push({
	 name: 'fast_order',
	 value: 1
	 });
	 // Аяксом добавляем товар в корзину и вызываем форму быстрого заказа товара
	 $.ajax({
	 type: 'POST',
	 cache: false,
	 url: formBlock.attr('action'),
	 data: formData,
	 success: function (data) {
		 $('.oform').hide();
		 d = $('.oform').html(data);
		 $(d).find('#reg_name').val(regName);
		 $(d).find('#contactEmail').val(contactEmail);
		 $(d).find('#sites_client_phone').val(phone);
		 $(d).find('#quickDeliveryComment').val(quickDeliveryComment);
		 $(d).find('.buttons-set .submit').click();
	 }
	 });
	 return false;
}
quickorder('.goodsDataForm');
});
});
</script>


#17 kost_t-human

kost_t-human

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 52 сообщений

Отправлено 28 Июнь 2017 - 13:08

Просмотр сообщенияVaccina (28 Июнь 2017 - 07:06) писал:

Здравствуйте.

Попробуйте удалить вставочный код из main.js и в шаблоне HTML после <body> вставить:
<script>
$(document).ready(function () {
$('.goContacts').click(function () {
alert('hi');
regName = $('#reg_name').val();
contactEmail = $('#contactEmail').val();
phone = $('#sites_client_phone').val();
quickDeliveryComment = $('#quickDeliveryComment').val();
// Быстрый заказ
function quickorder(formSelector) {
	 // Находим форму, которую отправляем на сервер, для добавления товара в корзину
	 var formBlock = $($(formSelector).get(0));
	 // Проверка на существование формы отправки запроса на добавление товара в корзину
	 // Получаем данные формы, которые будем отправлять на сервер
	 var formData = formBlock.serializeArray();
	 // Сообщаем серверу, что мы пришли через ajax запрос
	 formData.push({
	 name: 'ajax_q',
	 value: 1
	 });
	 // Так же сообщим ему, что нужно сразу отобразить форму быстрого заказа
	 formData.push({
	 name: 'fast_order',
	 value: 1
	 });
	 // Аяксом добавляем товар в корзину и вызываем форму быстрого заказа товара
	 $.ajax({
	 type: 'POST',
	 cache: false,
	 url: formBlock.attr('action'),
	 data: formData,
	 success: function (data) {
		 $('.oform').hide();
		 d = $('.oform').html(data);
		 $(d).find('#reg_name').val(regName);
		 $(d).find('#contactEmail').val(contactEmail);
		 $(d).find('#sites_client_phone').val(phone);
		 $(d).find('#quickDeliveryComment').val(quickDeliveryComment);
		 $(d).find('.buttons-set .submit').click();
	 }
	 });
	 return false;
}
quickorder('.goodsDataForm');
});
});
</script>

В шаблоне HTML после <body> не помогло, за то прямо перед формой в "Товар" - отлично заработало. Спасибо большое, вы лучшие, как всегда!




Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 анонимных