Jump to content

Оформление заказа во всплывающем окне

SPolischook
 Share

Recommended Posts

SPolischook Newbie

SPolischook

Posted
Posted (edited)

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

Давайте выведем какой то единый "рецепт счастья".

Ниже два скриншота - пошти идеал.

 

901e8986bb6a.jpg

 

014b7f388487.jpg

Edited by SPolischook (see edit history)
Link to comment
Share on other sites
Ronaldo Perez Newbie

Ronaldo Perez

Posted
Posted

а теперь магия.. я могу по скриншотам угадать параметры системы ТС :D

 

по теме: розетка это конечно хорошо, но имхо, я бы смотрел на западные примеры, амазон, ибей и т.д.

Имхо, все равно конверсию придется отдельно считать для каждой реализации в зависимости от сегмента целевых посетителей

Link to comment
Share on other sites
Ronaldo Perez Newbie

Ronaldo Perez

Posted
Posted (edited)

Серый, ты меня пугаешь, корзину через инклуд? А в модуль blockcart прописать хук footer не?)

 

А по "определить параметры системы по сриншоту" ты шото того... совсем того, работа тебя ваще затуркала. Я итак знаю параметры твоей системы и без скриншотов))

 

П.С. кстати вспомнил, тему я похожую подымал, закончилась ничем) Имхо, простейший заказ в наших условиях:

Имя + моб.телефон + все оповещения по смс

либо опционально

гор.телефон + email

и все это в рамках одной формы, показывая нужные поля по определенному событию

 

один из примеров (купил у них сегодня переноску для кота)

zootovary.com

вроде бы и все достаточно гармонично сделано на js, но настолько "загажена" страница оформления, что даже я не заметил одно нужное поле)

Edited by SergeyH (see edit history)
Link to comment
Share on other sites
SPolischook Newbie

SPolischook

Posted
  • Author
Posted

Корзина уже есть на странице. Мне в футере нужно вывести именно одностраничную форму оформления в 

<div style="display: none;"></div>

а, потом с помощью прикрученого js выводить это добро во всплывающее окно. Нажатие кнопки "оформить" в данном случае будет событием к вызову ПопАпа.

Как то так...

Link to comment
Share on other sites
zapatronen Newbie

zapatronen

Posted
Posted (edited)

ох и намучался я с этими всплывающими окнами . конечно я брал только бесплатные, но там всякие файлы левые привязываются . вы собираетесь сами написать js или позаимствовать?

Edited by zapatronen (see edit history)
Link to comment
Share on other sites
SPolischook Newbie

SPolischook

Posted
  • Author
Posted

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

Link to comment
Share on other sites
SPolischook Newbie

SPolischook

Posted
  • Author
Posted

Да, пожалуй это именно то что нужно. Все равно попробую разобратся в логике заказа, хотяб из спортивного интереса.

За модуль спасибо! :)

Link to comment
Share on other sites
Dimitri Yelquin Newbie

Dimitri Yelquin

Posted
Posted

Я у себя в блоге поставил один из плагинов с фенсибоксом (там их много с примерно равными возможностями) — насчитал 13 вариантов применения. Не успел ещё воспользоваться. Если перечислить только основное, то вот какой список получается:

фотки,

видеоролики,

форматированные тексты,

html-страницы,

PDF-документы,

слайдеры,

всплывающие окна,

скрытое содержание...

 

Последнее мне показалось особенно интересным. Тут уже спрашивали, как сделать текст во вспдывающей подсказке форматированным. Очень просто! Не надо ставить новых модулей; если правильно попросить, фенсибокс покажет.

 

Раньше я здесь описывал, как использовать фенсибокс со ссылками на картинки из текста описания (при обновлении интерфейса форума код пропал и я опубликовал это у себя в блоге). Так там не нужно было делать ничего, кроме добавления нового класса в фенсибокс (пару строчек кода в header.tpl). Таким же, примерно, образом задействуются и прочие функции фенсибокса.

Link to comment
Share on other sites
SPolischook Newbie

SPolischook

Posted
  • Author
Posted

С ПопАпом мне в принципе уже все ясно. Спасибо за подсказку, фенсибокс мне очень симпатизирует и те возможности которые вы описуете есть базовой поставке на сайте http://fancybox.net/ см. Various exampl

Меня больше интересует именно бизнес логика. Какой модуль вы используете, есть какие то свободные дабы допилить под себя?

Link to comment
Share on other sites
Евгений Медведев Newbie

Евгений Медведев

Posted
Posted (edited)

а не подскажете как сделать в фансибокс контактную форму при нажатии на кнопку? плиз оч нужно.

 

На ссылку для вызова формы контактов вешаешь обработчик onclick, который через AJAX загружает контент центральной части страницы в диалоговое окно (ну или в фэнсибокс). Только при этом возможно придется другие JS файлы править, чтобы на загруженный контент обработчики навешивать. Сейчас все построено так, что обработчики навешиваются при загрузке страницы в целом.

Edited by Евгений Медведев (see edit history)
Link to comment
Share on other sites
gabdr Newbie

gabdr

Posted
Posted

На ссылку для вызова формы контактов вешаешь обработчик onclick, который через AJAX загружает контент центральной части страницы в диалоговое окно (ну или в фэнсибокс). Только при этом возможно придется другие JS файлы править, чтобы на загруженный контент обработчики навешивать. Сейчас все построено так, что обработчики навешиваются при загрузке страницы в целом.

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

Link to comment
Share on other sites
Dimitri Yelquin Newbie

