آیا می خواهید یاد بگیرید که چگونه SVG ها را در وردپرس آپلود کنید؟ در این آموزش روش های دستیابی به این امر را ارائه خواهیم کرد..

مدیران وب و طراحان وب موظفند از فرمت های مختلف فایل های رسانه ای در کار خود استفاده کنند. یکی از محبوب ترین فرمت های امروزی SVG است که یک فرمت برداری مبتنی بر XML است. متأسفانه، همه مرورگرها و پلتفرم ها از SVG پشتیبانی نمی کنند، بنابراین ابتدا باید پشتیبانی SVG را به صورت دستی فعال کنید.

این مقاله مراحل آپلود فایل های SVG را در وب سایت وردپرس با استفاده از افزونه SVG Support پوشش می دهد. ما همچنین به چند سوال در مورد مسائل امنیتی پیرامون این فرمت فایل رسانه ای خاص و اینکه چرا SVG ارزش استفاده دارد، پاسخ خواهیم داد.

برای شروع، بیایید با SVG و نحوه عملکرد آن آشنا شویم.

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

سپس به این دلیل که چرا ما اینجا هستیم

SVG چیست؟

Scalable Vector Graphics (SVG) یک فرمت تصویر برداری گرافیکی مبتنی بر متن XML است. اگرچه فرمت های رایج تصویر مانند JPG و PNG از هزاران مربع کوچک به نام پیکسل تشکیل شده اند، این فرمت برای توصیف ویژگی های تصویر به زبان نشانه گذاری XML متکی است.

در ماه ژانویه 2022 42 درصد از کل وب سایت ها در سراسر جهان از SVG استفاده کنید این درصد از ژانویه 2021، زمانی که فقط افزایش یافته است 29,4 درصد از وب سایت ها از آن استفاده کرده اند. مشابه فرمت‌های PNG و JPG، SVG در بین وب‌سایت‌های پر بازدید مانند گوگل، ویکی‌پدیا و یوتیوب محبوب است.

یکی دیگر از چیزهای خوب در مورد SVG این است که به طور گسترده توسط همه مرورگرهای اصلی پشتیبانی می شود.

در اینجا است که لیست مرورگرها که از فرمت فایل SVG پشتیبانی می کنند:

هدایتگرپشتیبانی جزئیحمایت کامل
بند-نسخه 12-18، 79-96، 97
فایرفاکسنسخه 2نسخه های 3-94، 95، 96-97
فایرفاکس برای آندروید-نسخه 95
کروم-نسخه های 4-96، 97، 98-100
Chrome برای Android-نسخه 96
سیاحت اکتشافی در افریقانسخه 3.1نسخه 3.2-15.1، 15.2، TP
اپرا-نسخه های 10-81، 82
مینی اپرا-همه نسخه ها
اپرا موبایل-انتشار 12-12.1، 64
سافاری در iOS-انتشار 3.2-15.1، 15.2
مرورگر آندرویدنسخه 3-4.3انتشار 4.4-4.4.4، 96
مرورگر UC برای اندروید-نسخه 12.12
اینترنت سامسونگ-انتشار 4-14.0، 15.0
مرورگر QQ-نسخه 10.4
مرورگر Baidu-نسخه 7.12
مرورگر KaiOS-نسخه 2.5

SVG چگونه کار می کند؟

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

به همین دلیل، SVG ها را می توان مانند کد جستجو، فهرست بندی، اسکریپت، اصلاح و فشرده کرد. در نتیجه، هر کسی می تواند آنها را با استفاده از یک ویرایشگر متن یا نرم افزار گرافیک برداری ایجاد کند.

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

به دلیل خطرات امنیتی که ایجاد می کند، به طور پیش فرض در وردپرس پشتیبانی SVG وجود ندارد – ما بعداً مسائل امنیتی پیرامون SVG را با عمق بیشتری پوشش خواهیم داد.

در اینجا یک پیام خطایی است که هنگام آپلود یک گرافیک SVG در یک وب سایت وردپرس ظاهر می شود:

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

چرا از وردپرس SVG استفاده کنیم؟

با وجود مشکلات امنیتی آن، بسیاری از کاربران همچنان از این فرمت تصویر استفاده می کنند زیرا دارای مزایای مختلفی است. در اینجا برخی از مزایای استفاده از فایل های SVG آورده شده است:

  • مقیاس پذیری: از آنجایی که SVG یک فرمت تصویر برداری است، فایل های SVG کیفیت یکسانی را در تمام وضوح های صفحه حفظ می کنند. این مزیت پس از بزرگتر کردن آنها نیز وجود دارد، به همین دلیل است که بسیاری از افراد از این فرمت تصویر مقیاس پذیر برای آیکون ها و لوگوها استفاده می کنند.
  • اندازه فایل کوچکتر : فایل‌های SVG بهبود عملکرد وب‌سایت را آسان می‌کنند زیرا فضای ذخیره‌سازی وب کمتری را اشغال می‌کنند و بسیار سریع‌تر از تصاویر دیگر بارگذاری می‌شوند.
  • SEO دوستانه : Google فایل‌های SVG را فهرست‌بندی می‌کند و به آن‌ها اجازه می‌دهد در جستجوی تصویر Google ظاهر شوند و تلاش‌های جستجوی شما را بهبود می‌بخشد. SEO. با انواع دیگر تصاویر، شما محدود به بهینه سازی ویژگی های alt آنها هستید.
  • SVG های مبتنی بر کد با استفاده از ویرایشگر متن یا نرم افزار ویرایش گرافیک برداری قابل ویرایش هستند. می‌توانید فایل‌های SVG را برای وب‌سایت‌ها بهینه کنید یا حتی انیمیشن‌هایی اضافه کنید تا گرافیک‌ها تعاملی باشند.

