Dëshironi të mësoni se si të ngarkoni SVG në WordPress? Ne do të paraqesim në këtë tutorial metodat për ta arritur këtë..

Administratorët e uebit dhe dizajnerët e uebit janë të detyruar të përdorin formate të ndryshme skedarësh mediash në punën e tyre. Një nga formatet më të njohura sot është SVG, një format vektorial i bazuar në XML. Fatkeqësisht, jo të gjithë shfletuesit dhe platformat mbështesin SVG, kështu që së pari duhet të aktivizoni mbështetjen e SVG-së me dorë.

Ky artikull do të mbulojë hapat për ngarkimin e skedarëve SVG në një faqe interneti të WordPress duke përdorur shtojcën e Mbështetjes SVG. Ne do t'u përgjigjemi gjithashtu disa pyetjeve në lidhje me çështjet e sigurisë që lidhen me këtë format të veçantë të skedarit të medias dhe pse ia vlen të përdoret SVG.

Për të filluar, le të njihemi me SVG dhe si funksionon.

Por, para se të fillojmë, nëse nuk e keni instaluar kurrë WordPress, zbuloni Si të instaloj një WordPress blog hapa 7 et Si të kërkoni, instaloni dhe aktivizoni një temë WordPress në blogun tuaj 

Atëherë kthehu pse ne jemi këtu.

Çfarë është SVG?

Grafika vektoriale e shkallëzuar (SVG) është një format imazhi grafike vektoriale të bazuar në tekst XML. Megjithëse formatet e zakonshme të imazhit si JPG dhe PNG përbëhen nga mijëra katrorë të vegjël të quajtur piksel, ky format mbështetet në gjuhën e shënjimit XML për të përshkruar atributet e imazhit.

Në janar 2022, 42% e të gjitha faqeve të internetit në mbarë botën përdorni SVG. Kjo përqindje është rritur që nga janari 2021, kur vetëm 29,4% e faqeve të internetit e kanë përdorur. Ngjashëm me formatet PNG dhe JPG, SVG është i popullarizuar në mesin e faqeve të internetit me trafik të lartë si Google, Wikipedia dhe YouTube.

Një tjetër gjë e mrekullueshme në lidhje me SVG është se ai mbështetet gjerësisht nga të gjithë shfletuesit kryesorë.

Këtu është lista e shfletuesve që mbështesin formatin e skedarit SVG:

lundërtarMbështetje e pjesshmeMbështetje e plotë
dërrasë-Versioni 12-18, 79-96, 97
FirefoxVersion 2Versionet 3-94, 95, 96-97
Firefox për Android-Version 95
krom-Versionet 4-96, 97, 98-100
Chrome për Android-Version 96
ekspeditë gjuetineVersion 3.1Versioni 3.2-15.1, 15.2, TP
Opera-Versionet 10-81, 82
Mini Opera-Të gjitha versionet
Opera Mobile-Publikimi 12-12.1, 64
Safari në iOS-Publikimi 3.2-15.1, 15.2
Shfletuesi AndroidVersioni 3-4.3Publikimi 4.4-4.4.4, 96
Shfletuesi UC për Android-Version 12.12
Interneti Samsung-Publikimi 4-14.0, 15.0
Shfletuesi QQ-Version 10.4
Shfletuesi Baidu-Version 7.12
Shfletuesi KaiOS-Version 2.5

Si funksionon SVG?

SVG-të përdorin XML për të prodhuar imazhe vektoriale dydimensionale. Ndryshe nga JPG dhe PNG, grafika vektoriale nuk ka piksel. Në vend të kësaj, sjellja e tyre përshkruhet në skedarët e tekstit XML.

Për këtë arsye, SVG-të mund të kërkohen, indeksohen, skriptohen, modifikohen dhe kompresohen si kod. Si rezultat, çdokush mund t'i krijojë ato duke përdorur një redaktues teksti ose softuer grafike vektoriale.

A e mbështet WordPress SVG?

Nuk ka asnjë mbështetje SVG në WordPress si parazgjedhje për shkak të rreziqeve të sigurisë që imponon – ne do t'i mbulojmë çështjet e sigurisë që rrethojnë SVG më në thellësi më vonë.

