كيفية تحميل SVGs إلى WordPress: طريقتان

هل تريد معرفة كيفية تحميل SVGs إلى WordPress؟ سوف نقدم في هذا البرنامج التعليمي الطرق لتحقيق ذلك..

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

ستغطي هذه المقالة خطوات تحميل ملفات SVG إلى موقع WordPress على الويب باستخدام المكون الإضافي SVG Support. سنجيب أيضًا على بعض الأسئلة المتعلقة بقضايا الأمان المحيطة بتنسيق ملف الوسائط هذا ولماذا يستحق SVG استخدامه.

للبدء ، دعنا نتعرف على SVG وكيف يعمل.

ولكن قبل أن نبدأ ، إذا لم تقم بتثبيت WordPress مطلقًا ، فاكتشف ذلك كيفية تثبيت وورد بلوق الخطوات 7 et كيفية العثور عليها، وتثبيت وتفعيل موضوع ورد على بلوق 

ثم عد إلى سبب وجودنا هنا.

ما هو SVG؟

Scalable Vector Graphics (SVG) هو تنسيق صورة رسوميات متجهية تستند إلى نص XML. على الرغم من أن تنسيقات الصور الشائعة مثل JPG و PNG تتكون من أطنان من المربعات الصغيرة تسمى وحدات البكسل ، إلا أن هذا التنسيق يعتمد على لغة ترميز XML لوصف سمات الصورة.

في كانون الثاني / يناير شنومكس، 42٪ من جميع المواقع على مستوى العالم استخدم SVG. زادت هذه النسبة منذ يناير 2021 ، عندما فقط 29,4٪ من المواقع لقد استخدمته. على غرار تنسيقات PNG و JPG ، تحظى SVG بشعبية كبيرة بين مواقع الويب عالية الحركة مثل Google و Wikipedia و YouTube.

شيء رائع آخر حول SVG هو أنه مدعوم على نطاق واسع من قبل جميع المتصفحات الرئيسية.

هنا هي قائمة المتصفحات التي تدعم تنسيق ملف SVG:

ملاح	دعم جزئي	دعم كامل
بورد	-	الإصدار 12-18 ، 79-96 ، 97
ثعلب النار	نسخة 2	الإصدارات 3-94 ، 95 ، 96-97
Firefox لنظام Android	-	نسخة 95
الكروم	-	الإصدارات 4-96 ، 97 ، 98-100
Chromium لنظام Android	-	نسخة 96
سفاري	نسخة 3.1	الإصدار 3.2-15.1 ، 15.2 ، TP
دار الأوبرا	-	الإصدارات 10-81 ، 82
ميني أوبرا	-	جميع الإصدارات
أوبرا موبايل	-	الإصدار 12-12.1، 64
Safari على iOS	-	الإصدار 3.2-15.1، 15.2
متصفح أندرويد	الإصدار 3-4.3	الإصدار 4.4-4.4.4، 96
متصفح UC لنظام Android	-	نسخة 12.12
سامسونج انترنت	-	الإصدار 4-14.0، 15.0
متصفح QQ	-	نسخة 10.4
بايدو المتصفح	-	نسخة 7.12
متصفح KaiOS	-	نسخة 2.5

كيف يعمل SVG؟

تستخدم SVGs XML لإنتاج صور متجهة ثنائية الأبعاد. على عكس JPG و PNG ، لا تحتوي الرسومات المتجهة على وحدات بكسل. بدلاً من ذلك ، يتم وصف سلوكهم في ملفات نصية بتنسيق XML.

لهذا السبب ، يمكن البحث في SVGs وفهرستها وبرمجتها وتعديلها وضغطها مثل التعليمات البرمجية. نتيجة لذلك ، يمكن لأي شخص إنشاؤها باستخدام محرر نصوص أو برنامج رسومات متجه.

هل يدعم WordPress SVG؟

لا يوجد دعم SVG في WordPress افتراضيًا نظرًا للمخاطر الأمنية التي يفرضها - سنغطي مشكلات الأمان المحيطة بـ SVG بمزيد من العمق لاحقًا.

