Варианты использования
В простейшем варианте, когда у вас есть только витрина, и вы хотите добавить к ней корзину покупателя и систему оформления заказов, вы можете воспользоваться возможностями встраивания корзины и интерфейса оформления заказа.
Если у вас уже есть витрина с корзиной, вы можете встроить на одну из страниц своего сайта интерфейс оформления заказов и привязать его к вашей корзине.
Встраивание корзины 1. Добавление товаров в корзинуЕсли у вас уже есть витрина с товарами, вам достаточно сопоставить каждому товару кнопку добавления в корзину. Для этого вам понадобятся идентификатор товара и ваш идентификатор партнёра.
В том месте, где вы хотите добавить кнопку, вставьте следующий код HTML:
<form method="post" action="http://p. my-shop. ru/order">
<input type="hidden" name="action" value="cartAddItem">
<input type="hidden" name="partner" value="XXX">
<input type="hidden" name="item" value="YYY">
<input type="submit" value="Добавить в корзину">
</form>
Замените «XXX» на ваш идентификатор партнёра, а «YYY» – на идентификатор товара.
Если вы хотите, чтобы «Добавить в корзину» была не кнопкой, а обычной ссылкой, используйте такой код HTML:
<a href="http://p. my-shop. ru/order? action=cartAddItem&partner=XXX&item=YYY">Добавить в корзину</a>
Дополнительно вы можете передавать параметр quantity, значение которого — количество единиц товара, которое необходимо добавить в корзину. По умолчанию, если этот параметр не передается (как в предыдущих примерах), в корзину добавляется одна единица товара. Пример использования этого параметра:
<form method="post" action="http://p. my-shop. ru/order">
<input type="hidden" name="action" value="cartAddItem">
<input type="hidden" name="partner" value="XXX">
<input type="hidden" name="item" value="YYY">
<input type="submit" value="Добавить в корзину">
<input type="text" name="quantity" size="3" maxlength="3" value="1"> шт.
</form>
В нужном месте страницы разместите ссылку на интерфейс оформления заказа, описанный ниже.
При нажатии на кнопку «Добавить в корзину» товар будет добавляться в корзину клиента, после чего браузер снова вернёт клиента к странице витрины, на которой была нажата кнопка добавления в корзину. Пройдя по ссылке «Оформить заказ», клиент сможет увидеть содержимое своей корзины и при необходимости изменить его. Корзина клиента хранится в файлах cookie браузера клиента. Её содержимое сохраняется в течение одного года, если клиент не очищает файлы cookie.
2. Отображение содержимого корзиныЕсли вы хотите дать пользователю возможность видеть количество товаров, которое находится в его корзине в данный момент, разместите на странице в месте, предназначенном для краткого описания содержимого корзины, следующий код:
<script type="text/javascript">
var myShopPartnerId = 'XXX';
var myShopExternalCSS = 'YYY';
document. write('<div><iframe id="myShopOnelineCartIframe" src="http://p. my-shop. ru/order? action=embedCart&partner='+myShopPartnerId+'&'+location. bstring(1)+(myShopExternalCSS?'&extcss='+encodeURIComponent(myShopExternalCSS):'')+'&nocache='+Math. ceil(Math. random()*1000000)+'" height="20" width="200" style="margin: 0; padding: 0; border: 0;" scrolling="no" frameborder="0"></iframe></div>');
</script>
Этот код будет отображать текстовую информацию следующего вида: «В корзине 2 товара (4 шт.)»
Вместо XXX подставьте свой идентификатор партнёра.
Вместо YYY вы можете подставить URL своей таблицы стилей CSS. Стили, определённые в этой таблице, будут иметь приоритет над стандартными стилями страницы оформления заказа. Если вы не хотите подключать свою таблицу стилей, оставьте это поле пустым (удалите YYY).
В своей таблице стилей вы можете использовать селектор div#myShopOneLineCartDiv для определения стиля отображаемой текстовой строки. Например, если вы хотите выводить строку синим цветом:
div#myShopOneLineCartDiv { color: blue }
3. Встраивание корзины одним партнёром на нескольких сайтахЕсли встроить корзину с одним и тем же идентификатором партнёра на двух или более сайтах, программа будет считать, что на всех этих сайтах одна и та же корзина. В результате, при добавлении товара в корзину на первом сайте, тот же товар окажется в корзине на втором сайте, и наоборот. Чтобы избежать этого, достаточно добавить к вашему идентификатору партнёра суффикс вида «_NNN», где NNN – число, которое вы присвоите каждому из ваших сайтов. Например, если вы хотите встроить корзину на двух сайтах, и ваш идентификатор партнёра – «350», вы можете использовать идентификатор «350_1» на первом сайте и идентификатор «350_2» на втором сайте. Обратите внимание, что аналогичным образом идентификаторы партнёра нужно будет изменить во всех формах для встраивания: «добавление товаров в корзину», «отображение содержимого корзины» и «встраивание интерфейса оформления заказа».
Создайте на вашем веб-сайте страницу, на которой будет происходить оформление заказа. Эта страница может быть обычной статической HTML-страницей или скриптом, написанном на одном из языков программирования (PHP, Perl и т. п.). Страница может содержать любые элементы оформления, например, иметь общий дизайн с другими страницами вашего сайта; однако на странице должно быть оставлено свободное место шириной минимум 650 пикселей для формы оформления заказа.
В исходный текст страницы оформления заказа, в том месте, в котором вы хотели бы видеть форму оформления заказа, добавьте следующий код HTML:
<script type="text/javascript">
var myShopPartnerId = 'XXX';
var myShopExternalCSS = 'YYY';
var myShopExternalJS = 'JJJ';
var myShopClearCartURL = 'ZZZ';
document. write('<scr'+'ipt type="text/javascript" charset="windows-1251" src="http://p. my-shop. ru/order? form=JS_embed&partner='+myShopPartnerId+'&'+location. bstring(1)+(myShopExternalCSS?'&extcss='+encodeURIComponent(myShopExternalCSS):'')+(myShopExternalJS?'&extjs='+encodeURIComponent(myShopExternalJS):'')+(myShopClearCartURL?'&clearcart='+encodeURIComponent(myShopClearCartURL):'')+'&nocache='+Math. ceil(Math. random()*1000000)+'"></sc'+'ript>');
</script>
Вместо XXX подставьте свой идентификатор партнёра.
Вместо YYY вы можете подставить URL своей таблицы стилей CSS. Стили, определённые в этой таблице, будут иметь приоритет над стандартными стилями страницы оформления заказа. Если вы не хотите подключать свою таблицу стилей, оставьте это поле пустым (удалите YYY).
Вместо JJJ вы можете подставить URL своего JavaScript-кода (подробное описание этой возможности см. ниже). Если вы не хотите подключать свой код JavaScript, оставьте это поле пустым (удалите JJJ).
Вместо ZZZ вы можете подставить URL скрипта на своём сайте, который будет вызван (но не отображён) после успешного оформления заказа. Программа по указанному вами URL может очищать корзину вашего магазина (если вы использовали собственную корзину) или выполнять другие действия, связанные с окончанием оформления заказа. Если вы не хотите использовать эту возможность, оставьте это поле пустым (удалите ZZZ).
Если вы пользуетесь встроенной корзиной (см. выше), всё готово к работе. Убедитесь, что всё работает правильно, добавив какой-нибудь товар в корзину и перейдя на страницу оформления заказа.
Если вы используете собственную корзину, вам нужно «привязать» корзину к системе оформления заказов. Программная часть вашего магазина должна работать таким образом, чтобы ссылка на страницу оформления заказа содержала параметр cart. Значением параметра cart должно быть содержимое корзины в виде идентификатор1-количество1,идентификатор2-количество2,... (под идентификаторами подразумеваются идентификаторы товаров в My-shop. ru). Например, если ваша страница оформления заказа доступна по адресу
http://your-site. ru/order. html
ссылка на оформление заказа может выглядеть приблизительно так:
http://your-site. ru/order. html? cart=16-1,17-2
Убедитесь, что всё работает правильно, обратившись к странице оформления заказа с использованием параметра cart.
Если вам необходимо изменить ширину формы, вы можете воспользоваться возможностью подключения своей таблицы стилей CSS (параметр myShopExternalCSS), определив в ней ширину width для элементов класса myshop_base_width. Пример (для ширины 700px):
.myshop_base_width { width: 700px; }
Не указывайте ширину меньше 650px, в противном случае приложение будет работать некорректно (это может проявляться не во всех браузерах).
Подключение своего JavaScript-кода: если вы хотите, чтобы ваш код начал работать после загрузки фрейма, необходимо использовать следующую конструкцию:
window. addEventListener('load', function() {
// ваш код, исполняемый после загрузки фрейма
});
Выполнение этого кода не должно прерывать прорисовку страницы. Например, если в этом коде будет вызвана функция alert(), форма оформления заказа может работать некорректно.
Этот код выполняется после загрузки фрейма, но до загрузки информации о ценах. При этом DOM со всеми вариантами оплаты и доставки уже сформирован, однако строки в таблицах вариантов доставки и оплаты имеют CSS-стиль «display: none», и в ячейках с ценами отсутствует содержимое.
