Все СЕОшники знают, что накладывать водяные знаки на картинки – это хорошо. Пользователи часто передают картинки «из рук в руки», например с целью «Посмотри, какой ржач!» или «Вот как круто выглядит процессор, который я купил!».
Где выгода нам? Если на картинке будет «водяной знак»… А, да – водяным знаком в Веб называется просто другое изображение, наложенное на данное изображение. Обычно водяным знаком является просто строка с адресом сайта, откуда это изображение было взято. В общем, мне уже не надо продолжать предложение «Если на картинке будет водяной знак, а картинка понравится пользователю, то он обязательно заглянет на Ваш сайт»?
Примером водяного знака может служить это изображение (обратите внимание на правый нижний угол).
Этот процесс можно автоматизировать, прикрутив автоматическое наложение водяного знака на изображение прямо во время загрузки. И я покажу как.
Для работы, как обычно, используется PHP, т.к. Ваш сайт наверняка нписан на нем. А для наложения графики будет использовать расширение PHP для работы с графикой. А именно – библиотека GD2. Включить ее в Windows можно, раскомментировав соответствующий модуль. В линуксе – перекомпилировав PHP с соответствующими флагами.
Я не буду вдаваться в саму библиотеку. Я приведу сразу код, а потом объясню, что он делает.
$znak_hw = getimagesize("znak.png");
$foto_hw = getimagesize("foto.jpg");
$znak = imagecreatefrompng ("znak.png");
$foto = imagecreatefromjpeg ("foto.jpg");
imagecopy ($foto,
$znak,
$foto_hw[0] - $znak_hw[0],
$foto_hw[1] - $znak_hw[1],
0,
0,
$znak_hw[0],
$znak_hw[1]);
imagejpeg ($foto, "done.jpg", "100");
imagedestroy ($znak);
imagedestroy ($foto);
Библиотека GD2 очень сильно облегчает жизнь программисту, когда приходится работать с графикой. Сейчас поймете почему.
В каталоге со скриптом должны лежать еще 2 файла – foto.jpg (это изображение, НА которое нужно наложить водяной знак) и znak.png (это сам знак). Если Вы хотите, чтобы накладывалась, например, только надпись (без фона), то сделайте фон (все, что не является самим знаком) прозрачным (именно поэтому был выбран формат png).
Итак. Сначала мы получаем размеры наших изображений. Даже файл открывать не надо! Для этого подходит функция getimagesize, принимает на вход имя файла. Полученные размеры записываются в массив, где в нулевой ячейке будет ширина, а в первой – высота (в пискелах, разумеется).
После получения размеров, нужно создать в памяти интерпретатора сами изображения, чтобы было с чем работать (потом обработанное изображение записывается в файл). Для этого здесь нам нужны две функции imagecreatefrompng (читает формат png) и imagecreatefromjpeg (читает формат jpg, соответственно). Возвращает дескриптор изображение («ресурс», как принято называть его в PHP).
После того, как мы загрузили изображение в память, их можно начать обрабатывать. Здесь в качестве обработки выступает единственная операция – копирование одного изображение на другое (водяной знак копируется на фото). Для копирования мы используем функцию imagecopy, которая принимает следующие параметры: исходное изображение, копируемое на него изображение, координаты расположения копируемого изображения (два штука), и область самого копируемого изображения (четыре штука).
Координаты расположения копируемого изображение – это координаты левого верхнего угла копируемого изображения на фото. Здесь мы от размеров фотки отнимаем размеры знака и получется, что изображение копируется аккуратно в угол.
Размеры копируемого изображения остаются оригинальными – с левого верхнего его угла по правый нижний.
Следующим шагом нам нужно создать получившееся изображение. Мы создаем его с помощью функции imagejpeg, которая, соответственно, создает изображение в формате jpg.
Удаляем дескрипторы, чтобы не засирать память с помощью функций imagedestroy. Они не удаляют сам файл, не волнуйтесь.
Все, наше изображение готово. Интегрировать такую обработку очень просто. Нужно на этапе загрузки файла, обработать временное изображение (filename_tmp) и после этого скопировать его в уже каталог назначения.
И еще одна подсказка. Чтобы каждый раз не смотреть в файл, «что там у нас получилось», можно выводить изображение прямо в браузер. Так гораздо быстрее для отладки. Для вывода изображения в браузер закомментируйте строку
imagejpeg ($foto, "done.jpg", "100"); и напишите вот такой код вместо нее:
header ('Content-Type: image/gif');
imagegif ($foto);
Конечно, перед header() никакого вывода в браузер быть не должно, иначе заголовок не отправится.
Удачи! :)