فيما يلي رسالة خطأ تظهر عند تحميل رسم SVG على موقع WordPress على الويب:

هناك المناقشة الحالية على جعل SVG جزءًا من وظائف WordPress الأساسية. حتى ذلك الحين ، علينا أن نكون مبدعين ونستخدم حلولًا أخرى لتحميل صور SVG على WordPress.

لماذا نستخدم WordPress SVG؟

على الرغم من مشكلات الأمان ، لا يزال العديد من المستخدمين يستخدمون تنسيق الصورة هذا نظرًا لأنه يتمتع بمزايا مختلفة. فيما يلي بعض فوائد استخدام ملفات SVG:

• قابلية التوسع: نظرًا لأن SVG هو تنسيق صورة متجه ، تحافظ ملفات SVG على نفس الجودة عبر جميع درجات دقة الشاشة. هذه الميزة موجودة أيضًا بعد تكبيرها ، وهذا هو سبب استخدام العديد من الأشخاص لتنسيق الصور القابل للتطوير للرموز والشعارات.
• حجم ملف أصغر : تجعل ملفات SVG من السهل تحسين أداء موقع الويب لأنها تشغل مساحة تخزين أقل على الويب ويتم تحميلها بشكل أسرع بكثير من الصور الأخرى.
• كبار المسئولين الاقتصاديين ودية : يقوم Google بفهرسة ملفات SVG، مما يسمح لها بالظهور في بحث الصور من Google وتحسين جهود البحث. كبار المسئولين الاقتصاديين. مع الأنواع الأخرى من الصور، يقتصر دورك على تحسين سماتها البديلة.
• SVGs المستندة إلى التعليمات البرمجية قابلة للتحرير باستخدام محرر نصوص أو برنامج تحرير رسومات متجه. يمكنك تحسين ملفات SVG لمواقع الويب أو حتى إضافة رسوم متحركة لجعل الرسومات تفاعلية.

SVG على WordPress والأمان

نظرًا لأن SVG هو في الأساس ملف نصي بتنسيق XML ، فإنه يحتوي على ثغرات أمنية قابلة للاستغلال لا تؤثر على تنسيقات الصور الأخرى. لذلك ، يمكن للأشخاص اختراقها بسهولة باستخدام تعليمات برمجية ضارة لإطلاق هجمات البرمجة النصية عبر المواقع (XSS) وهجمات الكيان الخارجي XML (XXE) على نظامك.

لهذا السبب ، يجب أن تكون حذرًا عند التعامل مع ملفات SVG وإضافتها إلى WordPress.

لتقليل مخاطر الأمان ، تأكد من تعقيم ملفات SVG قبل تحميلها إلى مكتبة وسائط WordPress. تعمل هذه العملية على إزالة التعليمات البرمجية والأخطاء المشبوهة ، مما يجعل الصور آمنة لموقعك على الويب.

يمكنك تنظيف ملفات SVG التي تم تحميلها باستخدام ملحق SVG - سنغطي خطواته لاحقًا. ومع ذلك ، نوصيك بتطهيره مرتين باستخدام اختبار المطهر SVG -

هناك طريقة أخرى لتأمين موقع WordPress الخاص بك وهي قصر تحميلات SVG على المستخدمين الموثوق بهم فقط. يجب أن يكون المستخدمون المحددون على دراية بقضايا الأمان المحيطة بتنسيق SVG - فهذا سيثنيهم عن الحصول على ملفات SVG من مصادر مشكوك فيها.

كيفية تحميل ملفات SVG على ووردبريس بطريقتين آمنتين

من الناحية الفنية ، هناك طريقتان لإضافة دعم SVG إلى WordPress: استخدام ملف وورد البرنامج المساعد أو بتنشيطه يدويًا. بغض النظر عن اختيارك ، نقترح بشدة أن تقتصر امتيازات التنزيل على المسؤولين والمستخدمين الموثوق بهم فقط لتقليل التنزيلات الضارة.

استخدم مكون WordPress الإضافي

في هذا البرنامج التعليمي ، سوف نستخدم دعم SVG. هذا وورد البرنامج المساعد يستخدم مكتبة SVG sanitizer التي سيتم تنشيطها تلقائيًا عند تحميل ملفات SVG إلى مكتبة الوسائط. من السهل أيضًا إعداده واستخدامه مجانًا.

