В связи с переходом на новый движок... возможны сбои в работе! Простите!
Работы производятся прямо сейчас 19-03-2024! 🞨
Меню :
foto (22)
php img (12)
php (329)



Blog (1392)
php (329)
js (244)
html (147)
css (131)
html tags (62)
js tag (56)
jquery (42)
text (37)
js method (36)
php array (33)
js date (33)
form html (30)
online (29)
Показать еще :
fonts (26)
ruweb.net (25)
foto (22)
php file (20)
atom (20)
forum (19)
hosting (18)
svg (18)
input (18)
php date (17)
board (16)
php time (16)
html book (16)
color (15)
info (15)
img (14)
js time (14)
js url (14)
js events (14)
htaccess (13)
select (13)
notepad (13)
osclass (13)
keyboard (12)
знак (12)
dw block (12)
php img (12)
php path (12)
table (12)
download (12)
icon (11)
form (11)
jsphp (11)
alphabet (10)
keyframes (10)
js delete (10)
yandex (10)
mouse (10)
chart (9)
hover (9)
dosite (8)
browser (8)
php post (7)
comment (7)
php url (7)
iframe (6)
php get (6)
mysql (6)
click (6)
list (6)
canvas (6)
adminka (6)
vs code (6)
js id (5)
mb (5)
heading (5)
value (5)
reg.ru (5)
ftp (5)
year (5)
js math (5)
tag a (5)
bbcode (4)
php var (4)
base64 (4)
xml (4)
scandir (4)
games (4)
flags (4)
symbols (4)
week (4)
day (4)
ssl (4)
нок (4)
submit (4)
task (4)
vk (4)
month (4)
pages (4)
console (4)
js form (4)
domen (3)
line (3)
https (3)
js post (3)
jquery post (3)
money (3)
numbers (3)
js img (3)
padding (3)
куб (3)
captcha (3)
ucoz (3)
js hash (3)
tag hr (2)
details (2)
typeof (2)
seo (2)
prompt (2)
sitemap (2)
рся (2)
youtube (2)
height (2)
arrows (2)
js vars (2)
counter (2)
google (2)
qr kod (2)
video (2)
speed (1)
smile (1)
нод (1)
rutube (1)
scroll (1)
windows (1)
archive (1)
jino (1)
cursor (1)

Ставим водяной знак на картинку php

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

А именно наложения прозрачного "водяного знака" на оригинальное изображение.

