Вывести картинку связанного элемента в каталоге битрикс- заметка на сайте camouf.ru

Просмотров: 18514 | Комментариев: 28

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

Создание свойства в инфоблоке каталог

Начнем с создания свойства "привязка к элементам в виде списка". Для этого идем в настройки нужного инфоблока и заполняем как на нижеприведенной картинке: Название свойства- "Рекомендуемые товары", тип-"Привязка к элементам в виде списка", ставим чекбоксы- "Акт." и "Множ.", и Тип "ATT_SVYAZKA". Сортировку можно оставить по умолчанию 500, в моем примере нужно было чтобы свойство было в самом низу редактора элемента

создание своиства инфоблока битрикс

Далее идем в настройки этого свойства и указываем тип и инфоблок элементы которого будут доступны для связывания. В моем случае нужно было привязывать элементы того же самого инфоблока.

настроика своиства инфоблока битрикс

Настройка компонента

Идем в публичную часть сайта, в раздел где выведен компонент каталога, проходим в его настроки (например двойным кликом в режиме правки) прокручиваем колесико до секции "Настройки детального просмотра" и в списке доступных свойств выбираем наше свежесозданное "ATT_SVYAZKA" и сохраняемся.

настроика компонента битрикс

Выводим свойство в шаблоне компонента

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

<?foreach($arResult["DISPLAY_PROPERTIES"] as $pid=>$arProperty):?>
<? if($pid =="ATT_SVYZKA"): ?>
<?if(is_array($arProperty["DISPLAY_VALUE"])):?>
<?
$st = 2;
echo '<table cellspacing=5 cellpadding=2 border=0>';
for ($i = 0; $i < ceil(count($arProperty["VALUE"])/$st); $i++) {
echo '<tr>';
for ($j = 0; $j < $st; $j++) {
if (isset($arProperty["VALUE"][(($i*$st)+$j)])) {
$ar_res = CCatalogProduct::GetByIDEx($arProperty["VALUE"][(($i*$st)+$j)]);
echo '<td align=center><p>'.$arProperty["DISPLAY_VALUE"][(($i*$st)+$j)].'</p><br />'; //название
$picture = CFile::ShowImage($ar_res['PREVIEW_PICTURE'], 200, 200, "border=0", "", true); //картинка
echo $picture;
echo '</td>';
} else {
echo '<td> </td>';
}
}
echo '</tr>';
}
echo '</table>';
?>
<?endif?>
<?endif?>
<?endforeach?>

В общем то все готово осталось привязать элементы к конкретному товару и посмотреть как это сработало.

Привязываем товары к....товару

Идем в редактирование любого товара нашего инфоблока. Находим свойство "Рекомендуемые товары" и в выпадающих списках, где отобразятся все доступные для связывания товары, выбираем пару тройку товаров:

настроика компонента битрикс

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

интернет магазин на битрикс

Вывести название, цену и картинку связанного элемента в каталоге

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

<?foreach($arResult["DISPLAY_PROPERTIES"] as $pid=>$arProperty):?>
<?if($pid =="VAZE"):?>
<?
$st = 2;
for ($i = 0; $i < ceil(count($arProperty["VALUE"])/$st); $i++)
for ($j = 0; $j < $st; $j++)
{
if (isset($arProperty["VALUE"][(($i*$st)+$j)]))
{
$ar_res = CCatalogProduct::GetByIDEx($arProperty["VALUE"][(($i*$st)+$j)]);
$picture = CFile::ShowImage($ar_res['PREVIEW_PICTURE'], 200, 200, "border=0", "", true);

$tID = $ar_res["ID"];//ID инфоблока со связанными товарами
$intIBlockID = 13;
$mxResult = CCatalogSKU::GetInfoByProductIBlock(
$intIBlockID
);
if (is_array($mxResult))
{
$rsOffers = CIBlockElement::GetList(array("PRICE"=>"ASC"),array('IBLOCK_ID' => $mxResult['IBLOCK_ID'], 'PROPERTY_'.$mxResult['SKU_PROPERTY_ID'] => $tID));
while ($arOffer = $rsOffers->GetNext())
{
$ar_price = GetCatalogProductPrice($arOffer["ID"], 1); //Цена торгового предложения
}
}
echo '<li>';
echo '<a href="'.$ar_res["DETAIL_PAGE_URL"].'">'; //Ссылка на товар
echo '<h5>'.$ar_res["NAME"].'</h5>'; //Название товара
echo $picture; //Картинка товара
echo "<p>от ".$ar_price["PRICE"]." руб. </p>" ; //Цена
break;
echo '</a>';
echo '</li>';
}
}
?>
<?endif?>
<?endforeach?>

