آموزش قرار دادن SVG در وردپرس + فیلم آموزشی

با SVG  بیشتر آشنا شوید

SVG یا Scalable Vector Graphics یک فرمت فایل است که گرافیک بردار را با استفاده از زبان نشانه گذاری XML تعریف می کند. مزیت اصلی SVG این است که به شما امکان را می دهد تصاویر را بدون کاهش کیفیت بزرگ کنید.

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

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

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

این به شما این امکان را می دهد که گرافیک برداری را بدون از دست دادن کیفیت به تصویر بکشید. بیشترین تاثیرات، تصاویر SVG می تواند در اندازه فایل ها از JPEG یا PNG کوچکتر باشد.

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

مسائل امنیتی مربوط به SVG در وردپرس

فایل های SVG حاوی کد در زبان نشانه گذاری XML است که شبیه به HTML است. مرورگر شما یا نرم افزار ویرایش SVG XML زبان نشانه گذاری را برای نمایش خروجی روی صفحه نمایش می دهد.

با این حال، این وب سایت شما به آسیب پذیری های احتمالی XML باز می شود. این می تواند مورد استفاده قرار گیرد برای به دست آوردن دسترسی غیر مجاز به داده های کاربر، باعث حملات نیروهای شدید و یا حملات اسکریپت cross site.

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

آپلود فایل های SVG در وردپرس با استفاده افزونه

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

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

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

پس از فعال سازی، شما باید تنظیمات صفحه SVG Support را برای تنظیم پلاگین تنظیمات مشاهده کنید. در صفحه تنظیمات، باید کادر کنار «محدود به مدیران» را انتخاب کنید. این اجازه خواهد داد که فقط یک مدیر سایت برای آپلود فایل های SVG در وردپرس. گزینه بعدی این است که حالت پیشرفته را روشن کنید. شما فقط باید این گزینه را چک کنید اگر می خواهید از ویژگی های پیشرفته مانند انیمیشن های CSS و رندر درون خطی SVG استفاده کنید . فراموش نکنید که دکمه Save Change را کلیک کنید تا تنظیمات خود ذخیره شود.

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

ما امیدواریم که این مقاله به شما کمک کند تا یاد بگیرید چگونه با خیال راحت SVG را در وردپرس اضافه کنید.