ایجاد واترمارک بر روی عکس با php

خیلی از سایت ها هستند که هر عکسی میزارن یه لوگو از خودشون روی عکس میچسبونن که واترمارک (watermark) یا کپی رایت (copy right) نامیده میشه! این کار دو فایده داره: (فایل مربوط به مثال های این اموزش رو میتونید از انتهای این پست دانلود کنید)

  1. باعث میشه که کسی نتونه به راحتی عکس های سایت شما رو بدزده و روی سایت خودش بزاره
  2. باعث میشه که اگه کسی یه عکس از روی سایت شما برداشت و روی سایت خودش به اشتراک گذاشت یه لوگو از سایت شما یا ادرس سایت شما هم روی عکس باشه و باعث بشه که آدرس سایت شما منتشر بشه 😀 و معروف بشید به مرور زمان!

خب حالا چجوری میشه با php بر روی عکس ها واترمارک یا کپی رایت گذاشت؟ اگه یادتون باشه در اموزش قبلی بهتون گفتم که چجوری با کتابخونه ی wideimage کار کنید! اگه نمیدونید wideimage چیه میتونید اینجا برید (کلیک کنید) و یه نگاهی بندازید و دوباره برگردید.

کتابخونه ی wideimage قابلیت های زیادی داره که باعث میشه کارکردن با عکس ها راحت تر بشه و شما توی دردسر نیوفتید! همچنین سرعتش خیلی بالا هست چون ماژولار نوشته شده و کل کد اجرا نمیشه و فقط اون ماژولی که مورد نظر شماست اجرا میشه.

برای ایجاد واترمارک یا کپی رایت بر روی عکس با php شما میتونید به شیوه ی زیر عمل کنید:

ما توی مثال بالا توی خط اول میایم و کتابخونه ی wideimage رو به صفحه ی خودمون اظافه میکنیم , بعدش عکس اصلی رو با استفاده از تابع load لود میکنیم و توی متغیر img قرار میدیم. بعدش واترمارک یا همون لوگوی خودمون رو لود میکنیم و توی متغیر watermark قرار میدیم. حالا میایم و با تابع merge این دو عکس رو با هم قاطی میکنیم (به هم میچسبونیم). تابع merge رو روی متغیر img که عکس اصلی خودمون هست اجرا میکنیم که یعنی ما یه عکس دیگه رو میخوایم به عکسی که درون متغیر img هست بچسبونیم.

حالا میایم و مقادیر رو به درون تابع merge میدیم! مقدار اول عکسی که قراره به عنوان لوگو باشه رو مشخص میکنه , مقدار دوم فاصله ی افقی از مبدا مختصات و مقدار سوم فاصله ی عمودی از مبدا مختصات (y) رو مشخص میکنه و مقدار اخر هم میزان شفافیت یا opacity رو مشخص میکنه , حالا که دوتا عکس رو به هم چسبوندیم اون رو درون متغیر newimage قرار میدیم و بعدش با دستور saveToFile عکس جدیدمون که درون متغیر newimage بود رو با نام mynewpic.png ذخیره میکنیم 😀 به همین راحتی روی عکس لوگوی خودمون رو زدیم!

نکته : مبدا مختصات در صفحات کامپیوتر بالاترین نقطه سمت چپ هست!

شما میتونید برای اینکه مشخص کنید واتر مارک در چه موقعیت مکانی قرار بگیره از درصد و پیکسل استفاده کنید. درمثال قبلی من از پیکسل استفاده کردم که فاصله ی افقی و عمودی رو ۱۰ پیکسل دادم! موقعی که میخوایم واحد ما پیکسل باشه فقط عدد میدیم و دیگه px در کنار عدد درج نمیکنیم! به صورت پیش فرض عدد خالی پیکسل در نظر گرفته میشه. اما اگه بخوایم موقعیت مکانی رو بر حسب درصد بیان کنیم لازم هست که علامت % (درصد) رو در کنار مقدار مورد نظر خودمون قرار بدیم. به مثال زیر دقت کنید:

توی مثال بالا من فاصله ها رو ۵۰% و ۱۰% مشخص کردم 😀 دقت کنید که وقتی از درصد استفاده میکنید باید اون رو درون علامت کوتیشن یکانی (‘) یا دوتایی (“) قرار بدید. من در مثال بالا میزان شفافیت رو ۱۰۰ گذاشتم که همون صد درصد هست! میزان شفافیت میتونه عددی بین ۰ تا ۱۰۰ باشه که ۰ به معنای شفافیت یا opacity برابر با صفر درصد و ۱۰۰ به معنای شفافیت ۱۰۰ درصد است.

شما میتونید از کلمات left و right و center و bottom توی موقعیت مکانی استفاده کنید , مثلا اگه موقعیت مکانی x و y رو برابر با Center بدید واترمارک در وسط عکس شما درج میشه:

در مثال بالا واترمارک دقیقا در وسط عکس شما درج میشه 😀 دیگه بهتر از این چی میخواید؟ برید حالشو ببرید به این سادگی عکسا رو فیتیله پیچ دارید میکنید!

خب حالا میتونیم اعداد و کلمات کلیدی center , left , right ,top ,bottom رو با هم ترکیب کنیم مثلا میخوام عکسم ۱۰ پیکسل اونورتر از مرکز واترمارک بخوره:

در مثال بالا من یکی از مختصات رو اومدم ۱۰ پیکسل ازش کم کردم! شما میتونید درصد و پیکسل رو هم باهم قاطی کنید 😀 جیگر مخلوط بزنید!

