Назад

Как в Битриксе добавить водяной знак на изображения

Главная
Блог
Как в Битриксе добавить водяной знак на изображения

Водяные знаки — это надежный способ защитить авторские права на изображения и повысить узнаваемость бренда. В CMS Битрикс базовый функционал позволяет настроить водяной знак через административный интерфейс для анонса и детальной картинки элемента инфоблока. Однако для таких сценариев, как обработка фото в галерее, дополнительных свойств или программной загрузки изображений, требуется использование API.

Ключевым инструментом для решения этой задачи является метод CFile::ResizeImageGet. Он не только изменяет размер изображения, но и может применять к нему комплекс фильтров, включая наложение водяного знака.

1. Практическое применение: Наложение водяного знака на фото галереи

Представим, что у элемента инфоблока есть свойство MORE_PHOTO (галерея), и нам нужно вывести миниатюры с водяным знаком.

Исходный код для шаблона:

<?php
// Задаем параметры водяного знака
$arWaterMark = array(
    'name' => 'watermark', // Уникальное имя фильтра
    'position' => 'bc',    // Позиция: bottom center (внизу по центру)
    'type' => 'image',     // Тип - изображение
    'size' => 'small',     // Размер водяного знака: большой, средний, маленький или реальный
    'alpha_level' => 80,   // Уровень прозрачности (от 0 до 100)
    'file' => $_SERVER['DOCUMENT_ROOT'] . '/upload/watermark.png' // Абсолютный путь к файлу знака
);

// Обрабатываем каждое изображение в галерее
foreach ($arResult['PROPERTIES']['MORE_PHOTO']['VALUE'] as $key => $fileId) {
    
    $arResizeParams = array(
        'width' => 400,
        'height' => 400
    );
    
    // Генерируем миниатюру с водяным знаком
    $resizedImage = CFile::ResizeImageGet(
        $fileId,               // ID файла из свойства
        $arResizeParams,       // Массив с шириной и высотой
        BX_RESIZE_IMAGE_PROPORTIONAL, // Метод масштабирования (сохраняет пропорции)
        true,                  // Показывать картинку (не возвращать массив)
        $arWaterMark           // Массив с параметрами фильтра
    );
    
    // Сохраняем результат
    if ($resizedImage) {
        $arResult['GALLERY'][$key]['SRC'] = $resizedImage['src'];
        $arResult['GALLERY'][$key]['WIDTH'] = $resizedImage['width'];
        $arResult['GALLERY'][$key]['HEIGHT'] = $resizedImage['height'];
    }
}
?>

Как это работает на практике?

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

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

2. Справочник параметров водяного знака ($arWaterMark)

Массив параметров — это сердце механизма. Вот полный перечень доступных опций:

$arWaterMark = array(
    "name" => "copyright",       // Произвольное имя фильтра
    "position" => "br",          // Позиция: 
                                 // tl (top left) | tc (top center) | tr (top right)
                                 // ml (middle left) | mc (middle center) | mr (middle right)
                                 // bl (bottom left) | bc (bottom center) | br (bottom right)
    
    "type" => "image",           // "image" или "text"
    
    // Параметры для type = "image"
    "size" => "big",             // big | medium | small | real
                                 // (real использует оригинальный размер картинки)
    "coefficient" => 0.5,        // Коэффициент масштаба (0.1 – 1). Имеет приоритет над "size".
    "fill" => "exact",           // exact (точный размер) | resize (вписать) | repeat (замостить)
    "file" => $_SERVER["DOCUMENT_ROOT"] . "/watermark.png", // Путь к файлу знака
    
    // Параметры для type = "text"
    "text" => "МойСайт.ru",      // Текст водяного знака
    "color" => "FF0000",         // Цвет текста в HEX (без решетки #)
    "font" => $_SERVER["DOCUMENT_ROOT"] . "/fonts/arial.ttf", // Путь к TTF-шрифту
    "coefficient" => 2,          // Размер текста (1 – 7)
    "use_copyright" => "Y"       // Добавить символ копирайта © перед текстом
);

3. Автоматизация для новых элементов инфоблока

Чтобы водяной знак накладывался автоматически на все загружаемые изображения (в т.ч. в админке), можно использовать обработчики событий.

Пример для init.php:

<?php
use Bitrix\Main\EventManager;

$eventManager = EventManager::getInstance();

// Событие перед добавлением элемента
$eventManager->addEventHandler('iblock', 'OnBeforeIBlockElementAdd', array('MyWatermarkClass', 'addWatermark'));
// Событие перед обновлением элемента
$eventManager->addEventHandler('iblock', 'OnBeforeIBlockElementUpdate', array('MyWatermarkClass', 'addWatermark'));

class MyWatermarkClass
{
    public static function addWatermark(&$arFields)
    {
        // Задаем параметры водяного знака
        $arWaterMark = array( ... ); // как в примере выше
        
        // Обрабатываем основную картинку (PREVIEW_PICTURE)
        if (is_array($arFields['PREVIEW_PICTURE'])) {
            $arFields['PREVIEW_PICTURE'] = CIBlock::FilterPicture($arFields['PREVIEW_PICTURE'], $arWaterMark);
        }
        
        // Обрабатываем детальную картинку (DETAIL_PICTURE)
        if (is_array($arFields['DETAIL_PICTURE'])) {
            $arFields['DETAIL_PICTURE'] = CIBlock::FilterPicture($arFields['DETAIL_PICTURE'], $arWaterMark);
        }
        
        // Можно также обработать свойства типа "файл/картинка"
        // ...
    }
}

Примечание: Метод CIBlock::FilterPicture применяет фильтры непосредственно при сохранении элемента, что гарантирует единообразие для всех изображений на сайте.

Заключение

Наложение водяных знаков через CFile::ResizeImageGet — это мощный и гибкий инструмент в арсенале битрикс-разработчика. Ключевые преимущества:

  • Гибкость: Позволяет обрабатывать любые изображения, не только стандартные.

  • Производительность: Встроенная система кеширования минимизирует нагрузку.

  • Контроль: Точная настройка позиции, размера и прозрачности знака.

Главное, на что стоит обратить внимание — это корректность путей к файлам водяного знака и шрифтов, а также первоначальная нагрузка на сервер при генерации кеша для большого архива изображений.

Нужен надежный исполнитель?
Разрабатываем сайты, выполняем миграцию на Битрикс, дорабатываем функционал, сопровождаем проекты, а также занимаемся поисковым продвижением и комплексным маркетингом
Получить консультацию
Читайте по теме
Все статьи
Нужен надежный исполнитель?
Разрабатываем сайты, выполняем миграцию на Битрикс, дорабатываем функционал, сопровождаем проекты, а также занимаемся поисковым продвижением и комплексным маркетингом
Получить консультацию
Все статьи