Вывести карточку товара битрикс

Урок 8. Создание детальной страницы товара в Битрикс

Детальная страница товара

В прошлом уроке мы доделали каталог и он стал выглядеть вполне прилично.

Теперь же нужно создать детальную страницу (карточку товара). Изобретать велосипед мы не будем и снова обратимся к заготовкам, которые мы взяли у CSS-фреймворка Foundation. Чтобы понять в чем суть обратитесь к одному из первых уроков из этого цикла. Напомню карточка товара в шаблоне выглядит так.

Чтобы не искать долго исходники шаблона их можно взять отсюда.

Ну а мы вспомним предыдущие уроки и по аналогии отредактируем шаблон детальной страницы bitrix:news.detail компонента Новости. Сам шаблон компонента у нас уже скопирован, поэтому достаточно открыть на редактирование файл.

Открыть шаблон на редактирование можно из публичной части, но я бы рекомендовал воспользоваться каким-либо редактором и открыть файл /www/ut11-bitrix.ru/local/templates/startshop/components/bitrix/news/catalog/bitrix/news.detail/.default/template.php . Путь я указываю относительно своего сайта, если у вас установлено веб-окружение Битрикс, как описано в Уроке 2. Установка Битрикс, то путь будет слегка другим, но по аналогии можно понять. Отталкивайтесь от папки шаблона /local/templates/startshop. Нам для работы нужен только файл template.php остальные файлы можно смело удалить. А в файле шаблона детальной страницы заменить код вывода контента следующим кодом.
Код:

Не знаю, как у вас, но у меня возникло 2 проблемы:

  1. По клику по картинке я не перешел на детальную страницу товара а получил сообщение, что страница не найдена.
  2. Не отображается картинка. (это после того, как решил первую проблему)

И чтобы урок у нас получился более полезным и интересным я разберу, как решать такие проблемы, и вы научитесь разбираться сами если что-то не работает.

Отладка в Битрикс и разбор проблем

Проблема первая
Если встать на карточку товара и посмотреть URL по которому нас переводит Битрикс, то можно увидеть, что путь совсем не тот, который мы ожидали увидеть.

Это проблема с ЧПУ. Если вы помните, то в инфобллоке было настроено ЧПУ следующим образом.

А по факту мы получаем совсем другую ссылку. Значит мы забыли настроить ЧПУ в параметрах компонента Новости. Исправим это. Главное правило тут одно:

ЧПУ в настройках инфоблока должно совпадать с настройками ЧПУ в компонентах Битрикс

  • Каталог ЧПУ — здесь указывается путь до папки в которой расположен компонент или путь относительно которого мы хотим строить ссылки.
  • Страница общего списка — это страница корня, у меня она совпадает с предыдущем параметром по этому оставлена пустой.
  • Страница раздела — задана в виде символьного кода раздела
  • Страница детального просмотра — задана составным полем символьный код раздела + символьный код элемента инфоблока.

Тут нужно быть внимательным с завершающими слешами, если они есть нужно не забывать их указывать и также следить, чтобы они не повторялись. Т.е. с путями ссылок нужно быть крайне внимательными.
После настройки ЧПУ детальная страница у нас стала замечательно открываться.

Проблема вторая
Не выводится изображение. Если вы помните, то все данные вывод в шаблоне хранятся в массиве arResult. А за вывод изображения товара у нас отвечает строка:
Код:

стоит его изучить, чтобы представлять какие данные в нем находятся и как их можно использовать в шаблонах. Нас интересует секция относящаяся к выводу изображения.

У меня сейчас эта секция уже есть, но изначально её не было. Информации о изображении не было в массиве arResult вобще. А где заполняется массив? Правильно в компоненте. Можно конечно идти в сам файл компонента bitrix:news.detail он находится в ядре /ut11-bitrix.ru/bitrix/components/bitrix/news.detail/component.php и там искать причину. Но я уже догадался, что просто в параметрах компонента Новости не включен вывод изображений.

И вот после включение вывода поля картинки для анонса в параметрах детальная страница товара выводится с изображением. Все проблемы решены.