در مثال کاملا مشخصه چیکار کردم 😀 فک نکنم نیاز به توضیح باشه! فقط بدونید اومدم مختصات رو با درصد مشخص کردم بعدش یه مقداری بر حسب به اون اظافه و کم کردم , میتونید برای اطلاعات بیشتر اینجا رو نیز مطالعه کنید(کلیک کنید)

شما میتونید مثال هایی که در این اموزش زدم رو به همراه کتابخونه ی wideimage از انتهای همین پست دانلود کنید و استفاده کنید, امیدوارم بدردتون بخوره.

دوستانی که سوال یا درخواستی دارند میتونن از بخش نظرات همین پست مطرح کنند.

نمونه کد ایجاد واترمارک (کپی رایت) روی عکس با php
83.3 KiB
172 Downloads
اطلاعات بیشتر
به اشتراک بگذارید:Email this to someoneShare on FacebookTweet about this on TwitterShare on Google+Digg thisShare on LinkedInPin on PinterestShare on StumbleUponFlattr the authorShare on RedditBuffer this pageShare on TumblrPrint this pageShare on YummlyShare on VK
  1. پست خوبی بود!
    برای درج واترمارک روی تمام صفحات pdf کتابخونه‌ای برای php وجود داره؟! ممنون می‌شم معرفی کنید و هرقدر خواستید در موردش بنویسید(حتی یک پس کامل!!!)

    • برای همه چیز کتابخونه هست 😀 توی PHP کاری نیست که نشه انجام داد! به زودی یه اموزش راجب کار با فایل های PDF میزارم. ممنون از نظر مفید شما

  2. سلام
    از زبان فارسی برای نوشتن متن بر روی عکس پشتیبانی نمیکنه؟؟؟؟
    فارسی رو به صورت حروف جدا جدا مینویسه . میشه براش انکدینگ ست کرد؟؟؟ اگه بله چجوری؟؟؟؟

    • عکسی که به عنوان واتر مارک استفاده میکنید مشکل داره! ما در اینجا با حروف فارسی کاری نداریم فقط دوتا عکس رو روی هم میچسبونیم!

    • دوست عزیز در صورتی که میخواید یه متنی رو تایپ کنید باید ابتدا فونت فارسی رو انتخاب کنید. فونت پیش فرض روی انگلیسی هست شما میتونید به صورت زیر عمر کنید:

      $canvas->useFont('path/to/arial.ttf', 16, $image->allocateColor(0, 0, 0));

      همچنین میتونید به داکیومنت مراجعه کنید(کلیک کنید)
      اگه مشکلتون حل نشد بگید تا کمک کنم. موفق باشید.

  3. انواع فونت فارسی رو هم انتخاب کردم ، اما مثه اینکه با فارسی نویسی مشکل داره ، فارسی رو به صورت حروف جدا شده و برعکس چاپ میکنه . اگه میشه راهنمایی کنید که چطور مشکل رو رفع کنم با این کتابخونه میشه یا باید از چیزهای دیگه استفاده کنم؟؟؟؟
    ممنون

  4. McDelta

    لطفا آموزش درج واترمارک روی گیف ها و ویدئو ها رو هم بذارید .
    خیلی مهمه
    ممنون

    • سلام دوست عزیز. چشم اموزش درج واترمارک بر روی گیف و ویدئوها رو هم میزاریم. موفق باشید

  5. نازنین.م

    آموزش قراردادن لوگو روی ویدیو رو هم بگین ، منتظریما
    اگر میشه وقتی گذاشتید بمن ایمیل بدین 🙏🙏🙏
    مرسی

    • سلام دوست عزیز برای اینکه از اخبار اخرین پست ها و مطالب اموزشی سایت با خبر بشید باید توی خبرنامه ی سایت عضو باشید! کافیه که توی صفحه ی اول سایت به پایین صفحه برید و توی فرم خبرنامه ثبت نام کنید. 😀
      راجب افزودن لوگو به فیلم و ویدئو هم اموزش میزاریم , ممنون از پیشنهاد شما. موفق باشید.

  6. مصطفی

    سلام بنده همیشه از اموزش های خوبتون به بهترین نحو استفاده میکنم
    ببخشید یک سوالی داشتم تو نت گشتم حتی سایت های خارجی کلاسی برای واترمارک گیف وجود نداشت از این کلاس هم استفاده کردم ولی متاسفانه گیف چون فرم به فرم هست خراب میشه و وقتی عکس دوم روش میزارم گیف دیگه متحرک نیست! کلاسی چیزی معرفی میکنین؟

    • وقتی که یه گیف رو به تصویر دیگه ای اظافه میکنید در انتها باید تصویر رو به صورت gif ذخیره کنید تا متحرک باشه! همچنین میتونید از imagemagick استفاده کنید.

      • مصطفی

        خوب منم همین کارو کردم ولی باز مشکل داشت و متحرک نبود اگه میشه یک اموزش خوب واسه این کار بزارین ممنون میشم

  7. علی نوید

    با سلام و خسته نباشید ممنون از مطالب مفیدتون
    میخواستم بدونم آیا راهی برای اینکه واتر مارک تکرار بشه هم وجود داره ؟
    میخوام عکس اورجینال رو با واتر مارک با opacity پایین پوشش بدم ، خیلی سرچ کردم ولی همچین کلاسی پیدا نکردم ممنون میشم راهنماییم کنید.

    • سلام بعله چنین راهی وجود داره شما اول باید طول و عرض عکس رو بدست بیارید بعدش با استفاده یه عکس خالی ایجاد کنید و واترمارک خودتون رو با توجه به عرض و طول عکس اصلی روی این عکس تکرار کنید بعد عکس رو بچسبونید روی عکس اصلی. کار سختی نیست خیلی راحته.

می‌خواهید دیدگاهتان را بیان کنید؟