Добавление кнопок следующий и предыдущий товар на странице продукта PrestaShop
Всем доброго времени суток. Сегодня у нас очень интересный и в тоже время простой урок. Сегодня мы научимся добавлять кнопки на страницу товара Вашего интернет магазина, которые позволять переходить на предыдущий или следующий товар прямо на странице.
Давайте приступим. Добавим удобные кнопки навигации по категориям, на каждой странице товара.
Чтобы упростить навигацию по категориям, давайте с помощью Prestashop добавим на каждую страницу товара кнопки перехода к страницам предыдущего и следующего товара.
Версия Prestashop: 1.5, 1.6.
Скачать файлы проекта
Обратите внимание: файлы проекта созданы в версии 1.6.0.9.
Хотя я проверял данный код только в версии 1.6, он должен работать и в версии 1.5, поскольку структура базы данных не изменилась. Тем не менее, необходимо либо отредактировать, либо дополнить следующие файлы:
classes/Product.php (для сбора информации о предыдущем и следующем товарах);
controllers/front/ProductController.php (для назначения связей с шаблоном);
themes/default-bootstrap/product.tpl (для добавления кнопок).
Как всегда, я рекомендую при любой возможности использовать оверрайды; таким образом, мы дополним первые 2 файла и отредактируем шаблон.
Кром того, предположим, что товар может находиться в нескольких разных категориях; поэтому для удобства мы будем осуществлять навигацию только в пределах одной категории, определённой по умолчанию.
Во-первых, нам нужна какая-то информация, чтобы с ней работать. Ни предыдущий, ни следующий товар не назначены для конкретной страницы товара, поэтому сначала мы это сделаем. Как было сказано выше, для простоты мы возьмём только товары, входящие в категорию, определённую по умолчанию. Действительно, можно использовать в качестве таковой ранее просмотренную категорию, но это может привести к путанице и значительным сложностям (хотя это хорошая тема для одного из уроков!)
Создайте новый файл в override/classes с именем Product.php, а затем вставьте следующее между тегами php:
В таком случае давайте создадим метод, благодаря которому мы можем начать «захват» позиций в категории:
Теперь мы можем получить информацию о предыдущем и следующем товарах:
Разъяснение: по сути дела, мы используем один и тот же запрос как для предыдущего, так и для следующего товара. Предыдущим будет являться самый первый товар, имеющий позицию ниже текущей, попадающий под заданные условия. Следующий же товар будет иметь позицию выше текущей. Заметьте, что мы берём товары только из одной категории, определённой по умолчанию, вот почему нельзя просто использовать две смежные позиции (т.е. плюс одну и минус одну позицию) в одном запросе (появился бы промежуток).
Настало время назначить полученные нами переменные странице конкретного товара. Создайте новый override, на этот раз внутри override/controllers/front и назовите его ProductController.php. Далее, как всегда, инициализируйте override класса:
Как вы видите, мы собираемся дополнить метод initContent(). Итак, внутрь него, а также перед вызовом родительского экземпляра initContent() вставьте следующий код:
Разъяснение: здесь ничего особенного, мы просто воспользовались ранее созданным методом, а затем назначили предыдущий и следующий товары.
Окончательный вариант override должен выглядеть примерно так:
Пришло время добавлять кнопки! Однако перед этим откройте папку cache/ и удалите оттуда файл class_index.php, чтобы наши overrides начали действовать!
На этом, заключительном шаге я воспользуюсь шаблоном по умолчанию (как всегда), так что ваш код может отличаться от моего, особенно если вы пользуетесь Prestashop 1.5, поскольку я использую версию 1.6.
Для начала необходимо решить, где наши две кнопки будут располагаться. Как идеальный вариант, я рекомендую разместить их на самом верху страницы товара, так как там они легкодоступны. Но, конечно же, отлично подойдёт и любое другое место. Как только вы определились с расположением, откройте файл product.tpl, находящийся в папке с вашей темой оформления.
Что касается моего расположения, то кнопки необходимо вставить в файл непосредственно перед данным кодом, в самое начало:
Вставить следующее:
Готово.
Давайте приступим. Добавим удобные кнопки навигации по категориям, на каждой странице товара.
Чтобы упростить навигацию по категориям, давайте с помощью Prestashop добавим на каждую страницу товара кнопки перехода к страницам предыдущего и следующего товара.
Версия Prestashop: 1.5, 1.6.
Скачать файлы проекта
Обратите внимание: файлы проекта созданы в версии 1.6.0.9.
Введение.
Хотя я проверял данный код только в версии 1.6, он должен работать и в версии 1.5, поскольку структура базы данных не изменилась. Тем не менее, необходимо либо отредактировать, либо дополнить следующие файлы:
classes/Product.php (для сбора информации о предыдущем и следующем товарах);
controllers/front/ProductController.php (для назначения связей с шаблоном);
themes/default-bootstrap/product.tpl (для добавления кнопок).
Как всегда, я рекомендую при любой возможности использовать оверрайды; таким образом, мы дополним первые 2 файла и отредактируем шаблон.
Кром того, предположим, что товар может находиться в нескольких разных категориях; поэтому для удобства мы будем осуществлять навигацию только в пределах одной категории, определённой по умолчанию.
Шаг 1 — Получение информации о предыдущем и следующем товарах.
Во-первых, нам нужна какая-то информация, чтобы с ней работать. Ни предыдущий, ни следующий товар не назначены для конкретной страницы товара, поэтому сначала мы это сделаем. Как было сказано выше, для простоты мы возьмём только товары, входящие в категорию, определённую по умолчанию. Действительно, можно использовать в качестве таковой ранее просмотренную категорию, но это может привести к путанице и значительным сложностям (хотя это хорошая тема для одного из уроков!)
Создайте новый файл в override/classes с именем Product.php, а затем вставьте следующее между тегами php:
class Product extends ProductCore
{
}
В таком случае давайте создадим метод, благодаря которому мы можем начать «захват» позиций в категории:
public function getAdjacentProducts()
{
$position = Db::getInstance()->getValue('SELECT position FROM '._DB_PREFIX_.'category_product WHERE id_product = ' . (int)$this->id . ' AND id_category = ' . (int)$this->id_category_default);
}
Теперь мы можем получить информацию о предыдущем и следующем товарах:
public function getAdjacentProducts()
{
$position = Db::getInstance()->getValue('SELECT position FROM '._DB_PREFIX_.'category_product WHERE id_product = ' . (int)$this->id . ' AND id_category = ' . (int)$this->id_category_default);
// get products that are before and after
$previous = Db::getInstance(_PS_USE_SQL_SLAVE_)->getRow('
SELECT cp.id_product, pl.link_rewrite, cp.position, pl.name
FROM '._DB_PREFIX_.'category_product cp
LEFT JOIN '._DB_PREFIX_.'product_lang pl ON (cp.id_product = pl.id_product)
LEFT JOIN '._DB_PREFIX_.'product p ON (cp.id_product = p.id_product)
WHERE p.id_category_default = '.(int)$this->id_category_default.' AND (cp.position < '. (int)($position ) .' ) AND cp.id_category = ' . (int)$this->id_category_default .' AND pl.id_lang = '.(Context::getContext()->language->id).'
ORDER BY cp.position DESC');
$next = Db::getInstance(_PS_USE_SQL_SLAVE_)->getRow('
SELECT cp.id_product, pl.link_rewrite, cp.position, pl.name
FROM '._DB_PREFIX_.'category_product cp
LEFT JOIN '._DB_PREFIX_.'product_lang pl ON (cp.id_product = pl.id_product)
LEFT JOIN '._DB_PREFIX_.'product p ON (cp.id_product = p.id_product)
WHERE p.id_category_default = '.(int)$this->id_category_default.' AND (cp.position > '. (int)($position ) .' ) AND cp.id_category = ' . (int)$this->id_category_default .' AND pl.id_lang = '.(Context::getContext()->language->id).'
ORDER BY cp.position ASC');
return array('previous' => $previous, 'next' => $next);
}
Разъяснение: по сути дела, мы используем один и тот же запрос как для предыдущего, так и для следующего товара. Предыдущим будет являться самый первый товар, имеющий позицию ниже текущей, попадающий под заданные условия. Следующий же товар будет иметь позицию выше текущей. Заметьте, что мы берём товары только из одной категории, определённой по умолчанию, вот почему нельзя просто использовать две смежные позиции (т.е. плюс одну и минус одну позицию) в одном запросе (появился бы промежуток).
Шаг 2 — Назначение товаров для конкретной страницы товара.
Настало время назначить полученные нами переменные странице конкретного товара. Создайте новый override, на этот раз внутри override/controllers/front и назовите его ProductController.php. Далее, как всегда, инициализируйте override класса:
Class ProductController extends ProductControllerCore
{
public function initContent()
{
parent::initContent();
}
}
Как вы видите, мы собираемся дополнить метод initContent(). Итак, внутрь него, а также перед вызовом родительского экземпляра initContent() вставьте следующий код:
$adjacent_products = $this->product->getAdjacentProducts();
$this->context->smarty->assign(array(
'prev_product'=> $adjacent_products['previous'],
'next_product'=> $adjacent_products['next']
));
Разъяснение: здесь ничего особенного, мы просто воспользовались ранее созданным методом, а затем назначили предыдущий и следующий товары.
Окончательный вариант override должен выглядеть примерно так:
Class ProductController extends ProductControllerCore
{
public function initContent()
{
$adjacent_products = $this->product->getAdjacentProducts();
$this->context->smarty->assign(array(
'prev_product'=> $adjacent_products['previous'],
'next_product'=> $adjacent_products['next']
));
parent::initContent();
}
}
Пришло время добавлять кнопки! Однако перед этим откройте папку cache/ и удалите оттуда файл class_index.php, чтобы наши overrides начали действовать!
Шаг 3 — Добавление новых кнопок в product.tpl
На этом, заключительном шаге я воспользуюсь шаблоном по умолчанию (как всегда), так что ваш код может отличаться от моего, особенно если вы пользуетесь Prestashop 1.5, поскольку я использую версию 1.6.
Для начала необходимо решить, где наши две кнопки будут располагаться. Как идеальный вариант, я рекомендую разместить их на самом верху страницы товара, так как там они легкодоступны. Но, конечно же, отлично подойдёт и любое другое место. Как только вы определились с расположением, откройте файл product.tpl, находящийся в папке с вашей темой оформления.
Что касается моего расположения, то кнопки необходимо вставить в файл непосредственно перед данным кодом, в самое начало:
<div class="primary_block row">
Вставить следующее:
<!-- Navigation -->
<div class="product-navigation clearfix" style="margin-bottom:20px">
{if $prev_product}
<a title="{$prev_product.name}" class="btn btn-default" href="{$link->getProductLink($prev_product.id_product, $prev_product.link_rewrite)}">{l s='Previous Product'}</a>
{/if}
{if $next_product}
<a title="{$next_product.name}" class="btn btn-default" style="float:right"href="{$link->getProductLink($next_product.id_product, $next_product.link_rewrite)}">{l s='Next Product'}</a>
{/if}
</div>
Готово.
20 comments
А это переведённый урок или авторский?
Вопрос, как сделать фон у этих кнопок цветным, а то они, как мне кажется, слабо заметны на странице.