Пошаговая инструкция нанесения водяного значка php

  1. Описание как нанести водяной знак на изображение с помощью php
  2. Условие для установки водяного знака
  3. Создаем виртуальный водяной знак.
  4. Сохранение изображения с водяным знаком.
  5. Скрипт водяного знака
  6. Создание водяного знака в редакторе
  7. Как добавить свой размер водяного знака и условие...
  8. Скачать скрипт установка водяного знака- что в архиве.
  9. Скачать можно здесь.

  1. Описание как нанести водяной знак на изображение с помощью php

    Описание алгоритма нанесения водяного знака с помощью php.

    Создаем(заранее) несколько размеров водяных знаков в формате png. В зависимости от размеров загружаемого изображения ставится тот размер водяного знака(png), который подходит по условиям php.

    Накладываем водяной знак, уже на существующую картинку.

    Переписываем исходное изображение.

    Почему именно такой способ нанесения водяного знака!?

    Наложение прозрачного изображения на оригинальное ...

    Дело в том, что я попробовал использовать нанесение текста вместо картинки, но это оказалось таким проблематичным, что я на некоторое количество времени отказался вообще от водяного знака.

    Одна из главных проблем - это позиционирование водяного знака и сделать это со шрифтом... сложно... короче! Я "забодался"!

    В общем - я протестировал нанесение полупрозрачного изображения в виде водяного значка.

    Наш водяной знак будет стоять всегда "ПОСЕРЕДИНЕ" - если вам потребуется разобраться с позиционированием, то у нас есть страница на эту тему!

    Процесс наложения - создание водяного знака.

    У нас будет 4 изображения для наложения водяных знаков.

    Вам понадобится программа, которая сомжет делать полупрозрачное изображение - использовалась программа "Photoshop" в архив положу файл "psd" из которого делались ниже приведенные файлы. Вам потребуется изменить только разрешение исходника + собственный текст, и сохранить новое изображение в новом разрешении 4 раза, в названии файла вы видите какое разрешение файла:

    $watermark_src = __DIR__ . '/watermark_1300_307.png' ;

    $watermark_src = __DIR__ . '/watermark_1000_236.png' ;

    $watermark_src = __DIR__ . '/watermark_700_165.png' ;

    $watermark_src = __DIR__ . '/watermark_500_118.png' ;


  2. Условие для установки водяного знака

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

    Загружаем внешнюю картинку с помощью move_uploaded_file

    Получаем размер картинки с помощью getimagesize

    $size_img = getimagesize($img);

    ширина

    $width = $size_img[0];

    высота

    $height = $size_img[1];

    Создаем условие наложения определенного водяного знака если существующее изображение будет в пределах ширина больше "1350" и высота больше "400"

    if($width > 1350 and $height > 400)

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

    $watermark_src = __DIR__ . '/watermark_1300_307.png' ;

    Далее позиционирование...ставим посередине картинки(подробнее)

    $otstup_width = ($width - 1300)/2;

    $otstup_height = ($height/2) - (307/2);

    Создаем некую переменную, потом будем её использовать

    $do_watermark = 1;

    Собираем код(весь код не буду публиковать - очень длинный...(всё будет в архиве)):

    $img = __DIR__ . '/оригинал.png' ; // путь до исходной картинки

    $size_img = getimagesize($img); // получаем размер картинки

    $width = $size_img[0]; // ширина

    $height = $size_img[1]; // высота

    if($width > 1350 and $height > 400)

    {

      $watermark_src = __DIR__ . '/watermark_1300_307.png' ;

      $otstup_width = ($width - 1300)/2;

      $otstup_height = ($height/2) - (307/2);

      $do_watermark = 1;

    }

    еще условия... много условий


  3. Создаем виртуальный водяной знак.

    Вот и пригодилась та переменная($do_watermark)), по условию её существования... получаем размеры водяного знака + создаем в переменную "$image" наш оригинал.

    if($do_watermark)

    {

      $sizeWM = getimagesize($watermark_src); // получаем размер водяного знака

      $watermark_width = $sizeWM[0]; // ширина водяного знака

      $watermark_height = $sizeWM[1]; // высота водяного знака

      //Создаёт новое изображение из файла или URL

      if($mime[1]=='jpeg')

      {

        $image = imagecreatefromjpeg($img);

      }

    еще условия... много условий

    }

    Далее также создаем в переменную водяной знак...

    $watermark = imagecreatefrompng($watermark_src);

    И накладываем два изображения друг на друга...

    imagecopy($image, $watermark, $otstup_width, $otstup_height , 0, 0, $watermark_width, $watermark_height);

  4. Сохранение изображения с водяным знаком.

    Далее нам остается перезаписать существующую картинку(по адресу $img) на эту же картинку, но только с водяным знаками "$image".

    if($mime[1]=='jpeg')

    {

    imagejpeg($image, $img, 100); // качество в 100%

    }

    еще условия... много условий

    Очищаем

    Уничтожение изображения

    imagedestroy() освобождает память, занятую изображением image.

    imagedestroy($image);

    imagedestroy($watermark);


  5. Скрипт водяного знака

    Как использовать архив со скриптом и примерами водяных знаков?

    После того, как скачаете архив.

    Бросаем в любую папку на сайте, кроме файла "psd"(он нужен для того, чтобы понять, как должен выглядеть файл водяного знака.).

    Скрипт водяного знака

    Открываем файл "test.php" в браузере, нажимаем "выбрать картинку", на которую будет наложен водяной знак. Чекбокс уже "чекнут", его не нужно трогать.

    Скрипт водяного знака

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

    Скрипт водяного знака

    Плюс - на странице выводится картинка с установленным водяным знаком:

    Нажмите, чтобы открыть в новом окне.
    Скрипт водяного знака

    Обращаю ваше внимание на путь - используется константа __DIR__ - если файл "test.php" со скриптом, либо сам скрипт будет находиться в другой папке, то путь до картинки с водяным знаком нужно прописывать вручную.

    Скрипт водяного знака

    Путь сохранения картинки

    Куда будет файл изначально сохраняться - $uploaddir.

    И второй путь до картинки с водяным знаком.

    Если вдруг загрузили не ту картинку, то вам может пригодиться замена картинки

  6. Создание водяного знака в редакторе

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

    Файл psd - это пример водяного знака. Как сделать водяной знак в фотошопе? Там не так сложно... в двух словах...

    Создаем несколько(как мимум 4) слоев с текстом.

    Использую шрифт bebas

    Растрируем.

    Накладываем на задние слои размытие по гауссу.

    Смещаем каждый из слоев в 4 направлениях. У вас должно получиться, что-то типа такого(здесь видим - непрозрачность 100%):

    Нажмите, чтобы открыть в новом окне.
    Создание водяного знака в редакторе

    Я использую непрозрачность для водяного знака 10%:

    Нажмите, чтобы открыть в новом окне.
    Создание водяного знака в редакторе

    Сохраняем изображение как ".png" - непрозрачность закрепится.

    Готовый файл "psd" - не удаляйте, потом он вам ещё пригодится, потому, что возможно, вам потребуются другие размеры изображения.

    Как создать несколько размеров водяных знаков?

    Для того, чтобы создать несколько, разных размеров вашего водяного знака, на примере фотошопа:

    Нажимаем сочетание клавиш ctrl + alt + i, либо.. изображение -> размер изображения

    Как создать несколько размеров водяных знаков?

    Выставляем ширину требуемую, высота будет увеличена/уменьшена пропорционально(см.скрин, ну и на водяной знак вы тоже можете посмотреть...)

    Нажмите, чтобы открыть в новом окне.
    Как создать несколько размеров водяных знаков?

  7. Как добавить свой размер водяного знака и условие...

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

    Рассмотрим последнее условие php...

    elseif($width < 750 and $height > 120 and $width > 550)

    {

    $watermark_src = __DIR__. '/watermark_500_118.png' ;

    $otstup_width = ($width - 500)/2;

    $otstup_height = ($height/2) - (118/2);

    $do_watermark = 1;

    }

    Вы хотите, например, добавить размер водяного знака по ширине 300px.

    Идем в редактор "ctrl + alt + i"(про размер я говорил здесь)

    Изменяем ширину на 300(высота получается 71):

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

    Сохраняем водяной знак как watermark_300_71.png

    Первая строка:

    Из правой части условия "$width > 550" перемещаем 550 в левую часть

    $width < 550

    Высоту устанавливаем больше нашего водяного знака 71:

    $height > 80

    Правая часть ширина водяного знака 300 + 50

    $width > 350

    Получилось:

    elseif($width < 550 and $height > 80 and $width > 350)
    Отступы:

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

    Отступ справа слева :

    $otstup_width = ($width - 300)/2;

    Отступ сверху, снизу:

    $otstup_height = ($height/2) - (71/2);
    Новый код:

    elseif($width < 550 and $height > 80 and $width > 350)

    {

    $watermark_src = __DIR__. '/watermark_300_71.png' ;

    $otstup_width = ($width - 300)/2;

    $otstup_height = ($height/2) - (71/2);

    $do_watermark = 1;

    }

    Данный код добавляем в файл "test.php" к предыдущим условиям.

  8. Скачать скрипт установка водяного знака- что в архиве.

    Что в архиве?

    В архиве 4 водяных знака для примера:

    https://dwweb.ru/___file_cms/img/watermark/watermark_1300_307.png
    https://dwweb.ru/___file_cms/img/watermark/watermark_1000_236.png
    https://dwweb.ru/___file_cms/img/watermark/watermark_700_165.png
    https://dwweb.ru/___file_cms/img/watermark/watermark_500_118.png

    В архиве файл psd(можно открыть, например фотошопом, либо любой другой программой, которая работает с файлами psd), о файле psd.

    Скачать скрипт установка водяного знака- что в архиве.
    Скачать можно здесь.
Не стесняемся говорить спасибо!
Помочь проекту DwWeb.ru

Поделиться ссылкой! C друзьями или врагами!

Этим вы очень поможете проекту! Заранее огромное спасибо!

Ещё : dwweb.ru есть здесь:
ruweb
Все статьи авторские, при копироавании активная ссылка обязательна DwWeb.ru! © 2015 - 2024 Контакты. Реклама на сайте Лучший хостинг : RUWEB + помощь по RUWEB
Страница загружена за : 0.051887 секунд. Подробнее