Видео к данной записке

Так как в комментариях многие жалуются, что способ не работает в новых редакциях битрикс, записал видео по реализации. Битрикс версии 16.0.2

Видео варится

Предыдущая запись Следующая запись

Уважаемый читатель! В связи с участившимся спамом в комментариях, возможность писать доступна только для зарегистрированных пользователей Быстрая регистрация или вход через социальную сеть:

Константин 13.11.2013
После вставки кода на детальной стр все проподает возможно какието несовместимасти с кодом на моей стр=(

Михаил Базаров 13.11.2013

Цитата
Константин пишет: После вставки кода на детальной стр все проподает возможно какието несовместимасти с кодом на моей стр=(

Попробуйте поиграться с размещением этого кода. Быть может где-то нарушаете условия самого компонента.

Гость сайта 16.11.2013

Цитата
Константин пишет: После вставки кода на детальной стр все проподает возможно какието несовместимасти с кодом на моей стр=(

Спасибо Все нормально работает!

Гость сайта 16.11.2013

Цитата
Константин пишет: После вставки кода на детальной стр все проподает возможно какието несовместимасти с кодом на моей стр=(

<?endforeach?> Добавьте в конце !

Михаил Базаров 17.11.2013

Цитата

Гость сайта пишет:

Цитата
Константин пишет: После вставки кода на детальной стр все проподает возможно какието несовместимасти с кодом на моей стр=(

<?endforeach?> Добавьте в конце !

Да, точно не хватает. Спасибо за наблюдение, поправил в тексте. Видимо спешил когда писал

Гость сайта 17.11.2013

Цитата

Михаил Базаров пишет:

Цитата

Гость сайта пишет:

Цитата
Константин пишет: После вставки кода на детальной стр все проподает возможно какието несовместимасти с кодом на моей стр=(

<?endforeach?> Добавьте в конце !

Да, точно не хватает. Спасибо за наблюдение, поправил в тексте. Видимо спешил когда писал

Цитата

Михаил Базаров пишет:

Цитата

Гость сайта пишет:

Цитата
Константин пишет: После вставки кода на детальной стр все проподает возможно какието несовместимасти с кодом на моей стр=(

<?endforeach?> Добавьте в конце !

Да, точно не хватает. Спасибо за наблюдение, поправил в тексте. Видимо спешил когда писал

И еще кое что замените вот <? if($pid == ’ATT_SVYZKA’): ?> на <? if($pid == "ATT_SVYZKA " ): ?> То-есть кавычки не ' a "

Денис 17.11.2013
А как картинке присвоить url

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

Михаил Базаров 20.11.2013

Цитата
Гость сайта пишет: А если не в детальном просмотре, а в списке товаров выводить миниатюрой? Для ювелирного сайта было бы удобнее сразу в списке товаров видеть, что например у кольца есть комплект из серег.

Недавно презентовали версию Битрикс 14- рассказывали как раз о таких комплектах. Вроде бы как без особых лишних телодвижений можно реализовать такой вот функционал. Правда, пока не смотрел что это за зверь. Чуть позже если подвернется подобное реализовывать- напишу записку.

Дмитрий 23.11.2013
Два дня мучаюсь, выводит ошибку: Fatal error: Class 'CCatalogProduct' not found in

Михаил Базаров 05.12.2013

Цитата
Дмитрий пишет: Два дня мучаюсь, выводит ошибку: Fatal error: Class 'CCatalogProduct' not found in

Нужно понимать вашу задачу и что делается для ее реализации. Так тяжело подсказать

гость 11.12.2013
Здравствуйте, Михаил! Почему когда привязываю товар он виден из товаров к которому привязал, а из самого элемента не виден? Так реализовано, или можно переключить? Спасибо

Михаил Базаров 12.12.2013

Цитата
гость пишет: Здравствуйте, Михаил! Почему когда привязываю товар он виден из товаров к которому привязал, а из самого элемента не виден? Так реализовано, или можно переключить? Спасибо

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

Виктория 05.05.2014
Добрый вечер, а можно ли вывести сопутствующие товары из разных инфоблоков? ТП битрикс на вопрос ответит не может, по стандартной схеме - не выводится.

Михаил Базаров 06.05.2014

Цитата
Виктория пишет: Добрый вечер, а можно ли вывести сопутствующие товары из разных инфоблоков? ТП битрикс на вопрос ответит не может, по стандартной схеме - не выводится.

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

Гость сайта 27.05.2014
у меня почему то ничего не выводит((( без картинок (то, что в стандартном компоненте) работает. а этот не работает. совсем. компонент его как буд-то бы не видит

Гость сайта 24.07.2014
А если связанных товаров 90 штук по каждому элементу? Как быть?

Михаил Базаров 24.07.2014

Цитата
Гость сайта пишет: А если связанных товаров 90 штук по каждому элементу? Как быть?

Зачем так много? То есть я даже не могу представить магазин у которого такой бардак в карточке- зачем он нужен?

Руслан 25.07.2014
Сделал все по инструкции. Товары не выводятся. Не работает... В чем может быть причина? 1С-Битрикс: Управление сайтом 14.0.10.

Виктор 28.08.2014

Здравствуйте, Михаил! Прогнал свой массив через var_dump

Код
<? var_dump($arResult["DISPLAY_PROPERTIES"]["ATT_SVYAZKA"]); ?>

Получил. Вопрос как вывести: картинки, купить? В файле result_modifier.php посмотрел, всё хорошо.

Код

array(37) {
  ["ID"]=>
  string(2) "55"
  ["TIMESTAMP_X"]=>
  string(19) "2014-08-28 15:21:34"
  ["IBLOCK_ID"]=>
  string(1) "2"
  ["NAME"]=>
  string(55) "Так же с этим товаром покупают"
  ["ACTIVE"]=>
  string(1) "Y"
  ["SORT"]=>
  string(3) "500"
  ["CODE"]=>
  string(11) "ATT_SVYAZKA"
  ["DEFAULT_VALUE"]=>
  string(0) ""
  ["PROPERTY_TYPE"]=>
  string(1) "E"
  ["ROW_COUNT"]=>
  string(1) "1"
  ["COL_COUNT"]=>
  string(2) "30"
  ["LIST_TYPE"]=>
  string(1) "L"
  ["MULTIPLE"]=>
  string(1) "Y"
  ["XML_ID"]=>
  NULL
  ["FILE_TYPE"]=>
  string(0) ""
  ["MULTIPLE_CNT"]=>
  string(1) "5"
  ["TMP_ID"]=>
  NULL
  ["LINK_IBLOCK_ID"]=>
  string(1) "2"
  ["WITH_DESCRIPTION"]=>
  string(1) "N"
  ["SEARCHABLE"]=>
  string(1) "N"
  ["FILTRABLE"]=>
  string(1) "N"
  ["IS_REQUIRED"]=>
  string(1) "N"
  ["VERSION"]=>
  string(1) "1"
  ["USER_TYPE"]=>
  string(5) "EList"
  ["USER_TYPE_SETTINGS"]=>
  array(4) {
    ["size"]=>
    int(1)
    ["width"]=>
    int(0)
    ["group"]=>
    string(1) "N"
    ["multiple"]=>
    string(1) "N"
  }
  ["HINT"]=>
  string(0) ""
  ["PROPERTY_VALUE_ID"]=>
  array(3) {
    [0]=>
    string(4) "3476"
    [1]=>
    string(4) "3477"
    [2]=>
    string(4) "3479"
  }
  ["VALUE"]=>
  array(3) {
    [0]=>
    string(3) "428"
    [1]=>
    string(3) "403"
    [2]=>
    string(3) "400"
  }
  ["DESCRIPTION"]=>
  array(3) {
    [0]=>
    string(0) ""
    [1]=>
    string(0) ""
    [2]=>
    string(0) ""
  }
  ["VALUE_ENUM"]=>
  NULL
  ["VALUE_XML_ID"]=>
  NULL
  ["VALUE_SORT"]=>
  NULL
  ["~VALUE"]=>
  array(3) {
    [0]=>
    string(3) "428"
    [1]=>
    string(3) "403"
    [2]=>
    string(3) "400"
  }
  ["~DESCRIPTION"]=>
  array(3) {
    [0]=>
    string(0) ""
    [1]=>
    string(0) ""
    [2]=>
    string(0) ""
  }
  ["~NAME"]=>
  string(55) "Так же с этим товаром покупают"
  ["~DEFAULT_VALUE"]=>
  string(0) ""
  ["DISPLAY_VALUE"]=>
  array(3) {
    [0]=>
    string(128) "Аккумуляторная дрель-шуруповерт Hitachi DS 14 DFL"
    [1]=>
    string(88) "Аккумуляторная дрель Makita DF330DWE"
    [2]=>
    string(111) "Аккумуляторная дрель-шуруповерт Makita 6271DWAE"
  }
}

Вывести картинку связанного элемента в каталоге битрикс

Создание свойства в инфоблоке каталог

Настройка компонента

Выводим свойство в шаблоне компонента

Привязываем товары к....товару

Вывести название, цену и картинку связанного элемента в каталоге

Видео к данной записке

Записная книжка: