وضع علامة مائية على جميع الصور التي تم رفعها

أيها المطورون الأعزاء في Discourse،

أود أن أشكر جميع مطوري Discourse على عملهم المتميز في إنشاء أفضل منتدى في العالم. :smiling_face_with_three_hearts: شخصيًا، استخدمت برامج أخرى مثل Discuz و Buddyboss (Wordpress) لبناء عدة منتديات خلال العشر سنوات الماضية، ولا شيء منها يضاهي عظمة Discourse.

الخاصية الوحيدة التي أفتقدها في Discourse هي ميزة علامة المياه (Watermark). سيكون مثاليًا لو دعم Discourse وضع علامة مياه على جميع الصور المرفوعة. لا يجب أن تكون معقدة للغاية، كما اقترح بعض المستخدمين في هذا المنتدى. (أفهم سبب تجاهل المطورين لطلبهم، لأن ذلك غير عملي تمامًا.)


برأيي، ستكون قدرة بسيطة جدًا على إضافة علامة مياه كافية. يكفي إضافة أيقونة أو نص على كل صورة مرفوعة، فقط ليُعلم الآخرون أن الصورة أصلها من منتداي عندما يقوم شخص ما بمشاركة (أو سرقة) صورك على موقع أو منصة أخرى.

شخصيًا، أقوم دائمًا بإضافة علامة المياه بنفسي قبل رفع الصور إلى المنتدى، لكن العديد من أعضاء المجتمع لا يرغبون في فعل ذلك بأنفسهم، خاصةً عند نشر الصور باستخدام الهواتف الذكية؛ فهم يفضلون أن يقوم المنتدى بإضافتها تلقائيًا.

أدرك أن Discourse صُمم في الأصل ليكون منتدى يعتمد على النصوص أكثر من كونه منتدى يحتوي على الكثير من الصور، مثل منتديات التصوير الفوتوغرافي. لكن بفضل العديد من الإضافات الممتازة و TC المتاحة، يمكنني إنشاء منتدى موجه للصور باستخدام Discourse بشكل ممتاز.


أوصي بإضافة مربع لرفع صورة علامة المياه في:
/admin/site_settings/category/branding

وإضافة زر اختيار في:
/admin/site_settings/category/files
2020-12-30_042258

وقائمة منسدلة لاختيار موضع علامة المياه، مشابهة لما يلي:

عندها ستكون كافية. لا حاجة لميزات أخرى فاخرة.
ميزات أخرى مثل التحجيم، الشفافية، احتفاظ بنسخة احتياطية من الصورة الأصلية، إلخ. جميعها رائعة ولكنها ليست ضرورية.

أخيرًا، أود أن أشكر جميع مطوري Discourse على عملهم الدؤوب المستمر.
شكرًا لكم، وكل عام وأنتم بخير! ~!:kissing_heart:

7 إعجابات

شكرًا لك يا جكي، يبدو أن هذه إضافة مثيرة للاهتمام لشخص ما للتجربة. لا أعتقد أننا سنجعل هذه الميزة أساسية، لكن الأساس يمكنه بالتأكيد المساعدة في تسهيل الإضافة.

إذا كان لديك ميزانية، فأنا أوصي بالنشر في Marketplace. أظن أن بناء نموذج أولي بسيط للإضافة (مع إعدادات دنيا - توفير النص فقط) قد يستغرق من يوم إلى يومين.

قد يستغرق وضع علامة مائية عن طريق دمج الصور وقتًا أطول قليلاً لضمان دقتها.

12 إعجابًا

بعد بعض التجارب، وجدت حلاً مؤقتاً للعلامة المائية. :tada:

في حال قد يهتم به آخرون، أود مشاركة حلي البديلة. آمل أن يكون مفيداً. :heart_eyes:

  1. أولاً، قمت بتثبيت Chevereto (النسخة المجانية) على نطاق فرعي آخر.
    (من السهل جداً، فقط قم برفع ملف installer.php إلى الخادم، افتح الصفحة واتبع خطوات الإعداد. يتم ذلك في دقائق) :kiss_mark:

  2. النسخة المجانية تدعم أيضاً العلامة المائية، ويمكنك إعدادها من خلال لوحة التحكم في إعدادات رفع الصور.