Këtu është një mesazh gabimi që shfaqet kur ngarkoni një grafik SVG në një faqe interneti të WordPress:

Aty eshte nje diskutimi aktual për ta bërë SVG-në pjesë të funksionalitetit kryesor të WordPress. Deri atëherë, ne duhet të bëhemi krijues dhe të përdorim zgjidhje të tjera për të ngarkuar imazhe SVG në WordPress.

Pse të përdorni WordPress SVG?

Pavarësisht nga problemet e tij të sigurisë, shumë përdorues ende e përdorin këtë format imazhi pasi ka avantazhe të ndryshme. Këtu janë disa nga përfitimet e përdorimit të skedarëve SVG:

  • Shkallëzueshmëria: Meqenëse SVG është një format imazhi vektor, skedarët SVG ruajnë të njëjtën cilësi në të gjitha rezolucionet e ekranit. Ky avantazh është i pranishëm edhe pas zmadhimit të tyre, kjo është arsyeja pse shumë njerëz përdorin këtë format imazhi të shkallëzuar për ikona dhe logo.
  • Madhësia më e vogël e skedarit : Skedarët SVG e bëjnë të lehtë përmirësimin e performancës së uebsajtit sepse zënë më pak hapësirë ​​ruajtëse në ueb dhe ngarkohen shumë më shpejt se imazhet e tjera.
  • SEO Friendly : Google indekson skedarët SVG, duke i lejuar ata të shfaqen në Google Image Search dhe duke përmirësuar përpjekjet tuaja të kërkimit. SEO. Me llojet e tjera të imazheve, ju jeni të kufizuar në optimizimin e atributeve të tyre alt.
  • SVG të bazuara në kod janë të redaktueshme duke përdorur një redaktues teksti ose softuer të redaktimit të grafikës vektoriale. Ju mund të optimizoni skedarët SVG për faqet e internetit ose madje të shtoni animacione për t'i bërë grafika interaktive.

SVG në WordPress dhe siguri

Meqenëse SVG është në thelb një skedar teksti XML, ai ka dobësi të shfrytëzueshme që nuk ndikojnë në formatet e tjera të imazhit. Prandaj, njerëzit mund ta rrëmbejnë lehtësisht atë me kod me qëllim të keq për të nisur sulmet e Scripting Cross-Site (XSS) dhe XML External Entity (XXE) në sistemin tuaj.

Për këtë arsye, duhet të jeni të kujdesshëm kur trajtoni skedarët SVG dhe i shtoni ato në WordPress.

Për të minimizuar rreziqet e sigurisë, sigurohuni që të pastroni skedarët SVG përpara se t'i ngarkoni në bibliotekën e mediave të WordPress. Ky proces heq kodin dhe gabimet e dyshimta, duke i bërë imazhet të sigurta për faqen tuaj të internetit.

Ju mund të pastroni skedarët e ngarkuar SVG duke përdorur një shtesë SVG – ne do t'i mbulojmë hapat e tij më vonë. Megjithatë, ju rekomandojmë që ta dezinfektoni dy herë me Testi i dezinfektuesit SVG -

Një mënyrë tjetër për të siguruar faqen tuaj të internetit të WordPress është të kufizoni ngarkimet SVG vetëm tek përdoruesit e besuar. Përdoruesit e përzgjedhur duhet të jenë të vetëdijshëm për çështjet e sigurisë që rrethojnë formatin SVG - kjo do t'i dekurajojë ata të marrin skedarë SVG nga burime të dyshimta.

Si të ngarkoni skedarë SVG në WordPress në 2 metoda të sigurta

Teknikisht, ekzistojnë dy mënyra për të shtuar mbështetjen SVG në WordPress: duke përdorur a plugin WordPress ose duke e aktivizuar manualisht. Cilado që të zgjidhni, ju sugjerojmë fuqimisht që të kufizoni privilegjet e shkarkimit tek administratorët dhe përdoruesit e besuar vetëm për të minimizuar shkarkimet me qëllim të keq.

Përdorni një plugin WordPress

