آپلود SVG در وردپرس: اهمیت و چگونگی فعال سازی

چرا آپلود SVG در وردپرس مهم است؟

SVG یک فرمت تصویری سبک و قابل تغییر است که برای نمایش تصاویر و طرح‌های گرافیکی ساده، مخصوصا تصاویر با رنگ‌های کم، کاربرد زیادی دارد. محبوبیت این فرمت در سال‌های اخیر بیشتر شده و حالا در پروژه‌های بازطراحی و راه‌اندازی مجدد سایت، زیاد از آن استفاده می‌شود. در سال ۲۰۲۰، فقط ۲۱.۲ درصد از سایت‌ها از SVG استفاده می‌کردند، اما این رقم در سال ۲۰۲۵ به ۶۱.۳ درصد رسید.

حالا سوال اینجاست که چه عاملی SVG را به یک فرمت تصویری مناسب برای توسعه‌دهندگان وب امروزی تبدیل کرده است؟ در ادامه این موضوع را بهتر بررسی می‌کنیم.

مزایای آپلود SVG در وردپرس

مهم‌ترین ویژگی فرمت SVG، بُرداری یا همان وکتور¹vector بودن تصاویر آن است. این فرمت برخلاف تصاویر پیکسلی یا رستری²raster، جای هر بخش از تصویر را با مختصات مشخص می‌کند. به همین دلیل، می‌توانید اندازه تصویر را بدون افت کیفیت به هر میزانی کوچک یا بزرگ کنید.

حفظ کیفیت تصویر در اندازه‌های مختلف و حجم کم فایل باعث شده SVG برای لوگوها، طرح‌های گرافیکی و آیکون‌ها انتخاب مناسبی باشد. این حجم کم و ساختار برداری انعطاف‌پذیر SVG چند مزیت مهم دارد:

• مقیاس‌پذیری نامحدود: تصاویر SVG در هر اندازه‌ای واضح و باکیفیت باقی می‌مانند، حتی روی نمایشگرهای رتینا³Retina.
• حجم فایل و سرعت بارگذاری: حجم SVG نسبت به فایل JPG و PNG همان تصویر بسیار کمتر است. در نتیجه، سرعت و عملکرد سایت بالا می‌رود و تجربه کاربر بهبود پیدا می‌کند.
• پایداری: حجم فایل کمتر و سرعت بارگذاری بالاتر، مصرف برق مراکز داده را پایین می‌آورد. در نتیجه، انتشار کربن هم کمتر می‌شود و شما سایت پایدارتری خواهید داشت.
• تبدیل آسان: ساخت و تبدیل فایل‌های SVG با برنامه‌های ویرایش تصویر رایج مثل ایلوستریتور⁴Illustrator و کنوا⁵Canva به‌راحتی امکان‌پذیر است.
• سازگاری: بعد از آپلود SVG در وردپرس، گوگل فایل‌های این فرمت را ایندکس می‌کند. این فایل‌ها با همه مرورگرهای مدرن سازگار هستند.
• انعطاف‌پذیری: امکان متحرک‌سازی SVG هم وجود دارد و همین ویژگی آن را به جایگزینی مناسب برای گیف⁶GIF تبدیل کرده است.

نکات مهم در استفاده از فرمت SVG

فرمت SVG برای مشخص کردن محل قرارگیری بخش‌های مختلف تصویر از بردار استفاده می‌کند، نه پیکسل. به همین دلیل، این فرمت برای ذخیره عکس‌هایی که با دوربین گرفته می‌شوند یا تصاویر سه‌بعدی پیچیده مناسب نیست.

البته نمی‌شود گفت که این نقطه ضعف فرمت SVG است. مثل این می‌ماند که بگوییم: «درجه سلسیوس برای اندازه‌گیری فاصله مناسب نیست!». در واقع هیچ فرمت فایلی وجود ندارد که برای همه کاربردها مناسب باشد و SVG هم در کاری که برای آن طراحی شده، عملکرد بسیار خوبی دارد.

علاوه بر این، SVG در حال حاضر از متن جایگزین⁷Alt Text پشتیبانی نمی‌کند و برای همین، استفاده از آن برای همه افراد راحت نیست. از طرف دیگر، استفاده نادرست از SVG هم گاهی مشکلات امنیتی ایجاد می‌کند. در ادامه، روش‌های امن آپلود SVG در وردپرس را توضیح می‌دهیم.

چرا وردپرس از SVG پشتیبانی نمی‌کند؟

فرمت SVG بر پایه XML ساخته شده؛ برای همین، فایل‌های SVG ممکن است کد فعال داشته باشند که در صورت استفاده نادرست، خطرات امنیتی ایجاد می‌کند. به همین دلیل، به‌صورت پیش‌فرض امکان بارگذاری SVG در وردپرس وجود ندارد تا امنیت کاربران حفظ شود.

چرا باید امکان آپلود SVG در وردپرس را فعال کرد؟

اکثر مواقع، توسعه‌دهندگان وب روی سایت‌هایشان کنترل کاملی دارند و از فایل‌های SVG منابع قابل اعتماد استفاده می‌کنند. در این شرایط، SVG حجم کمی دارد، بدون افت کیفیت در هر اندازه‌ای نمایش داده می‌شود و از نظر امنیتی هم مثل فرمت‌های JPG و PNG است. به همین دلیل، فعال کردن SVG در وردپرس برای اکثر توسعه‌دهندگان کار مفیدی است.

حتی سایت‌هایی که کاربران زیادی دارند و فایل‌های SVG را از منابع مختلف می‌گیرند هم می‌توانند با استفاده از برخی افزونه‌ها، با خیال راحت از SVG استفاده کنند. خیلی از افزونه‌های وردپرس که امکان استفاده از این فرمت را فعال می‌کنند، ابزار پاک‌سازی SVG هم دارند.