И сразу, чтобы потом не возвращаться добавлю один важный штрих — выведу навигационную цепочку. Или хлебные крошки ещё её называют. Для вывода воспользуемся компонентом bitrix:breadcrumb, который нужно разместить в файле /startshop.ru/catalog/index.php . Можно просто скопировать приведенный ниже код, а можно вывести через визуальный редактор страницы. Никаких особенных настроек не требуется.

Или вставить этот код перед кодом вызова компонента bitrix:news.
Код:

И в итоге мы получим готовую карточку товара.

Шаблон этого урока можно скачать отсюда.
От автора:
Ну а на этом все. В следующем уроке мы сделаем слайдер. Ну а как без него это сейчас модно, хотя многие интернет магазины уже приходят к выводу, что слайдер занимает полезную площадь страницы выводя по сути не интересную покупателю информацию. Но мы сделаем слайдер наших лучших товаров, чтобы он наоборот привлек внимание. До скорых встреч!

Источник

Вывод карточки товара в другом инфоблоке помимо каталога

На сайте есть Каталог товаров.
Нужно сделать так, чтобы карточка товара выводилась не только в соответствующем разделе каталога, но и в разделе брендов без дублирования элемента.

например:
Каталог товаров -> Фасадные материалы -> Виниловый сайдинг -> Карточка товара XYZ
Наши бренды -> Бренд -> Виниловый сайдинг Бренда -> Карточка товара XYZ

Возможно ли это, если бренды — это другой информационный блок, не каталог товаров?

Цитата
Анастасия написал:
Возможно ли это, если бренды — это другой информационный блок, не каталог товаров?

Если Вы сделаете ЧПУ по прицнипу — каталог отдельно, карточки отдельно то не вижу проблем.
То есть:

/catalog/facadnie_materiali/vinilovi_saiding/ — раздела
/product/cartochka_tovara_xyz/ — карточка товара
/brands/brend/vinilovi_saiding_brenda/ — раздел бренда

Даже не нужно будет заморачиваться с каноническими ссылками

Цитата
Анастасия написал:
Возможно ли это, если бренды — это другой информационный блок, не каталог товаров?

Если Вы сделаете ЧПУ по прицнипу — каталог отдельно, карточки отдельно то не вижу проблем.
То есть:

/catalog/facadnie_materiali/vinilovi_saiding/ — раздела
/product/cartochka_tovara_xyz/ — карточка товара
/brands/brend/vinilovi_saiding_brenda/ — раздел бренда

Даже не нужно будет заморачиваться с каноническими ссылками

Для начала стоит усвоить одно: методика хранения информации не имеет ничего общего с методикой ее представления в публичной части.
Предположим есть у меня такой кейс: есть некоторая группа товаров, товар из которой может принадлежать одному из известных брендов. Чисто гипотетически, представьте что мы продаем садовые инструменты и наш каталог выглядит так:
— (раздел) Газонокосилки
— (элемент) Косилка 1 от компании A
— (элемент) Косилка 2 от компании A
— (элемент) Косилка 3 от компании B
— (раздел) Бензопилы
— (элемент) Бензопила 1 от компании B
— (элемент) Бензопила 2 от компании B
— (элемент) Бензопила Дружба

Вся эта структура уже есть в некоторой 1С и уже загружается в Битрикс. Все круто и все работает.
Но теперь мы хотим, чтобы у нас на сайте помимо простого каталога был список брендов (компаний) и их товаров. То есть, отдельная страница, где перечислены:
— (раздел) Компания А
— (раздел) Газонокосилки
— (элемент) Косилка 1 от компании A
— (элемент) Косилка 2 от компании A
— (раздел) Компания B
— (раздел) Газонокосилки
— (элемент) Косилка 3 от компании B
— (раздел) Бензопилы
— (элемент) Бензопила 1 от компании B
— (элемент) Бензопила 2 от компании B

Так как мы уже имеем инфоблок с товарами и разделами (см. первую иерархию), то я бы сделал так:
1) Создал отдельный инфоблок «Бренды» и заполнил его существующими брендами (те, что хочу показывать)
2) Каждый товар (в котором хочу указывать бренды) привязал к соответствующему бренду
3) Отвязал карточку товара от какого-либо раздела*
4) Разработал собственный компонент (или доработал существующий) показа товаров бренда