فيما يلي خطوات تكوين دعم SVG:

1. Iقم بتثبيت البرنامج المساعد وتنشيطه.

2. الوصول إلى تعديلاة -> الدعم SVG من لوحة تحكم WordPress الخاصة بك.

3. حدد المربع بجوار الخيار قصر على المسؤولين للحد من امتيازات التحميل. افعل نفس الشيء بالنسبة للخيار تنشيط الوضع المتقدم إذا كنت ترغب في الوصول إلى الميزات المتقدمة ، مثل عرض SVG المضمن وتصميم CSS.

4. بعد حفظ التغييرات ، يمكنك البدء في تحميل ملفات SVG إلى مكتبة الوسائط بأمان.

أضف دعم WordPress SVG يدويًا

تتضمن هذه الطريقة تحرير الملف functions.php من موقع WordPress الخاص بك. لذلك ، نوصي بشدة باتباع هذه الخطوات إذا كنت معتادًا على PHP وتفهم تمامًا مشكلة أمان SVG.

تأكد من قم بعمل نسخة احتياطية من موقع WordPress الخاص بك قبل إجراء التغييرات لتجنب فقدان البيانات في حالة التهيئة الخاطئة.

ستوضح الخطوات التالية كيفية تمكين SVG في WordPress يدويًا بمساعدة عميل FTP مثل فايلزيلا.

1. انتقل إلى دليل ملفات موقع الويب الخاص بك في مضيفك
2. الوصول إلى بوبليك -> WP-يشمل. قم بالتمرير لأسفل حتى تقوم بذلك ابحث عن وظائف. php.

3. انقر بزر الماوس الأيمن فوق هذا الملف وحدد عرض / تحرير لفتحه ولصق مقتطف الشفرة التالي فيه:

function add_file_types_to_uploads($file_types){
$new_filetypes = array();
$new_filetypes['svg'] = 'image/svg+xml';
$file_types = array_merge($file_types, $new_filetypes );
return $file_types;
}
add_filter('upload_mimes', 'add_file_types_to_uploads');

4. احفظ التغييرات وحاول تحميل ملف SVG جديد. إذا نجحت العملية ، يجب أن تقبل مكتبة الوسائط تحميل الملف.

تساهم المزايا العديدة لملفات SVG في زيادة شعبية هذا النوع من الملفات. لسوء الحظ ، تكون ملفات XML النصية عرضة لإدخال التعليمات البرمجية ، وهذا هو السبب الرئيسي لعدم تضمين WordPress دعم SVG افتراضيًا.

ومع ذلك، هناك طريقتان لجعل موقع WordPress الخاص بك يقبل ملفات SVG: استخدام ملف وورد البرنامج المساعد أو تحرير الملف functions.php. بالإضافة إلى تقييد امتيازات التحميل ، ستتمكن من تحميل ملفات SVG بشكل آمن إلى مكتبة وسائط موقع الويب.

الموارد الأخرى الموصى بها

كما ندعوكم للتشاور مع RESSOURCES أدناه للحصول على مزيد من الملكية والتحكم في موقع الويب والمدونة الخاصة بك.

• كيفية إنشاء ملحق WordPress بسيط
• كيفية إنشاء إضافة بسيطة جوتنبرج بلوك وورد
• كيفية تعيين صفحتك الرئيسية في WordPress
• كيفية فهم لوحة تحكم WordPress
• كيفية إنشاء ملحق WordPress بسيط

وفي الختام

هذا كل شيء في هذا الدليل الذي يوضح لك كيفية تحميل SVGs إلى WordPress. نأمل أن يكون هذا المقال قد أعطاك نظرة ثاقبة حول فوائد ومخاطر تحميل ملفات SVG إلى موقع WordPress على الويب. إذا كانت لديك أية مخاوف أو اقتراحات ، فيرجى إخبارنا بها تعليقات.

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

في هذه الأثناء، شارك هذا المقال على الشبكات الاجتماعية المختلفة.   

...