moovix

Дополнительные изображения и картинки в Битрикс

Moovix » Блог » Дополнительные изображения и картинки в Битрикс

Для вывода дополнительных изображений в элементах информационного блока (т.е. изображений кроме PREVIEW_PICTURE и DETAIL_PICTURE) необходимо создать дополнительное свойство типа ФАЙЛ с кодом MORE_PHOTO.

Детально

Вот мы создали свойство, а далее его надо прописать в шаблоне.

Я добавлю это в инфоблок Новости

в шаблоне news.detail добавить в файл result_modifier.php следующий код:

				
					<?
$arResult["MORE_PHOTO"] = array();
    if(isset($arResult["PROPERTIES"]["MORE_PHOTO"]["VALUE"]) && is_array($arResult["PROPERTIES"]["MORE_PHOTO"]["VALUE"]))
{
    foreach($arResult["PROPERTIES"]["MORE_PHOTO"]["VALUE"] as $FILE)
{
$FILE = CFile::GetFileArray($FILE);
    if(is_array($FILE))
    $arResult["MORE_PHOTO"][]=$FILE;
}
}
?>
				
			

тем самым мы сможем обращаться к массиву фотографий также, как это происходит в шаблоне каталога: $arResult[«MORE_PHOTO»].

Далее копируем код из шаблона каталога для вывода изображений в шаблон новостей news.detail:

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

CFile::ResizeImageGet

Вот что говорится в официальной документации: Функция уменьшает картинку и размещает уменьшенную копию в папку /upload/resize_cache/путь. Один раз уменьшив изображение получаем физический файл, который позволяет при последующих обращениях не проводить операции по уменьшению изображения. При следующем вызове функция вернет путь к уменьшенному файлу.

Таким образом нам достаточно немного подправить код:

				
					<?
    // additional photos
    $LINE_ELEMENT_COUNT = 2; // number of elements in a row
    if (count($arResult["MORE_PHOTO"]) > 0) : ?>
        <? foreach ($arResult["MORE_PHOTO"] as $PHOTO) : ?>
            <? $file = CFile::ResizeImageGet($PHOTO, array('width' => 150, 'height' => '112'), BX_RESIZE_IMAGE_EXACT, true); ?>


            <div class="more_photo">
                <a href="<?= $PHOTO["SRC"] ?>" name="more_photo">
                    <img decoding="async" border="0" src="<?= $file["src"] ?>" width="<?= $file["width"] ?>" height="<?= $file["height"] ?>" alt="<?= $arResult["NAME"] ?>" title="<?= $arResult["NAME"] ?>" />
                </a>
            </div>


        <? endforeach ?>
    <? endif ?>
				
			

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

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Moovix » Блог » Дополнительные изображения и картинки в Битрикс

Есть вопрос? мы онлайн

Есть проект? Заполните бриф.

top