* — зачем я это сделал? Дело в том, что в случае если этого НЕ сделать, то придется поиметь кучу проблем с ЧПУ, каноническими ссылками, определением разделов и товаров. В общем полный мрак.

Источник

Как вывести в карточке товара разделы (категории) сопутствующих, рекомендованных товаров

Поставлена задача – вывести в карточке товара — разделы (категории) сопутствующих, рекомендованных товаров.

Именно разделы товаров – примерно как в catalog.section.list . Только в карточке товара каждого раздела – свои сопутствующие, каким-то образом привязанные разделы товаров.

Например для фотоаппаратов – сумки, штативы, фильтры и т.д., а для товара категории смартфоны – разделы: чехлы, защитные стекла, зарядные устройства и т.д.

Не могу найти рациональный способ решения данной задачи, с наименьшим количеством костылей. Посоветуйте – способ решения. Что использовать из API Битрикс, куда смотреть?

Никто не ответил, не помог добрым советом. Пришлось решать задачу самому. Необходимо было вывести на карточке товаров – категории (Разделы) сопутствующих товаров – в целях удобства клиентов, улучшения перелинковки страниц и поведенческих факторов. В итоге все получилось – вот так:

Учитывая, что мой способ решения возможно кому-нибудь пригодится, решил описать его в деталях. Вполне возможно гуру разработчикам 1-С Bitrix данный метод покажется не рациональным, но все работает, задача решена.

Группам товаров, в настойках раздела – задаем пользовательское поле.
Настойки раздела -> Доп. Поля -> Добавить пользовательское свойство

Выбираем, заполняем поля:
Тип данных: Привязка к разделам инф. Блоков
Код поля: я указал — UF_RECOMEND
Множественное: — Отмечаем
Дополнительные настройки поля: Указываем нужный инфоблок каталога.
Внешний вид: Список

После сохранения указанных настоек, в каждом разделе (Настойки раздела -> Доп. Поля) появится возможность выбрать разделы с сопутствующими товарами. Выбираем.

В дальнейшем, используя CIBlockSection::GetList получаем ID выбранных категорий товаров, где
«IBLOCK_ID»=>2 , — ID инфоблока каталога, в моем случае 2;
«ID»=>$arResult[«SECTION»][«ID»] – ID раздела товара,
А Array(«UF_RECOMEND») — отмечено заданное название пользовательского поля.

$db_list = CIBlockSection::GetList(Array(), $arFilter = Array(«IBLOCK_ID»=>5, «ID»=>$arResult[«ID»]), true, Array(«UF_RECOMEND»));
$props_array = $db_list->GetNext();

В итоге получен массив, в котором в $props_array[«UF_RECOMEND»] содержаться необходимые данные – ID выбранных, категорий товаров.

В нужное место в шаблоне каталога вставляем код,

5, «ID»=>$arResult[«ID»]), true, Array(«UF_RECOMEND»)); $props_array = $db_list->GetNext();

if (!empty($props_array[«UF_RECOMEND»])) <
$rsSections = CIBlockSection::GetList(
array(«SORT» => «ASC»),
array(«IBLOCK_ID» => $IBLOCK_ID, «ACTIVE» => «Y», «ID» => $props_array[«UF_RECOMEND»]),
false,
array(«NAME», «DETAIL_PICTURE», «PICTURE», «SECTION_PAGE_URL»),
false
);
?>

Сопутствующие товары:

» target=»_blank» rel=»nofollow»>

В данном случае, используется проверка на наличие выбранных категорий товаров if (!empty($props_array[«UF_RECOMEND»])) < … >, если сопутствующие категории не были отмечены, то соответственно массив пустой и код не будет отрабатываться.
Далее, так же используя CIBlockSection::GetList – получаем данные выбранных категорий товаров.

Затем, в цикле while – сформирован вывод самих категорий товаров, где:
— ссылка на URL – раздела выбранных товаров;
— URL изображения раздела;
— название раздела.

Источник

Читайте также:  Чисти сам своих окуней
Оцените статью