تغيير حجم الصورة في نظام CMS

هدف البرنامج التعليمي

ستتعلم كيف يقوم نظام bluetronix CMS بتغيير حجم الصور المحلية من خلال IMG.pl أثناء عملية تصيير موقع CMS، وما هي المعلمات الستة التي يستخدمها الاستدعاء ولماذا يحصل المتصفح بعد ذلك على ملف الصورة المعالج فقط.

يمتلك نظام bluetronix CMS ما يلي:

IMG.pl

وظيفة مركزية للقيام بالتوسع التلقائي وتجهيز الصور.

يتم استخدام IMG.pl ضمن نظام إدارة المحتوى لقص أو تكبير الصور تلقائيًا إلى الحجم المطلوب أثناء عملية عرض موقع CMS.

مهم: IMG.pl هي وظيفة داخلية من نظام إدارة المحتوى bluetronix. لا يتم تسليم استدعاء IMG.pl كعنوان URL نهائي للصورة للزائر.

المبدأ الأساسي

يمكن استخدام استدعاء IMG.pl الداخلي أولاً ضمن كود HTML.

مثال:

<img src="/CMS/cgi-bin/IMG.pl?/img/image.jpg=700=500=1=100=1">

يتم معالجة هذا الاستدعاء خلال عملية عرض موقع CMS.

ينشئ نظام إدارة المحتوى ملف صورة مقاسه بشكل مناسب مرة واحدة فقط.

بعد ذلك، يتم استبدال استدعاء IMG.pl الأصلي باسم الملف الخاص بصورة الناتج.

الكود قبل التصيير

<img src="/CMS/cgi-bin/IMG.pl?/img/image.jpg=700=500=1=100=1">

الكود بعد التصيير

بعد المعالجة، يمكن أن يبدو كود HTML كما يلي:

<img src="/tmp/img_image_700_500_1_100_1_1070.jpg">

لذا، لا يحصل المتصفح على استدعاء IMG.pl الأصلي، بل الصورة التي تم إنشاؤها بالفعل مباشرة.

سير العملية في عملية تصيير موقع CMS

HTML enthält IMG.pl-Aufruf
      ↓
CMS-Site-Rendering-Prozess
      ↓
IMG.pl wird intern verarbeitet
      ↓
Bild wird skaliert / zugeschnitten
      ↓
neue Bilddatei wird erzeugt
      ↓
IMG.pl-Aufruf wird ersetzt
      ↓
fertiger Bild-Dateiname wird in das HTML eingesetzt
      ↓
fertige HTML-Seite wird ausgeliefert

وبالتالي، لا يتعين إجراء تكييف الصورة في كل مرة يتم فيها فتح المتصفح.

يتم استخدام IMG.pl داخليًا فقط

مهم: IMG.pl مخصصة للاستخدام الداخلي فقط ضمن نظام إدارة المحتوى bluetronix.

لا ينبغي استخدام IMG.pl كواجهة صورة خارجية أو استدعاؤها مباشرة من مواقع ويب خارجية.

تتم المعالجة داخليًا خلال عملية العرض.

يتم تسليم ملف الصورة الذي تم إنشاؤه فقط إلى الخارج.

يجب أن تكون الصور موجودة على مساحة الويب

مهم: يجب أن تكون جميع الصور التي تتم معالجتها عبر IMG.pl موجودة مباشرة على مساحة الويب لتثبيت bluetronix المحدد.

لا يمكن استخدام عناوين URL للصور الخارجية كملفات مصدر.

ما هو مسموح به هو على سبيل المثال:

/img/image.jpg

ما هو غير مسموح به هو على سبيل المثال:

https://external-domain.com/image.jpg

يجب أن تكون ملف المصدر متاحة محليًا ضمن مساحة الويب.

هيكل استدعاء IMG.pl

استدعاء نموذجي هو:

<img src="/CMS/cgi-bin/IMG.pl?/img/image.jpg=700=500=1=100=1">

تتم إضافة المعلمات مباشرة واحدة تلو الأخرى باستخدام:

=

فصل.

لا تُستخدم أسماء المعلمات.

التسلسل فقط هو المهم فيما يتعلق بالمعلمات.

نظرة عامة على المعلمات

المعلمة 1 – اسم الملف

المعلمة الأولى تحتوي على مسار ملف المصدر.

مثال:

/img/image.jpg

داخلياً، هذه المعلمة تعني:

my $f = $help[0];

إذا كان ملف المصدر المحدد غير موجود، سيتم إيقاف المعالجة.

ملاحظة: بدون ملف مصدر محلي صالح، لا يمكن لـ IMG.pl إنشاء صورة.

المعلمة 2 – العرض

المعلمة الثانية تحدد عرض الصورة المطلوب بالبكسل.

مثال:

700

داخلياً:

my $w = $help[1];

المعلمة 3 – الارتفاع

المعلمة الثالثة تحدد ارتفاع الصورة المطلوب بالبكسل.

مثال:

500

داخلياً:

my $h = $help[2];

المعلمة 4 – النسبة المئوية

المعلمة الرابعة تتحكم في التعديل النسبي للتكبير أو القص للصورة.

