Накладываем водяные знаки на изображения в WordPress с помощью ImageMagick

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

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

WordPress для обработки изображений использует библиотеку PHP GD, однако есть лучшая альтернатива: ImageMagick (IM). У обеих библиотек имеются свои плюсы и свои минусы, однако я лично предпочитаю использовать IM, поскольку она не только более мощная, но и более простая.

Перед тем, как идти дальше, убедитесь в том, что вы установили ImageMagick вместе с его модулем на сервер с Debian/Ubuntu. Сделать это можно при помощи следующей команды:

$ sudo apt-get install imagemagick php5-imagick

Шаг 1. Регистрируем необходимый размер изображений

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

function register_watermarked_size() {
  add_image_size( 'watermarked', 550, 550, true ); 
}

add_action( 'init', 'register_watermarked_size' ); 

В нашем случае я задал изображение размером 550×500 пикселей, которое будет обрезанным (это делается при помощи аргумента, установленного в true). Вы можете выбрать другой размер.

Шаг 2. Сцепляемся с генерацией метаданных

WordPress идет с фильтром wp_generate_attachment_metadata, который позволяет нам изменять метаданные вложения (данные о вложении), сохраняемые в базе данных. Вот функция, которая позволяет сделать это:

function generate_watermarked_image( $meta ) {

  $time = substr( $meta['file'], 0, 7); // Extract the date in form "2015/04"
  $upload_dir = wp_upload_dir( $time );

  $filename = $meta['sizes']['watermarked']['file'];
  $meta['sizes']['watermarked']['file'] = watermark_image( $filename, $upload_dir );

  return $meta;

}

add_filter( 'wp_generate_attachment_metadata', 'generate_watermarked_image' );

В этой функции мы задаем переменную $upload_dir, которая требуется по одной причине (в противоположность использованию wp_upload_dir() везде в коде): без $time WordPress может запутаться в том случае, когда мы загружаем вложения к статьям с прошлого месяца; это приводит к тому, что изображения хранятся в нескольких разных папках.

Далее мы сохраняем исходное название файла и генерируем новое при помощи вызова функции watermark_image. Генерировать новое имя файла – опциональный шаг, однако мне лично нравится добавлять строку к названию изображения, что дает мне понять, что с изображением проводились какие-либо манипуляции.

Шаг 3. Водяной знак с помощью ImageMagick

Теперь мы переходим к самой сути этого руководства – к манипуляциям с изображением.

function watermark_image( $filename, $upload_dir ) {

  $original_image_path = trailingslashit( $upload_dir['path'] ) . $filename;

  $image_resource = new Imagick( $original_image_path );
  $image_resource->blurImage( 20, 10 );

  $watermark_resource = new Imagick( get_stylesheet_directory() . '/images/logo.png' );
  $image_resource->compositeImage( $watermark_resource, Imagick::COMPOSITE_DEFAULT, 100, 250 );

  return save_watermarked_image( $image_resource, $original_image_path );

}

Сначала мы получаем путь нашего неизменного изображения, после чего создаем новый объект Imagick. Как показано в примере, я решил размыть изображение и добавить логотип к нему примерно по центру. Вы можете расположить логотип в другой позиции, в соответствии со своими предпочтениями. Как вы, возможно, заметили, логотип – это экземпляр объекта Imagick,  и объединить их очень просто.

В данный момент изображение не сохранено, оно «томится» в памяти нашего сервера и ждет, когда мы выпустим его.

Шаг 4. Сохраняем новое изображение

Теперь, когда наше изображение изменено, мы можем сохранить его:

function save_watermarked_image( $image_resource, $original_image_path ) {

  $image_data = pathinfo( $original_image_path );

  $new_filename = $image_data['filename'] . '-watermarked.' . $image_data['extension'];

  $watermarked_image_path = str_replace($image_data['basename'], $new_filename, $original_image_path);

  if ( ! $image_resource->writeImage( $watermarked_image_path ) )
    return $image_data['basename'];

  unlink( $original_image_path );

  return $new_filename;

}

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

Мы обертываем участок сохранения (writeImage) в оператор if, чтобы убедиться, что изображение было корректно записано на диск – в противном случае мы возвращаем название исходного изображения.

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

Заключение

Как вы видите, ImageMagick упрощает добавление водяных знаков к изображениям WordPress или изменение изображений (наложение размытия и т.д.). Чтобы сохранить ваше время, я добавил готовый код в gist.