Урок 66. Шаблон страницы заказа

Способ получения заказа покупатель указывает на стадии оформления заказа. Эта информация может быть выведена с помощью переменной $DELIVERY$. В равной степени это относится и к $PAYMENT$. Убедитесь, что эти переменные присутствуют в шаблоне.

Можно указывать срок получения в виде следующей фразы: "Через три дня после оформления заказа". Так пользователю нужно будет самому рассчитать дату доставки и не забыть ее.

Хорошим решением будет рассчитать за пользователя срок доставки. Подобное решение можно найти здесь.

Текущий статус заказа хранит переменная $ORDER_STATUS$. Убедитесь, что она есть в шаблоне и заметна на странице.

Уделите особое внимание управлению заказами. Подробнее о заказах и статусах можно узнать в этом уроке.

Продвинутое решение для статусов - это показать всю цепочку от получения до вручения. Сделать это можно с помощью скрипта Визуализация статусов заказа.

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

Т.е. такая кнопка “Оплатить” является наиважнейшим элементом на странице и должны быть найдена без труда. К сожалению, по умолчанию кнопка “оплатить заказ” имеет вид стандартной кнопки и не отличается от остальных. Обязательно стилизуйте эту кнопку и добавьте вокруг нее свободного пространства.

Пример оформления кнопки (Панель управления - Дизайн - Управление дизайном (шаблоны) - Таблица стилей CSS интернет магазина):

#order-submit input[type="submit"] {
 display: inline-block;
 margin-bottom: 0;
 font-weight: normal;
 text-align: center;
 white-space: nowrap;
 vertical-align: middle;
 cursor: pointer;
 background-image: none;
 border: 1px solid #daa520;
 -webkit-user-select: none;
 -moz-user-select: none;
 -ms-user-select: none;
 -o-user-select: none;
 user-select: none;
 padding: 10px 16px;
 font-size: 18px;
 line-height: 1.33;
 border-radius: 6px;
}

Здесь применен стиль большой кнопки из Bootstrap. Не забудьте заменить его на свой.

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

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

Это достигается за счет переменной $ORDER_FIELDS$. Иногда есть смысл кастомизировать список полей, тогда это выглядит подобным образом:

<?if $ORDER_FIELD_1$?> 
 $ORDER_FNAME_1$: 
 <div class="order-field">
 <strong>
 <?if $ORDER_FIELD_EDIT_1$?>
 $ORDER_FIELD_EDIT_1$
 <?else?> 
 $ORDER_FIELD_1$
 <?endif?>
 </strong>
 </div>
<?endif?>
 <?if $ORDER_FIELD_2$?> 
 $ORDER_FNAME_2$: 
 <div class="order-field">
 <strong>
 <?if $ORDER_FIELD_EDIT_2$?>
 $ORDER_FIELD_EDIT_2$
 <?else?> 
 $ORDER_FIELD_2$
 <?endif?>
 </strong>
 </div>
<?endif?>
...

Так вы можете в зависимости от способа оплаты или доставки показывать те или иные поля. Это актуально, когда пользователь выбирает "Самовывоз" и ему не нужно показывать почтовый адрес.