يمكنك أيضاً تحديد أقصى عرض وارتفاع للصورة من لوحة التحكم، بحيث يتم تغيير حجم جميع الصور الكبيرة المرفوعة تلقائياً.

  1. أضف إضافة Chevereto (سكربت) إلى وسم <head> في Discourse
    <script async src="https://img.example.com/sdk/pup.js" data-url="https://img.example.com/upload"></script>

  2. يبدو أن Discourse لا يدعم وسم i مع أيقونات Font Awesome بعد الآن، لذا كان علي تعديل كود الجافا سكريبت من
    <i class="fa fa-cloud-upload d-icon d-icon-upload"></i>
    إلى
    <svg class="fa d-icon d-icon-cloud-upload-alt svg-icon svg-node" aria-hidden="true"><use xlink:href="#cloud-upload-alt"></use></svg>

  3. إذا تم كل شيء بشكل صحيح، ستظهر أيقونة تحميل السحابة في محرر Discourse.

  4. ما عليك سوى النقر على الأيقونة الجديدة، وسحب وإفلات الصورة في النافذة المنبثقة، وسيتم رفعها تلقائياً ولصق الكود في المحرر مع العلامة المائية. :tada:

  5. الآن يعمل كل شيء بشكل مثالي على سطح المكتب. لكنني ما زلت أحاول معرفة كيفية إضافة الأيقونة إلى الهواتف الذكية. :thinking: سأقوم بتحديث هذا المنشور إذا وجدت طريقة للقيام بذلك.

هذا مجرد حل مؤقت، بديل، وليس مثالياً على الإطلاق، لكنه يمكن تنفيذه بسهولة في دقائق. لا يزال لدي أمل في أن تضيف Discourse دعم العلامة المائية في النواة الأساسية أو عبر إضافة / TC في المستقبل.

9 إعجابات

يبدو هذا جيدًا. سيكون رائعًا وجود مكون سمة يشمل كل هذا، مع بقاء تثبيت Chevereto كخطوة يدوية فقط.

4 إعجابات

لقد قمت بتعديل بسيط في جافا سكريبت لإضافة Chevereto.

بتغيير
sibling: ".upload.btn", siblingPos:"before",
إلى
sibling:".code.btn",siblingPos:"after",

الآن، تظهر الأيقونة على كل من سطح المكتب والهاتف الذكي. :partying_face:

إعجابَين (2)

أحبه! هل لديه إضافة لتحقيق نفس الهدف؟

سيكون أفضل لو كان هناك مكون لهذه العلامة المائية.

إعجابَين (2)

هل يمكن لأحد أن يخبرني في أي مجلد يتم حفظ الصور؟

إحدى الطرق التي أود بها وضع علامة مائية عليها بشكل جماعي هي عن طريق تشغيل أداة تحرير صور خارجية.

هل تمكن أي شخص من تحقيق ذلك باستخدام أحدث إصدار 3.2 من ديسكورس؟

هذا رائع جداً. قد تكون مهتماً أيضاً بهذا Theme component

إعجابَين (2)

لقد جربت ذلك في مكون سمة. إنه مجرد إثبات للمفهوم، لذا فهو أساسي. :smile:
لكل تحميل، يتم تطبيق علامة مائية تلقائيًا.

من الناحية الفنية، مثل كيفية معالجة Discourse للصور قبل التحميل (مثل الضغط)، تقوم هذه الأداة بنفس الشيء مع العلامات المائية. بفضل واجهة برمجة التطبيقات ومكتبة Uppy، يمكن تحقيق العلامات المائية بسهولة. :pray:

أخبرني إذا كانت لديك ميزات/تخصيصات في الاعتبار تعتبرها كحد أدنى. :slight_smile:

تحرير: سأنشر إصدارًا بمجرد تطبيق الإعدادات الأساسية.

14 إعجابًا

:heart: :heart: :heart:
عمل ملحمي! أخبرني إذا كنت بحاجة إلى أي مختبرين

إعجابَين (2)

مرحباً، هل هذا جاهز للإنتاج؟ أنا مهتم جداً

إعجاب واحد (1)

في أي موقف يكون طباعة العلامة المائية على جميع الصور مناسبًا وقانونيًا؟

إعجاب واحد (1)

هل هذا جاهز للإنتاج؟

عذرًا، لقد تأخرت قليلاً في هذا. :sweat_smile:
إذا كنت لا تزال مهتمًا، فقد أصدرت TC هنا: Watermark Image. نرحب بأي ملاحظات!

7 إعجابات