 |
الملخص | يضيف تلقائيًا علامات مائية إلى الصور التي يرفعها المستخدمون |
 |
المستودع | GitHub - Arkshine/discourse-watermark-image · GitHub |
 |
دليل التثبيت | كيفية تثبيت سمة أو مكون سمة |
 |
جديد في سمات Discourse؟ | دليل المبتدئين لاستخدام سمات Discourse |
تثبيت مكون السمة هذا
الوصف
يضيف هذا المكون السمة علامات مائية تلقائيًا إلى الصور التي يرفعها المستخدمون. يمكنك استخدام صورة أو رمز استجابة سريعة (QR code) كعلامة مائية، مع خيارات تخصيص واسعة للموضع والمظهر وأنماط التوزيع.
يوفر المكون تحكمًا دقيقًا من خلال إعدادات الفئات ومجموعات المستخدمين، مما يسمح لك بتخصيص سلوك وضع العلامات المائية وفقًا لاحتياجات مجتمعك.
يرجى مراجعة قسم الملاحظات الهامة قبل التنفيذ.
الميزات
- معالجة عالية الأداء باستخدام WebAssembly و Web Workers
- دعم شامل لتنسيقات الصور (PNG, JPEG, BMP, ICO, TIFF, WEBP)
- توليد ديناميكي لرموز QR كعلامات مائية
- خيارات حجم مرنة (نسبية أو مطلقة)
- نظام تحديد مواقع متعدد الاستخدامات
- تخصيص متقدم للمظهر (الشفافية، الدوران، المقياس، الهوامش، إلخ)
- أوضاع دمج متعددة
- خيارات توزيع الأنماط (واحد، شبكة، قطري، عشوائي)
- إعدادات خاصة بالفئات ومجموعات المستخدمين
- معاينة مباشرة في لوحة الإعدادات
الإعدادات
| الإعداد | الوصف |
|---|---|
image |
الصورة المراد استخدامها كعلامة مائية. التنسيقات المدعومة: PNG, JPEG, BMP, ICO, TIFF, WEBP. الافتراضي: "" |
size_mode |
كيفية حساب حجم العلامة المائية: - relative: الحجم نسبي لعرض الصورة المستهدفة.- absolute: يتم تطبيقها بحجمها الأصلي.الافتراضي: "relative" |
relative_width |
عرض العلامة المائية نسبيًا لعرض الصورة المستهدفة (بالنسبة المئوية). ينطبق فقط عند تعيين وضع حجم العلامة المائية على relative.النطاق: 1-100 الافتراضي: 10 |
absolute_scale |
عامل المقياس لحجم العلامة المائية الأصلي (يُستخدم فقط في الوضع المطلق). الحد الأدنى: 0.01 الافتراضي: 1 |
max_size |
الحد الأقصى للحجم كنسبة مئوية لأبعاد الصورة. النطاق: 1-100 الافتراضي: 50 |
position |
موضع العلامة المائية: top-left, top-center, top-right, center-left, center, center-right, bottom-left, bottom-center, bottom-rightالافتراضي: "bottom-right" |
margin_x |
الهامش الأفقي من الحافة (كنسبة مئوية من الصورة المستهدفة) الافتراضي: 0 |
margin_y |
الهامش الرأسي من الحافة (كنسبة مئوية من الصورة المستهدفة) الافتراضي: 0 |
opacity |
شفافية العلامة المائية. النطاق: 1-100 الافتراضي: 100 |
rotate |
زاوية الدوران. النطاق: -360 إلى 360 درجة الافتراضي: 0 |
blend_mode |
كيفية دمج العلامة المائية مع الصورة: normal, overlay, over, atop, xor, plus, multiply, burn, difference, soft_light, screen, hard_light, dodge, exclusion, lighten, darken. الافتراضي: "normal" |
pattern |
نمط تكرار العلامة المائية: single, grid, diagonal, randomالافتراضي: "single" |
pattern_allow_partial |
السماح بعلامات مائية جزئية عند حواف الصورة الافتراضي: true |
pattern_max_count |
الحد الأقصى لعدد تكرارات العلامة المائية (0 لغير محدود) الافتراضي: 50 |
pattern_spacing |
المسافة بين العلامات المائية المتكررة (كنسبة مئوية من الصورة المستهدفة) الافتراضي: 15 |
qrcode_enabled |
تمكين العلامة المائية برمز QR الافتراضي: false |
qrcode_text |
النص المراد ترميزه في رمز QR. يدعم العلامات: {homepage}, {username}, {topic_url}الافتراضي: "" |
qrcode_color |
لون رمز QR (hex أو متغير CSS) الافتراضي: "var(--primary)" |
qrcode_background_color |
لون خلفية رمز QR (hex أو متغير CSS) الافتراضي: "var(--secondary)" |
qrcode_quiet_zone |
عرض الحد الأبيض حول رمز QR (0-10 وحدات) الافتراضي: 2 |
qrcode_error_correction |
مستوى تصحيح الأخطاء: Low (~7%), Medium (~15%), Quarter (~25%), High (~30%)يمكن العثور على مزيد من المعلومات حول مستويات تصحيح الأخطاء here. الافتراضي: "Medium" |
categories |
الفئات التي يجب تطبيق العلامة المائية عليها. الافتراضي: "" |
groups |
المجموعات التي يجب تطبيق العلامة المائية عليها. الافتراضي: "0" |
skip_small_images |
تخطي وضع العلامة المائية إذا كانت الصورة أقل من min_image_dimensions.الافتراضي: false |
min_image_dimensions |
الأبعاد الدنيا المطلوبة (العرض × الارتفاع) الافتراضي: "200x200" |
allow_non_supported_uploads |
السماح بمتابعة رفع الصور حتى لو لم يكن التنسيق مدعومًا الافتراضي: false |
أنواع العلامات المائية
صورة
يدعم المكون تنسيقات صور متعددة: PNG, JPEG, BMP, ICO, TIFF, و WEBP.
راجع قسم الأسئلة الشائعة للحصول على معلومات مهمة حول قيود دعم التنسيقات.
رمز QR
توليد رموز QR ديناميكية بمحتوى قابل للتخصيص باستخدام هذه المتغيرات:
{homepage}- عنوان URL للصفحة الرئيسية{username}- اسم المستخدم{topic_url}- عنوان URL للموضوع
مهم: عند تصميم علامات مائية برمز QR، ضع في اعتبارك التباين والحجم. قد تجعل نسب التباين الضعيفة أو التنسيق المفرط رموز QR غير قابلة للقراءة. قم دائمًا باختبار علاماتك المائية برمز QR باستخدام تطبيقات المسح.
معاينة فورية
تتضمن لوحة الإعدادات ميزة معاينة فورية، مما يسمح لك برؤية كيفية تأثير إعدادات العلامة المائية على صورة عينة فورًا.
توفر نافذة المعاينة عدة ميزات تفاعلية:
- نافذة معاينة قابلة للتعديل في الحجم وحركتها
- خيار تحميل صورة عينة عشوائية
- دعم لرفع صورك التجريبية الخاصة من جهازك
على سطح المكتب، تفتح تلقائيًا. يمكنك أيضًا فتحها من الزر الموجود في أسفل الصفحة:
ملاحظات هامة
-
لا يتم الاحتفاظ بالصور الأصلية
يتم تطبيق العلامات المائية قبل الرفع إلى الخادم، ولا يتم الاحتفاظ بالصور الأصلية. قم باختبار إعدادات علامتك المائية بدقة قبل النشر في بيئة الإنتاج. -
إذا كنت تختبر في لوحة الإدارة، فكن حذرًا من عدم التحقق من إعداداتك فورًا. أنصحك بإنشاء مجموعة أو فئة لتكون في مأمن من الأخطاء.
الأسئلة الشائعة
لماذا تقتصر تنسيقات الصور؟
بينما يحول Discourse جميع الملفات المرفوعة إلى JPEG، يحدث وضع العلامة المائية في هذا المكون السمة قبل الرفع على التنسيق الأصلي، باستخدام مكتبات معالجة صور محددة. بينما يمكن وضع العلامات المائية بعد الرفع، إلا أنه سيتطلب دورات متعددة من الرفع/التحميل وسيؤثر على تجربة المحرر. لا أزال أستكشف تحسينات لهذه العملية.
لماذا لا يتم دعم وضع العلامات المائية بالنص؟
سيستلزم وضع العلامات المائية بالنص خيارات إعداد واسعة (اختيار الخط، التنسيق، إلخ) يصعب تنفيذها بفعالية بدون واجهة مخصصة. توفر العلامات المائية بالصور مرونة أكبر ويمكن إنشاؤها باستخدام أدوات التصميم الحالية.
خارطة الطريق
قد تتضمن خطط التطوير المستقبلية:
الاعتمادات
يعتمد هذا المكون السمة على:
- Photon: مكتبة معالجة صور WebAssembly
- QR Code Generator: نسخة مُعدلة fork مع دعم WebAssembly.
مدخل الرفع مدعوم جزئيًا مع نوع إعدادات الكائن – لا يمكن القيام به في مكون سمة حاليًا. ↩︎
قد يتطلب تطوير إضافة. ↩︎
