• Joomla
• VirtueMart
• php

Сопутствующие товары — это товары, которые чаще всего покупают с основным товаром (например, различные аксессуары), либо просто похожие товары из той же категории.

Добавление сопутствующих товаров

Для добавления похожих товаров в virtuemart 3 нужно зайти во вкладку Настраиваемые поля и начать вводить название нужного товара в поле Поиск сопутствующих товаров.

 

Если вы установили или обновили virtuemart до версии 3, то в Virtuemart > Товары > Настраиваемые поля уже должно быть создано новое настраиваемое поле Сопутствующие товары.

Если данного поля нет, то его можно создать. Основные настройки приведены на скриншоте.

В полях Заголовок, Описание, Всплывающая подсказка указаны языковые переменные. Вместо них можно просто указать свой текст.

 

Изменение шаблона вывода сопутствующих товаров

По умолчанию показывается только список ссылок на похожие товары.

Для показа цены и изображения изменяем настройки настраиваемого поля Сопутствующие товары.

Так же здесь можно задать размер миниатюр изображений товара и показ краткого описания.

За вывод похожих товаров в карточке товара отвечает код, находящийся в файле \components\com_virtuemart\views\productdetails\tmpl\default.php.

echo shopFunctionsF::renderVmSubLayout('customfields',array('product'=>$this->product,'position'=>'related_products','class'=> 'product-related-products','customTitle' => true ));

Сам шаблон похожих товаров находится по адресу \components\com_virtuemart\sublayouts\related.php. В той же папке находятся и другие части кода, которые зачаcтую повторяются на разных страницах магазина. Это облегчает редактирование шаблона магазина в целом.

Для сохранения изменений шаблона похожих товаров после обновления virtuemart создадим папку  \templates\имя_шаблона\html\com_virtuemart\sublayouts и скопируем туда файл related.php.

Для улучшения внешнего вида немного изменим шаблон вывода. В файле \templates\имя_шаблон\html\com_virtuemart\sublayouts\related.php заменим

 

echo JHtml::link (JRoute::_ ('index.php?option=com_virtuemart&view=productdetails&virtuemart_product_id=' . $related->virtuemart_product_id . '&virtuemart_category_id=' . $related->virtuemart_category_id), $thumb   . $related->product_name, array('title' => $related->product_name,'target'=>'_blank'));

на

echo '<div class="related-product-image">' . JHtml::link (JRoute::_ ('index.php?option=com_virtuemart&view=productdetails&virtuemart_product_id=' . $related->virtuemart_product_id . '&virtuemart_category_id=' . $related->virtuemart_category_id), $thumb, array('title' => $related->product_name,'target'=>'_blank')) . '</div>';
echo JHtml::link (JRoute::_ ('index.php?option=com_virtuemart&view=productdetails&virtuemart_product_id=' . $related->virtuemart_product_id . '&virtuemart_category_id=' . $related->virtuemart_category_id),$related->product_name, array('title' => $related->product_name,'target'=>'_blank'));

Добавим немного стилей в файл стилей шаблона.

/*
Related Products
*/
 
.product-field-type-R {
    width: 25%;
    float: left;
    text-align: center;
    margin-bottom: 10px;
}
.product-field-type-R img {
    max-width: 90%;
    max-height: 100%;
    height: auto;
    padding: 10px 0;
    display: block;
    margin: 0 auto
}
.related-product-image {
    height: 200px;
    display: table;
    width: 100%;
}
.related-product-image a {
    height: 200px;
    display: table-cell;
    vertical-align: middle;
    text-align: center;
}

После этого похожие товары будут выглядеть примерно так.

Для вывода не только окончательной цены, но и цены без скидки после строки

 

echo $currency->createPriceDiv ('salesPrice', 'COM_VIRTUEMART_PRODUCT_SALESPRICE', $related->prices);

Добавим

 

if (round($related->prices['basePriceWithTax'],$currency->_priceConfig['salesPrice'][1]) != $related->prices['salesPrice']) {
    echo '<span class="price-crossed" >' . $currency->createPriceDiv ('basePriceWithTax', 'COM_VIRTUEMART_PRODUCT_BASEPRICE_WITHTAX', $related->prices) . "</span>";
}