این ابزار موقع آپلود فایل، کدهای مخرب یا فعال را حذف و از سایت شما محافظت می‌کند. خلاصه اینکه SVG فرمت امنی است؛ به شرطی که از فایل‌های ساخته شده توسط خودتان، منابع قابل اعتماد یا افزونه‌های دارای ابزار پاک‌سازی SVG استفاده کنید.

نکته مهم درباره استفاده از SVG

مرورگرهای جدید از تصاویر SVG پشتیبانی می‌کنند، اما بعضی نسخه‌های اینترنت اکسپلورر در تغییر اندازه این تصاویر مشکل دارند. اگر هنوز کاربرانی با نسخه‌های ۹ تا ۱۱ مرورگر اینترنت اکسپلورر وارد سایتتان می‌شوند، برای تصویر SVG یک عرض یا ارتفاع مشخص در وردپرس تعیین کنید تا تصویر درست نمایش داده شود.

نحوه آپلود SVG در وردپرس

برای فعال‌سازی اس وی جی در وردپرس، دو روش اصلی وجود دارد: اضافه کردن کد یا نصب افزونه. این روش‌ها روی خود سایت اجرا می‌شوند و به قالب سایت ارتباطی ندارند.

روش اول: اضافه کردن کد به Functions.php

بارگذاری SVG در وردپرس کار ساده‌ای است. فقط کافی است کد کوتاه زیر را در فایل Functions.php سایت قرار بدهید.

/* Allow SVG Upload */

function smb_svg( $svg_mime ) {
    $svg_mime['svg'] = 'image/svg+xml';
    return $svg_mime;
}

add_filter( 'upload_mimes', 'smb_svg' );

معمولاً فایل Functions.php را در بخش Theme File Editor در داشبورد وردپرس خود پیدا می‌کنید. کد فوق را که در انتهای این فایل اضافه کردید، بر روی دکمه Update File کلیک کنید تا تغییرات شما ذخیره گردد.

بعد از اضافه کردن این کد، می‌توانید تصاویر SVG را در بخش رسانه وردپرس آپلود کنید و درست مثل هر فرمت تصویری دیگر، از آنها هم در سایت استفاده کنید.

روش دوم: افزونه‌های SVG

برای فعال کردن امکان آپلود SVG در وردپرس، می‌توانید یکی از افزونه‌های مخصوص این کار مثل WP SVG یا Safe SVG را نصب کنید. این افزونه‌ها امکان آپلود فایل‌های SVG را در بخش رسانه وردپرس فراهم می‌کنند و بعضی از آن‌ها قابلیت‌های دیگری مثل پاک‌سازی کد XML یا کنترل سطح دسترسی کاربران برای آپلود فایل را هم دارند.

ویژگی‌های افزونه:

• امکان آپلود فایل‌های SVG در کتابخانه رسانه سایت
• پاک‌سازی خودکار فایل‌های SVG آلوده شده و رد کردن فایل‌های مخرب SVG یا XML
• امکان تنظیم دسترسی آپلود SVG برای نقش‌های مختلف کاربری توسط مدیر سایت
• قابلیت غیرفعال کردن آپلود SVG برای نقش‌های خاص کاربری
• امکان آپلود و پاک‌سازی فایل‌های SVG توسط نقش‌های مختلف کاربری
• نمایش پیش‌نمایش فایل SVG در کتابخانه رسانه

کدام روش آپلود SVG در وردپرس بهتر است؟

هر روش مزایا و معایب خودش را دارد، اما پیشنهاد ما این است که برای فعال‌سازی SVG در وردپرس، از کد استفاده کنید و فایل‌های SVG را خودتان بسازید. اگر امکان انجام این کار را ندارید، از یک متخصص وردپرس کمک بگیرید (مثلاً با ایجاد پروژه‌های برون سپاری). این روش ساده، امن و کم دردسر است و نیازی هم به نصب افزونه غیرضروری روی سایت ندارد.

بعضی افزونه‌ها و مخصوصا صفحه‌سازها، امکانات و کدهای زیادی به سایت اضافه می‌کنند. این موضوع سرعت و پایداری سایت را کاهش می‌دهد و با به‌روزرسانی وردپرس یا PHP، احتمال ایجاد مشکل سازگاری را بیشتر می‌کند. بعضی قابلیت‌های اضافی این افزونه‌ها هم با افزونه‌های دیگر تداخل پیدا می‌کنند و خطاهای مختلفی به وجود می‌آورند. برای همین بهتر است تا حد امکان، تعداد افزونه‌های سایت را کم نگه دارید.

اما اگر لازم است که چند کاربر امکان آپلود فایل‌های SVG را داشته باشند یا خودتان امکان ساخت این فایل‌ها را ندارید، می‌توانید از افزونه‌هایی با قابلیت پاک‌سازی کد و تنظیم دسترسی آپلود استفاده کنید.

جمع‌بندی

فرمت SVG به خاطر حجم کم، کیفیت خوب و سرعت بالا برای استفاده در لوگوها، آیکون‌ها و طرح‌های گرافیکی سایت بسیار کاربردی است. وردپرس به‌صورت پیش‌فرض اجازه بارگذاری فایل‌های SVG را نمی‌دهد، اما با استفاده از کد یا افزونه می‌توانید این قابلیت را فعال کنید.

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

پاورقی:

• 1
  vector
• 2
  raster
• 3
  Retina
• 4
  Illustrator
• 5
  Canva
• 6
  GIF
• 7
  Alt Text