Как создать динамическую картинку из текста в WordPress с примерами кода

Автор: Ксения Романова | Опубликовано: 25.02.2026

В некоторых проектах на WordPress возникает задача отображать динамические изображения, которые формируются на лету из текста или других данных. Например, это могут быть баннеры, графики или персонализированные картинки с надписями. В этой статье мы разберём, как создать динамическую картинку из текста с помощью PHP, а также рассмотрим полезные плагины, упрощающие работу.

Почему динамические изображения полезны в WordPress

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

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

Однако динамическая генерация требует знания PHP и правильной организации кода, чтобы не создавать лишней нагрузки на сервер.

Создание динамической картинки из текста на PHP в WordPress

Для генерации изображений на лету в PHP обычно используют библиотеку GD или ImageMagick. WordPress по умолчанию поддерживает GD. Рассмотрим пример, как сделать простой скрипт, который по URL выдаст PNG с текстом.

Пример кода генерации изображения

function yelly_generate_text_image() {
    if (!isset($_GET['text'])) {
        wp_die('Параметр text не задан');
    }
    $text = sanitize_text_field($_GET['text']);
    $width = 400;
    $height = 100;
    $im = imagecreatetruecolor($width, $height);
    $bg = imagecolorallocate($im, 255, 255, 255);
    $textcolor = imagecolorallocate($im, 0, 0, 0);
    imagefilledrectangle($im, 0, 0, $width, $height, $bg);
    $font_path = get_template_directory() . '/fonts/arial.ttf'; // Укажите путь к TTF-шрифту
    imagettftext($im, 20, 0, 10, 50, $textcolor, $font_path, $text);
    header('Content-Type: image/png');
    imagepng($im);
    imagedestroy($im);
    exit;
}
add_action('init', function() {
    if (isset($_GET['yelly_image'])) {
        yelly_generate_text_image();
    }
});

Этот код нужно добавить в functions.php вашей темы или в отдельный плагин. После этого, вызов страницы с URL https://ваш-сайт.ru/?yelly_image=1&text=Пример отобразит PNG картинку с текстом «Пример».

Обратите внимание на использование функции sanitize_text_field для безопасности и шрифт TTF, который должен быть в папке темы. Можно использовать любой шрифт, главное, указать правильный путь.

Добавление параметров и улучшение генерации

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

function yelly_generate_text_image() {
    $text = isset($_GET['text']) ? sanitize_text_field($_GET['text']) : 'Без текста';
    $font_size = isset($_GET['size']) ? intval($_GET['size']) : 20;
    $width = isset($_GET['width']) ? intval($_GET['width']) : 400;
    $height = isset($_GET['height']) ? intval($_GET['height']) : 100;
    $text_color_hex = isset($_GET['color']) ? $_GET['color'] : '000000';
    $bg_color_hex = isset($_GET['bg']) ? $_GET['bg'] : 'FFFFFF';

    list($r, $g, $b) = sscanf($text_color_hex, "%02x%02x%02x");
    list($br, $bg, $bb) = sscanf($bg_color_hex, "%02x%02x%02x");

    $im = imagecreatetruecolor($width, $height);
    $bg_color = imagecolorallocate($im, $br, $bg, $bb);
    $text_color = imagecolorallocate($im, $r, $g, $b);
    imagefilledrectangle($im, 0, 0, $width, $height, $bg_color);

    $font_path = get_template_directory() . '/fonts/arial.ttf';
    imagettftext($im, $font_size, 0, 10, $height/2 + $font_size/2, $text_color, $font_path, $text);

    header('Content-Type: image/png');
    imagepng($im);
    imagedestroy($im);
    exit;
}

Теперь можно формировать URL с разными параметрами, например:

https://ваш-сайт.ru/?yelly_image=1&text=Привет&size=30&color=FF0000&bg=FFFF00&width=500&height=150

Этот URL сгенерирует картинку размером 500x150 пикселей с красным текстом на жёлтом фоне.

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

Если вы не хотите писать код, можно использовать плагины. Вот несколько полезных вариантов с описанием:

1. Dynamic Featured Image

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

2. Easy Watermark

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

3. Создание кастомных плагинов с поддержкой GD

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

Практические советы и рекомендации

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

Кеширование: Генерация картинок — процесс ресурсоёмкий. Используйте серверное кеширование или плагин, чтобы не генерировать одно и то же изображение несколько раз.
Безопасность: Очищайте все входящие параметры, используйте sanitize_text_field и ограничивайте размеры, чтобы избежать атак.
Шрифты: Работайте только с надёжными шрифтами, лучше хранить их в теме или плагине.
Оптимизация: Используйте формат PNG для прозрачных или текстовых картинок, JPEG — для фотографий. Можно дополнительно применять сжатие.

Заключение

Создание динамических изображений из текста в WordPress — мощный инструмент для персонализации и автоматизации визуального контента. С помощью библиотеки GD и простого кода вы можете быстро организовать генерацию картинок под любые задачи. А использование готовых плагинов облегчает интеграцию и расширение функционала.

Для удобного управления на сайте с доменом yelly.ru можно использовать собственное решение, основанное на примерах выше, или адаптировать плагины из каталога WordPress. Подробнее о плагинах и их настройке смотрите на WPSHOP.ru.