Watermark (водяные знаки) на изображении в WordPress

Август 14th, 2011 Рубрики: CMS, HOWTO, PHP, SEO, Web, Wordpress

водяные знаки на изображениях wordpressДоброго времени, читатели www.k-max.name! Сегодня опишу маленькое HOWTO, как на WordPress реализовать водяные знаки на изображениях с помощью php и apache (.htaccess). Самое интересное, что не понадобится нам никаких плагинов! При этом, данное решение вполне применимо к другим движкам. Итак, во первых, добавим в файл .htaccess следующие строки:

# enable watermark
RewriteRule ^(.*)wp-content/uploads/(.*(jpg|jpeg|gif|png))$ $1watermark.php?img=wp-content/uploads/$2

Согласно данного правила, все пути, начинающиеся  на wp-content/uploads/ и заканчивающиеся на jpg, jpeg, gif или png будут заменены строкой watermark.php?src=wp-content/uploads/...  Это позволяет оставлять неизменными исходные изображения и не применять обработчик для таких файлов, как архивы и др. Соответственно, заменив путь wp-content/uploads/на свой можно применить обработку изображений для другого движка.

Кроме этого, необходимо положить в корень сайта файл с именем watermark.png. Это файл самого водяного знака, который будет наложен на основное изображение. Так же, необходимо положить файл empty.png, который содержит 1 прозрачный пиксель и накладывается на маленькие изображения.

Далее, необходимо создать файл watermark.php со следующим содержимым и также положить его в корень сайта:

<?php
/*
* Блог любителя экспериментов
* http://www.k-max.name/
*/

// получаем переданный в GET параметр img
 $img= $_GET['img'];

// задаем  минимальное разрешение, для которого не нужен большой водяной знак
// и на основании размера применяем соответствующий png-файл
 $size = getimagesize($img);
 if ($size[0]<100 || $size[1]<100 ) {
     $watermark = imagecreatefrompng('empty.png');
 } else {
     $watermark = imagecreatefrompng('watermark.png');
 }
 $watermark_w = imagesx($watermark);
 $watermark_h = imagesy($watermark);

// обрабатываем gif
if(eregi('.gif',$img)) {

    $image = imagecreatefromgif($img);
    $size = getimagesize($img);
    $dest_x = $size[0] - $watermark_w - 0;
    $dest_y = $size[1] - $watermark_h - 0;
    imagealphablending($watermark, true);
    header('Content-type: mage/gif');
    imagecopymerge($image, $watermark, $dest_x, $dest_y, 0, 0, $watermark_w, $watermark_h, 50);
    imagegif($image, "", 100);  

 }
// обрабатываем jpeg
elseif(eregi('.jpeg',$img)||eregi('.jpg',$img)) {

    $image = imagecreatefromjpeg($img);
    $size = getimagesize($img);
    $dest_x = $size[0] - $watermark_w - 0;
    $dest_y = $size[1] - $watermark_h - 0;
    imagealphablending($watermark, true);
    header('content-type: image/jpeg');
    imagecopy($image, $watermark, $dest_x, $dest_y, 0, 0, $watermark_w, $watermark_h);
    imagejpeg($image,"", 100);

 }
// обрабатываем png
 elseif(eregi('.png',$img)) {

    $image = imagecreatefrompng($img);
    $size = getimagesize($img);
    $dest_x = $size[0] - $watermark_w - 0;
    $dest_y = $size[1] - $watermark_h - 0;
    imagesavealpha($image, true);
    imagealphablending($watermark, true);
    header('Content-type: image/png');
    imagecopy($image, $watermark, $dest_x, $dest_y, 0, 0, $watermark_w, $watermark_h);
    imagepng($image);
 }
 else {
 exit("Изображение не имеет формат jpg, gif или png.");
 }
// освобождаем память
 imagedestroy($image);
 imagedestroy($watermark); 

 ?>

Готовый архив можно скачать ниже и распаковать себе в корневой каталог блога. В архиве отсутствует файл .htaccess, чтобы вы не заменили свои настройки wordpress, поэтому не забудьте добавить вышеуказанную строку.