Dimitri Yelquin

Posted
Posted

Плагин, о котором я говорил, называется Easy FancyBox. Страница плагина — http://4visions.nl/wordpress-plugins/easy-fancybox/. Поиском по странице (Ctrl + f) ищем «Can I», и поиск маркирует все вопросы, начинающиеся со слов «Могу я ...». Ну, а за вопросом идёт ответ. Для тех, кто умеет допиливать, этот ФАК содержит массу подсказок, что и как надо будет допилить применительно к ПрестаШопу.

Link to comment
Share on other sites
SPolischook Newbie

SPolischook

Posted
  • Author
Posted

Плагин, о котором я говорил, называется Easy FancyBox. Страница плагина — http://4visions.nl/w...easy-fancybox/. Поиском по странице (Ctrl + f) ищем «Can I», и поиск маркирует все вопросы, начинающиеся со слов «Могу я ...». Ну, а за вопросом идёт ответ. Для тех, кто умеет допиливать, этот ФАК содержит массу подсказок, что и как надо будет допилить применительно к ПрестаШопу.

Если говорить о Престе, тогда уже лучше это - http://fancybox.net/. Оно конечно почти одно и тоже, но... почти.

а не подскажете как сделать в фансибокс контактную форму при нажатии на кнопку? плиз оч нужно.

Ответ - создать новую тему.

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

Если это было бы так просто... обычный вывод HTML в принципе вывести не сложно, по-практикуйтесь на странице плагина http://fancybox.net/, а вот когда вывод затрагивает несколько контроллеров с моделями + редиректится 3 раза как в случае с оформлением корзины...

З.Ы.: Пока еще читаю код.

Link to comment
Share on other sites
  • 3 weeks later...
SPolischook Newbie

SPolischook

Posted
  • Author
Posted

кнопка оформить сделана ссылкой, я захардкордил 

http://osport.com.ua/modules/expressorder/authentication.php

но при этом есть несколько проблем:

  1. Для авторизированных показывается форма быстрого заказа а при ее заполнении выдается ошибка - покупатель с такой почтой уже зареган
  2. Для неавторизированных но зареганых отсутствует возможность авторизироватся.

Первое решается через проверку кукисов, второе через правку шаблона.

Link to comment
Share on other sites
SPolischook Newbie

SPolischook

Posted
  • Author
Posted (edited)

По поводу первого варианта:

<a href="{if $logged != 1}/modules/expressorder/authentication.php
{else}{$link->getPageLink("$order_process.php", true)}
  {if $order_process == 'order'}?step=1{/if}
{/if}"
id="button_order_cart" class="exclusive{if $order_process == 'order-opc'}_large{/if}" title="{l s='Check out' mod='blockcart'}">{l s='Check out' mod='blockcart'}</a>

Edited by SPolischook (see edit history)
Link to comment
Share on other sites
Kerm Newbie

Kerm

Posted
Posted

У fancybox есть возможность выводить iframe, там все легко, просто указываем ссылку той страницы которую хотим открыть через fancybox со специальным ключем чтобы выводился только контент страницы, а не вся страница полностью и оформляем как нам нужно... Конечно CSS на контент в iframe не распространяется, но можно посредствам jquery добавить ссылку на CSS файл внутрь iframe или задать стиль элементу..

 

Имхо самое простое решение и не затрагивает много времени на реализацию.

Link to comment
Share on other sites
gabdr Newbie

gabdr

Posted
Posted

У fancybox есть возможность выводить iframe, там все легко, просто указываем ссылку той страницы которую хотим открыть через fancybox со специальным ключем чтобы выводился только контент страницы, а не вся страница полностью и оформляем как нам нужно... Конечно CSS на контент в iframe не распространяется, но можно посредствам jquery добавить ссылку на CSS файл внутрь iframe или задать стиль элементу..

 

Имхо самое простое решение и не затрагивает много времени на реализацию.

а поподробнее?

Link to comment
Share on other sites
SPolischook Newbie

SPolischook

Posted
  • Author
Posted

Пожалуй поддержу. Глубоко не вникал, но на сайте фенсибокса iframe и ajax оформлены простыми ссылками - как это работает не совсем понятно.

Link to comment
Share on other sites
Kerm Newbie

Kerm

Posted
Posted (edited)

В шапке:

 

<script type="text/javascript" src="http://yandex.st/jquery/fancybox/1.3.4/jquery.fancybox.js"></script>

 

+ Ссылка на локальный CSS файл фансибокса...

 

Далее:

 

$(document).ready(function() {
	$("a.iframe").fancybox({
		'type' : 'iframe'
	});
});

 

Далее:

 

<a class="iframe" href="http://site.ru/contact-us?content_only=1">Перезвонить мне</a>

 

Почти сразу у Вас может появится вопрос как изменить CSS в нутри iframe, так чтобы сама страница /contact-us не изменила свое оформление когда на нее заходят напрямую.

 

CSS на контент внутри iframe не распространяется. Мне известно решение только как это можно сделать с помощью javascript, погуглите на тему "Jquery Add css to iframe" можно найти примеры как добавить style к элементу в нутри iframe, или создать ссылку на css файл внутри iframe

Edited by Kerm (see edit history)
  • Like 1
Link to comment
Share on other sites
Kerm Newbie

Kerm

Posted
Posted

Да там тот же iframe подгружается с сайта логинзы через api, разница только в том что фансибокс это всплывающее окно...

Link to comment
Share on other sites
 Share
Go to topic listing
×
×
  • Create New...