SVG در وردپرس و امنیت

از آنجایی که SVG اساساً یک فایل متنی XML است، دارای آسیب‌پذیری‌های قابل بهره‌برداری است که بر سایر فرمت‌های تصویر تأثیر نمی‌گذارد. بنابراین، افراد می توانند به راحتی آن را با کدهای مخرب ربوده و حملات Cross-Site Scripting (XSS) و XML External Entity (XXE) را به سیستم شما راه اندازی کنند.

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

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

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

راه دیگر برای ایمن سازی وب سایت وردپرس خود محدود کردن آپلود SVG فقط به کاربران قابل اعتماد است. کاربران منتخب باید از مسائل امنیتی پیرامون فرمت SVG آگاه باشند - این امر آنها را از دریافت فایل های SVG از منابع مشکوک منصرف می کند.

نحوه آپلود فایل های SVG در وردپرس به دو روش امن

از نظر فنی، دو راه برای افزودن پشتیبانی SVG به وردپرس وجود دارد: استفاده از a پلاگین وردپرس یا با فعال کردن دستی. هر کدام را که انتخاب کنید، ما قویاً پیشنهاد می کنیم که امتیازات دانلود را فقط به مدیران و کاربران قابل اعتماد محدود کنید تا بارگیری های مخرب را به حداقل برسانید.

از افزونه وردپرس استفاده کنید

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

در اینجا مراحل پیکربندی پشتیبانی SVG آمده است:

  1. Iافزونه را نصب کنید و آن را فعال کنید.
SVG ها را در وردپرس آپلود کنید
  1. دسترسی به تنظیمات -> پشتیبانی SVG از داشبورد وردپرس شما
  1. کادر کنار گزینه را علامت بزنید محدود به مدیران برای محدود کردن امتیازات آپلود همین کار را برای گزینه انجام دهید حالت پیشرفته را فعال کنید اگر می خواهید به ویژگی های پیشرفته مانند رندر SVG درون خطی و استایل CSS دسترسی داشته باشید.
SVG ها را در وردپرس آپلود کنید
  1. پس از ذخیره تغییرات، می توانید با خیال راحت فایل های SVG را در کتابخانه رسانه آپلود کنید.

به صورت دستی پشتیبانی SVG وردپرس را اضافه کنید

این روش شامل ویرایش فایل است functions.php از وب سایت وردپرسی شما بنابراین، اگر با PHP آشنایی دارید و مشکل امنیتی SVG را کاملاً درک می کنید، اکیداً توصیه می کنیم که این مراحل را دنبال کنید.

مطمئن شوید که شما از وب سایت وردپرس خود نسخه پشتیبان تهیه کنید قبل از ایجاد تغییرات برای جلوگیری از از دست رفتن داده ها در صورت پیکربندی اشتباه.

مراحل زیر نحوه فعال کردن SVG در وردپرس را به صورت دستی با کمک یک کلاینت FTP توضیح می دهد فایلزیلا.

  1. به فهرست فایل های وب سایت خود در میزبان خود بروید
  2. دسترسی به public_html هاست -> WP-شامل. به پایین اسکرول کنید تا زمانی که برسید Find functions.php.
SVG ها را در وردپرس آپلود کنید
  1. روی این فایل کلیک راست کرده و View/Edit را انتخاب کنید تا باز شود و کد زیر را در آن قرار دهید:
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');
  1. تغییرات را ذخیره کنید و یک فایل SVG جدید آپلود کنید. اگر فرآیند موفقیت آمیز باشد، کتابخانه رسانه شما باید آپلود فایل را بپذیرد.

مزایای فراوان فایل های SVG به محبوبیت روزافزون این نوع فایل کمک می کند. متأسفانه، فایل های متنی XML مستعد تزریق کد هستند، که دلیل اصلی عدم پشتیبانی وردپرس به صورت پیش فرض از SVG است.

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

سایر منابع پیشنهادی

همچنین شما را به مشاوره ressources برای اینکه مالکیت و کنترل بیشتری بر وب سایت و وبلاگ خود داشته باشید.

نتیجه

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

با این حال، شما همچنین می توانید با ما مشورت کنید ressourcesاگر برای اجرای پروژه های ایجاد سایت های اینترنتی به عناصر بیشتری احتیاج دارید ، با مشورت راهنمای ما در مورد ایجاد وبلاگ وردپرس یا یکی در Divi: بهترین تم وردپرس در همه زمان ها.

انگلیسی همراه، این مقاله را در شبکه های اجتماعی مختلف خود به اشتراک بگذارید.   

...