Известные баги:

  • на изображениях gif - не сохраняется прозрачность водяного знака :( Чтобы от этого избавиться, уберите из строки в .htaccess это "|gif". Но в таком случае, водяные знаки не будут ставится на gif изображения.
  • на png с 8-bit политрой так же не сохраняется прозрачность водяного знака
  • данный способ не работает на хостингах, использующих NGINX для вывода статики.

Буду благодарен за решение или подсказку решения данных проблем.

Скачать watermark для изображений WordPress.

С Уважением, Mc.Sim!




Теги: , , , , ,

28 комментариев к “Watermark (водяные знаки) на изображении в WordPress”

  1. djduff
    Октябрь 19th, 2011 at 22:11
    1

    Даже на маленькие картинки все равно накладывает водяной знак.. на png

    • Октябрь 20th, 2011 at 10:26
      2

      Доброго времени.
      А что у вас в этиз строчках указано?
      $size = getimagesize($img);
      if ($size[0]<100 || $size[1]<100 ) {
      $watermark = imagecreatefrompng('empty.png');
      } else {
      $watermark = imagecreatefrompng('watermark.png');
      }

  2. Евгений
    Февраль 7th, 2012 at 21:41
    3

    Работает. А почему не предусмотрено наложение водяного знака на bmp файлы?

    • Февраль 7th, 2012 at 21:46
      4

      честно говоря, пока еще не встречал кого-то, кто в Веб размещает bmp-формат. :)

    • Февраль 7th, 2012 at 21:47
      5

      Если все же есть необходимость, могу попробовать допилить статью.

  3. nikkkkz
    Февраль 12th, 2012 at 12:30
    6

    Суть понял, но все равно, заразка не кидает вотермарк((
    Хотя у меня не cms-ка стоит, а тупо хтмл)
    буду разбираться, хотя пути к фоткам указал правильно
    кенкс)

  4. Пробовала
    Июль 30th, 2012 at 01:49
    7

    Не работает, код выдает кучу ошибок если напрямую файл кормить даже.
    вордпресс 3.4.1 php 5.3

    • Июль 30th, 2012 at 19:31
      8

      Что за ошибки?

  5. Korvin
    Август 8th, 2012 at 18:11
    9

    Подскажите, пожалуйста, если напрямую вызвать картинку через watermark.php?img=…, то все прекрасно работает, но на
    RewriteRule ^(.*)wp-content/uploads/(.*(jpg|jpeg|gif|png))$ $1watermark.php?img=wp-content/uploads/$2
    вообще не реагирует, все картинки на сайте остались чистыми и watermark.php ни разу не вызвался.

    • Август 9th, 2012 at 10:12
      10

      Может у вас стоит какой-то кэширующий плагин?

      • Октябрь 12th, 2012 at 20:46
        11

        Здравствуйте, спасибо вам за скрипт!
        У меня аналогичная проблема, как у Korvin.
        Даже обратился в тех.поддержку хостинга, они вроде помогли, включили какие-то функции, но просматривая сайт через Opera, водяной знак при увеличении фотографий по-прежнему не отображается. Хотя первое время на сайте всё отлично отображалось! Но вот на днях обнаружил отсутствие ватермарков.
        Насчёт кэш плагина есть вкрапление advanced-cache, но оно неактивно.

        • Октябрь 13th, 2012 at 00:40
          12

          Думаю, что тут без логов сервера не обойтись…

        • Октябрь 13th, 2012 at 00:40
          13

          Кстати, здравствуйте )

  6. Александра
    Февраль 19th, 2013 at 20:28
    14

    Спасибо за код!) ;)

  7. Март 15th, 2013 at 09:24
    15

    Mc.Sim, скрипт работает, большое спасибо, давно искал нечто подобное! Добро пожаловать ко мне в блог!

  8. Март 15th, 2013 at 09:36
    16

    Было бы не плохо, чтоб ещё делался ресайз водяного знака, в зависимости от размера изображения, на которое он накладывается. =)

    • Март 16th, 2013 at 15:04
      17

      Согласен. Было бы неплохо )
      Но на это моих базовых знаний не достаточно…

  9. Booggy
    Ноябрь 23rd, 2013 at 21:31
    18

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

    • Ноябрь 28th, 2013 at 13:10
      19

      Да , согласен. Если через nginx отдавать статику, то такая схема работать скорее всего не будет. Честно говоря, не приходилось использовать для wordpress такую связку…
      Большой плюс данного костыля в том, что загружаемые на хостинг картинки не модифицируются. Это для меня было определяющим параметром.

  10. Декабрь 20th, 2013 at 19:31
    20

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

    • Декабрь 27th, 2013 at 09:01
      21

      ДА, видел Вашу модификацию. Спасибо.

  11. Ноябрь 3rd, 2014 at 16:05
    22

    А можно код для разных размеров изображений — разный размер знака?

  12. Ноябрь 3rd, 2014 at 16:13
    24

    Не работает в блоге http://fotologi.ru

    • Декабрь 18th, 2014 at 13:58
      25

      Без логов веб-сервера трудно что-либо подсказать…

  13. Декабрь 28th, 2014 at 16:49
    26

    Вот как обидно, сейчас и в старом блоге перестали накладываться водяные знаки, не отследил когда это возникло. Возможно после обновления WP. Ошибок в логах нет.

    • BooggyMan
      Апрель 9th, 2015 at 12:49
      27

      Возможно, что на хостинге применили связку nginx+apache, в этом случае работать не будет.

      • Июнь 7th, 2015 at 22:05
        28

        не согласен. На моем хостинге используется nginx+apache. И, как видите, работает.

Написать комментарий