مثال:

1

داخلياً:

my $p = $help[3];

بهذا يمكن التحكم في كيفية معالجة نسبة العرض إلى الارتفاع الأصلية للصورة أثناء التكبير أو القص.

المعلمة 5 – الجودة

المعلمة الخامسة تحدد جودة ملف الصورة الناتج في الصور النقطية العادية.

مثال:

100

داخلياً:

my $q = $help[4];

عادةً ما يتم تعيين هذه القيمة على:

100

محدد.

المعلمة 6 – التكبير

المعلمة السادسة تتحكم في ما إذا كان يمكن تكبير الصورة إذا كان حجم الإخراج المطلوب أكبر من الصورة الأصلية.

داخلياً:

my $z = $help[5];

مع:

1

سيتم تكبير الصورة عند الحاجة.

مثال:

...=700=500=1=100=1

بدون تفعيل التكبير، لن يتم تضخيم صورة صغيرة بشكل مناسب. بدلاً من ذلك، ستتم ملء المنطقة المتبقية بحافة بيضاء أو خلفية.

مثال مع جميع المعلمات الستة

/CMS/cgi-bin/IMG.pl?/img/image.jpg=700=500=1=100=1

القيم تعني:

1. /img/image.jpg
   → Quelldatei

2. 700
   → Breite: 700 Pixel

3. 500
   → Höhe: 500 Pixel

4. 1
   → proportionale Verarbeitung / Zuschnitt

5. 100
   → Bildqualität

6. 1
   → Zoom aktiviert

أنواع الملفات المسموح بها

تدعم IMG.pl الصيغ التالية للصور:

gif
jpg
jpe
jpeg
png
svg

ميزة خاصة لملفات SVG

بالنسبة لملفات SVG، يكون للوسيط الخامس معنى خاص.

بالنسبة للصيغ العادية مثل JPG أو PNG، يكون:

my $q = $help[4];

جودة الصورة.

في ملفات SVG، يُستخدم هذا الوسيط كلون بدلاً من ذلك.

ملاحظة: $help[4] هو تقنيًا الوسيط الخامس المرسل، حيث يبدأ المصفوفة الداخلية من الفهرس 0.

لذا، يكون:

JPG / PNG / GIF
Parameter 5
→ Qualität


SVG
Parameter 5
→ Farbe

يمكن من خلال معالجة ملف SVG تعيين لون مرغوب أو استبداله.

تعيين المعلمات الداخلية

تتم معالجة القيم الستة المرسلة داخليًا كما يلي:

my $f = $help[0];  # Dateiname
my $w = $help[1];  # Breite
my $h = $help[2];  # Höhe
my $p = $help[3];  # Proportionalität
my $q = $help[4];  # Qualität / bei SVG: Farbe
my $z = $help[5];  # Zoom

لماذا يتم استبدال IMG.pl أثناء التصيير؟

استدعاء IMG.pl الداخلي ليس مصممًا كعنوان URL ثابت للصورة العامة.

بل يُستخدم كتعليمات لـ CMS:

Nimm dieses Bild
+
erzeuge diese Größe
+
verwende diese Skalierung
+
verwende diese Qualität
+
berücksichtige die Zoom-Einstellung

سيتم حفظ النتيجة كملف صورة عادي.

من:

<img src="/CMS/cgi-bin/IMG.pl?/img/image.jpg=700=500=1=100=1">

سيصبح على سبيل المثال:

<img src="/tmp/img_image_700_500_1_100_1_1070.jpg">

يتلقى المتصفح فقط الملف النهائي.

مزايا تغيير حجم الصور في CMS

يوفر التحجيم المركزي للصور عدة مزايا:

• einheitliche Bildgrößen
• automatischer Bildzuschnitt
• keine manuelle Erstellung jeder einzelnen Bildgröße erforderlich
• fertige Bilddateien können direkt ausgeliefert werden
• IMG.pl muss nicht als öffentliche Bildschnittstelle verwendet werden
• die Bildverarbeitung wird zentral vom CMS gesteuert

ملخص

IMG.pl هو وظيفة التحجيم المركزي للصور الداخلية في نظام إدارة المحتوى بلوترونيكس.

استدعاء نموذجي هو:

<img src="/CMS/cgi-bin/IMG.pl?/img/image.jpg=700=500=1=100=1">

المعلمات الست هي:

1. Dateiname
2. Breite
3. Höhe
4. Proportionalität
5. Qualität / bei SVG Farbe
6. Zoom

من المهم:

Quelldateien müssen lokal auf dem Webspace liegen.

IMG.pl ist nur für die interne CMS-Verarbeitung vorgesehen.

IMG.pl-Aufrufe werden während des Rendering-Prozesses verarbeitet.

Nach außen wird die fertig erzeugte Bilddatei ausgeliefert.

الإجراءات الأساسية هي:

lokales Originalbild
      ↓
IMG.pl
      ↓
Skalierung / Zuschnitt
      ↓
fertige Bilddatei erzeugen
      ↓
IMG.pl-Aufruf im HTML ersetzen
      ↓
fertige Bild-URL an den Browser ausliefern