Достаточно часто приходится работать с компонентом Joomshopping — скрипт интернет-магазина для cms Joomla.
Забавно, что в функционале последней версии скрипта (v. 4.18.3 на момент написания материала) «по умолчанию» нет:Кнопки плюс и минус возле поля количества товара в Карточке товара и в Корзине.
Странно, но факт.
Есть плагины и скрипты, платные и не очень, для реализации этой «примочки». Но мы не ищем легких путей и пропишем кнопки непосредственно в код шаблонов магазина Joomshopping. Меньше проблем и конфликтов, меньше лишнего кода.
Кнопки «плюс/минус» нужны в двух шаблонах: Карточка товара, Корзина. Они могут находиться по факту:
1/ в шаблоне компонента: мой_сайт.ru/components/com_jshopping/templates/default/
2/ или в шаблоне сайта: мой_сайт.ru/templates/мой_шаблон/components/html/com_jshopping/
Если у вас шаблоны интернет-магазина «работают» по первому варианту, то сразу рекомендуем продублировать их по варианту 2, чтобы шаблоны не были исправлены при обновлении скрипта JoomShopping.
Для этого создаем папку com_jshopping по указанному выше адресу и копируем в нее все шаблоны Магазина. Получится примерно такая иерархия:
На скриншоте — вид на иерархию из Total Commander.
Начнем правки с карточки товара. Для этого находим и открываем файл product_default.php
по адресу:
мой_сайт.ru/templates/мой_шаблон/components/html/com_jshopping/product/product_default.php
Для «вскрытия» файлов *.php используем текстовой редактор типа Notepad++ (или версия «для чайников» — Блокнот Windows. Я лично использую — EditPlus).
Ищем строку с кодом:
В дефолтной версии скрипта это строка 314.
Заменяем строку на:
<span class="quantity-text"><input type="text" value="1" class="inputbox" onkeyup="reloadPrices();" id="quantity" name="quantity"></span>
<span onclick="var qty_el = document.getElementById('quantity'); var qty = qty_el.value; if( !isNaN( qty )) qty_el.value++;return false;" class="quantity-plus">+</span>
Верстка шаблона Торговой карточки товара может быть разной, конечно. На работоспособность кода это не повлияет. Ему все равно, в дивах или табах работать.
Правим стили css, на свой вкус и надобности. Меня устроил следующий вариант исполнения, без пафоса:
Можно посмотреть на сайт заказчика Пекарня «Шольбери», «пощелкать».
Аналогично правим шаблон Корзины. Для этого находим и открываем файл cart.php
по адресу:
мой_сайт.ru/templates/мой_шаблон/components/html/com_jshopping/cart/cart.php
Ищем фрагмент кода:
<?php }?>
<?php print $prod['_qty_unit']; ?>
В дефолтной версии скрипта это строка 121. Если шаблон правился (например, установка сайта была произведена через КвикСтарт), то код может выглядеть несколько иначе. Ориентируйтесь «по месту», принцип правки сохранится.
Заменяем указанный выше фрагмент кода на следующий:
<input class="text" type ="text" name ="quantity[<?php print $key_id ?>]" id="quantity[<?php print $key_id ?>]" value = "<?php print $prod['quantity'] ?>" />
<input class="plus" type="button" value="−" onclick="var qty_el = document.getElementById('quantity[<?php print $key_id ?>]'); var qty = qty_el.value; if( !isNaN( qty ) && qty > 0 ) qty_el.value--;return false;" />
<?php print $prod['_qty_unit'];?>
Правим стили css. Без излишних усилий получился следующий вариант исполнения:
Возможно, позже шаблон еще будет «рихтоваться», хотя смысла особого в правке нет, вид вменяемый. Оформить можно как угодно, по собственному вкусу и потребностям сайта. Главное — работает функционал: кнопки кликаются, сумма пересчитывается.
Для комментирования материалов регистрация на сайте не нужна. Правила публикации: наличие здравого смысла. Спам удаляется, спамерам: бан по ip навсегда. Email комментаторов не публикуется.