Në këtë tutorial, ne do të përdorim Mbështetje SVG. Kjo plugin WordPress përdor një bibliotekë dezinfektuesi SVG që do të aktivizohet automatikisht kur ngarkoni skedarë SVG në bibliotekën e mediave. Është gjithashtu i lehtë për t'u konfiguruar dhe i lirë për t'u përdorur.

Këtu janë hapat për të konfiguruar mbështetjen SVG:

  1. IInstaloni shtojcën dhe aktivizoni atë.
ngarkoni SVG në WordPress
  1. Qasja në settings -> mbështetje SVG nga pulti juaj i WordPress.
  1. Kontrolloni kutinë pranë opsionit Kufizohu tek administratorët për të kufizuar privilegjet e ngarkimit. Bëni të njëjtën gjë për opsionin Aktivizo modalitetin e avancuar nëse doni akses në veçori të avancuara, të tilla si interpretimi inline SVG dhe stilimi CSS.
ngarkoni SVG në WordPress
  1. Pas ruajtjes së ndryshimeve, mund të filloni me siguri ngarkimin e skedarëve SVG në bibliotekën e mediave.

Shtoni manualisht mbështetjen e WordPress SVG

Kjo metodë përfshin redaktimin e skedarit functions.php e faqes suaj të internetit WordPress. Prandaj, ju rekomandojmë fuqimisht që të ndiqni këto hapa nëse jeni të njohur me PHP dhe e kuptoni plotësisht çështjen e sigurisë SVG.

Sigurohu qe ti bëni kopje rezervë të faqes suaj të WordPress përpara se të bëni ndryshime për të shmangur humbjen e të dhënave në rast të konfigurimit të gabuar.

Hapat e mëposhtëm do të shpjegojnë se si të aktivizoni SVG në WordPress manualisht me ndihmën e një klienti FTP si FileZilla.

  1. Shkoni te drejtoria e skedarëve të faqes suaj të internetit në hostin tuaj
  2. Qasja në public_html -> wp-përfshin. Lëvizni poshtë derisa ju gjeni funksionet.php.
ngarkoni SVG në WordPress
  1. Klikoni me të djathtën mbi këtë skedar dhe zgjidhni View/Edit për ta hapur atë dhe ngjitni në të pjesën e mëposhtme të kodit:
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. Ruani ndryshimet dhe provoni të ngarkoni një skedar të ri SVG. Nëse procesi është i suksesshëm, biblioteka juaj e mediave duhet të pranojë ngarkimin e skedarit.

Përparësitë e shumta të skedarëve SVG kontribuojnë në rritjen e popullaritetit të këtij lloji skedari. Fatkeqësisht, skedarët e tekstit XML janë të prirur ndaj injektimit të kodit, që është arsyeja kryesore që WordPress nuk përfshin mbështetjen SVG si parazgjedhje.

Thënë kështu, ka dy mënyra për ta bërë uebsajtin tuaj të WordPress të pranojë skedarë SVG: duke përdorur a plugin WordPress ose modifikoni skedarin functions.php. Përveç kufizimit të privilegjeve të ngarkimit, do të jeni në gjendje të ngarkoni në mënyrë të sigurt skedarët SVG në bibliotekën e mediave të faqes së internetit.

Burime të tjera të rekomanduara

Ju ftojmë gjithashtu të konsultoheni me RESSOURCES më poshtë për të hyrë më thellë në fillimin dhe kontrollin e faqes suaj të internetit dhe blogut.

Përfundim

Kjo është ajo për këtë udhëzues që ju tregon se si të ngarkoni SVG në WordPress. Shpresojmë që ky artikull t'ju ketë dhënë disa njohuri mbi përfitimet dhe rreziqet e ngarkimit të skedarëve SVG në një faqe interneti të WordPress. Nëse keni ndonjë shqetësim ose sugjerim, ju lutemi na tregoni brenda komente.

Megjithatë, gjithashtu do të jeni në gjendje të konsultoheni me ne RESSOURCES, nëse keni nevojë për më shumë elemente për të realizuar projektet tuaja të krijimit të faqeve në Internet, duke u konsultuar me udhëzuesin tonë për Krijimi i blogut të WordPress ose atë më Divi: tema më e mirë e WordPress të të gjitha kohërave.

Ndërkohë, ndajeni këtë artikull në rrjetet tuaja të ndryshme sociale.   

...