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


Наличие товара "Под заказ" и кнопка "Заказать"


  • Авторизуйтесь для ответа в теме
В этой теме нет ответов

#1 Никита Панин

Никита Панин

    Пользователь

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

Отправлено 01 Февраль 2021 - 16:46

Реализуем наличие товара "Под заказ" и отображение кнопки "Заказать", при остатке товара 999.

Для этого перейдём в раздел Сайт --> Редактор шаблонов --> в шаблоне "Товар" найдём (ctrl + f) :

<div class="available-true" {% IF GOODS_MOD_REST_VALUE=0 %}style="display:none;"{% ENDIF %}>Наличие товара: <span><font color="#03b335">В наличии</font></span></div>

и заменим на :
<div class="available-true" {% IF GOODS_MOD_REST_VALUE=0 || GOODS_MOD_REST_VALUE=999 %}style="display:none;"{% ENDIF %}>Наличие товара: <span><font color="#03b335">В наличии</font></span></div>
<div class="available-true-zakaz" {% IF GOODS_MOD_REST_VALUE !=999 %}style="display:none;"{% ENDIF %}>Наличие товара: <span><font color="#03b335">Под заказ</font></span></div>

тем самым мы добавляем новую строку "Под заказ" и добавляем условие для строки "В наличии", если остаток товара 999 , то скрываем "В наличии".

далее найдём :
<!-- Добавление товара в Корзину -->
<div class="add-to-box f-fix {% IF SETTINGS_GOODS_DONT_PUT_TO_CART_MORE_THAN_AVAILABLE %}add-to-form{% ENDIF %}" {% IF GOODS_MOD_REST_VALUE=0 %}style="display:none;"{% ENDIF %}>

и заменим на :
<a href="#show-callback" class="zakaz button" {% IF GOODS_MOD_REST_VALUE != 999 %}style="display:none;"{% ENDIF %} title="Cделать заказ">Заказать</a>
<!-- Добавление товара в Корзину -->
<div class="add-to-box f-fix {% IF SETTINGS_GOODS_DONT_PUT_TO_CART_MORE_THAN_AVAILABLE %}add-to-form{% ENDIF %}" {% IF GOODS_MOD_REST_VALUE=0 || GOODS_MOD_REST_VALUE=999 %}style="display:none;"{% ENDIF %}>

тем самым мы добавляем кнопку "Заказать" и добавляем условие для кнопки "Купить", если остаток товара 999 , то скрываем кнопку "Купить".

далее в конец данного шаблона "Товар" добавим :
<script>
$(function() {
$(".zakaz").fancybox();
})
</script>
<div id="show-callback" style="display:none;">
<form method="post" action="{CALLBACK_URL}" class="callbackForm2" enctype="multipart/form-data">
<input type="hidden" name="hash" value="{HASH}" />
<input type="hidden" name="form[Название товара]" value="{GOODS_NAME}" />
<input class="callbackredirect" type="hidden" name="return_to" value="{CALLBACK_URL}"/>
<!-- Набор полей которые не видит пользователь, но видят боты. Когда они их заполняют мы точно знаем, что их прислал нам бот и мы не сохраняем подобный отзыв о товаре, а боту отправившему отзыв сообщаем, что отзыв добавлен успешно, но будет отображён здесь после прохождения модерации -->
{ANTISPAM_CODE}
{% IF FORM_NOTICE %}<div class="{% IF FORM_NOTICE_IS_GOOD %}success{% ELSE %}warning{% ENDIF %}">{FORM_NOTICE}</div>{% ENDIF %}
<input id="callback_person1" class="inputText callback_person1 required" type="text" name="form[{ANTISPAM_FORM_FIELD_NAME_CALLBACK_PERSON}]" value="{FORM_CALLBACK_PERSON}" placeholder="Представьтесь, пожалуйста" maxlength="50" title="Представьтесь, пожалуйста" autocomplete="off" />
<input id="callback_phone1" class="inputText callback_phone1 required" type="text" name="form[{ANTISPAM_FORM_FIELD_NAME_CALLBACK_PHONE}]" value="{FORM_CALLBACK_PHONE}" placeholder="Введите номер телефона" maxlength="50" title="Введите номер телефона" autocomplete="off" />
<div class="pp">Нажимая на кнопку отправить, Вы соглашаетесь с <a href="#">правилами обработки данных</a></div>
{% IFNOT FORM_SEND_OK %}<button type="submit" title="Отправить" class="button">Отправить</button>{% ENDIF %}
</form>
</div>

тем самым мы добавляем форму, открывающаяся при нажатии на кнопку "Заказать" и вешаем скрипт на данную кнопку.

далее перейдём в файл main.js и найдём :
// Есть ли товар есть в наличии
if(modificationRestValue>0) {
goodsAvailableTrue.show();
goodsAvailableFalse.hide();
// Если товара нет в наличии

и заменим на :
// Есть ли товар есть в наличии
if(modificationRestValue>0) {
// Если остаток товара 999
if (modificationRestValue==999) {
// Скрываем кнопку купить
$(".product-view .add-to-box.f-fix.add-to-form").hide();
// Показываем строку "Наличие: под заказ" и кнопку "Заказать"
$(".available-true-zakaz, a.zakaz.button").show();
// Скрываем строку "Наличие: в наличии"
goodsAvailableTrue.hide();
// Если остаток товара не равен 999
} else {
// Показываем кнопку купить
$(".product-view .add-to-box.f-fix.add-to-form").show();
// Скрываем строку "Наличие: под заказ" и кнопку "Заказать"
$(".available-true-zakaz, a.zakaz.button").hide();
//Показываем строку "Наличие: в наличии"
goodsAvailableTrue.show();
}
goodsAvailableFalse.hide();
// Если товара нет в наличии

тем самым при выборе модификации в карточке товара, будет отображаться нужное "Наличие товара" с соответствующей кнопкой.

далее перейдём в файл main.css и добавим (в самый конец) :
a.zakaz.button {background: #09afe7;font-size: 16px;}

тем самым корректируем внешний вид нашей кнопки "Заказать".




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

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