Så laddar du upp SVG-bilder i WordPress

  • Victor Duse
  • 2024-04-23
  • Wordpress
  • 0 kommentarer
  • Om affiliate-länkar
    Några av länkarna i det här inlägget är affiliate-länkar. Detta innebär att om du klickar på dessa länkar och köper något kommer jag att få en affiliate-kommission. Men det kommer aldrig att kosta mer för dig. Tack för ditt stöd!

Att använda bilder i SVG-format blir allt mer populärt tack vare möjligheten att skala om bilderna utan att förlora i kvalitet och upplösning. WordPress tillåter inte uppladdning av SVG-filer på grund av potentiella säkerhetsproblem. Här följer några enkla steg för att tillåta SVG-uppladdningar till din WordPress-webbplats på ett säkert sätt.

Missa inga nyheter!

The .svg file has failed to upload.<br />
Sorry, you are not allowed to upload this file type.

”Uppladdningen av ’bild.svg’ misslyckades. Du har inte behörighet för att ladda upp denna filtyp.”

Att aktivera SVG-uppladdningar i WordPress kan göras med antingen ett tillägg (plugin) eller med anpassad kod. Nedan finns detaljerade beskrivningar av båda metoderna:

Metod 1: Använd ett tillägg (Safe SVG)

Att använda ett tillägg är den enklaste och säkraste metoden för att aktivera SVG-uppladdningar i WordPress. Tillägget Safe SVG är ett av världens mest använda tillägg för just detta ändamål.

Safe SVG – ett tillägg till WordPress

Safe SVG har mer än 900 000 aktiva installationer och 5 stjärnor i betyg i WordPress katalog för gratis tillägg.

Steg för att aktivera SVG-uppladdningar med Safe SVG:

1. Installation:

  • Börja i WordPress kontrollpanel
  • Gå till Tillägg » Lägg till nytt tillägg
  • Sök efter ”Safe SVG” i sökfältet.
  • Hitta tillägget ”Safe SVG” (utvecklat av ”10up”) och klicka på Installera nu.
  • Efter installationen klickar du på Aktivera.

2. Konfiguration:

  • Gå till fliken Inställningar » Media
  • Längst ner på sidan kan du välja ”Säkra SVG-inställningar
  • Välj vilka använarroller som ska kunna ladda upp SVG-filer
  • Klicka på Spara ändringar för att tillämpa inställningarna.

3. Ladda upp och infoga SVG:

  • Navigera till Media » Lägg till ny.
  • Ladda upp din SVG-fil.
  • Infoga SVG-filen i dina inlägg eller sidor med hjälp av din sidbyggare för WordPress.

Det var allt!

Metod 2: Lägg till kod för att tillåta uppladdning av SVG-filer

Om du föredrar att inte använda tillägg eller vill ha mer kontroll över SVG-hanteringen kan du aktivera SVG-uppladdning med egen kod. Denna metod innebär att du lägger till en kodsnutt i temats functions.php-fil (eller i ett eget tillägg).

Tips: Använd en barntema för att skydda dina ändringar. Detta säkerställer att din kod förblir intakt och inte skrivs över när du uppdaterar ditt tema. Det kostnadsfria tillägget Code Snippets är ett bra alternativ om du inte vill att använda ett barntema. Det är också en bra idé att skapa en säkerhetskopia av din webbplats innan du redigerar functions.php.

Steg för att aktivera SVG-uppladdningar med anpassad kod:

1. Redigera temats functions.php-fil:

  • Börja i WordPress kontrollpanel
  • Gå till Utseende » Filredigerare för teman.
  • Välj filen functions.php från listan över temafiler.

ELLER

  • Använd FTP eller cPanel för att komma åt filerna på din WordPress-webbplats.
  • Navigera till wp-content/themes/ditt-tema-namn/
  • Leta reda på och redigera filen functions.php.

2. Lägg till anpassad kod:

Lägg till följande kod för att aktivera SVG-uppladdningar:

add_filter('upload_mimes', function($mimes) {
    $mimes['svg'] = 'image/svg+xml';
    return $mimes;
});

3. Spara ändringarna:

  • Om du använder Filredigerarew för teman klickar du på ”Uppdatera fil” för att spara ändringarna.
  • Om du använder FTP eller cPanel, spara filen functions.php och ladda upp den tillbaka till din server.

4. Ladda upp och infoga SVG-filer:

  • Navigera till Media » Lägg till ny mediafil
  • Ladda upp din SVG-fil.
  • Infoga SVG-filen i dina inlägg eller sidor med hjälp av din sidbyggare för WordPress.

Bra jobbat!

Det var allt för idag!

Jag hoppas att du gillade det här inlägget. Prenumerera på Diviguiden på YouTube för långa kurser och korta tips.

Gratis kurs: Skapa en webbplats från grunden med WordPress & Divi

Relaterat inlägg: Gratis bilder till din hemsida – mina fem favoriter

Relaterade inlägg

Checklista: Så migrerar du från Divi 4 till Divi 5

Checklista: Så migrerar du från Divi 4 till Divi 5

Divi 5 har officiellt släppts, och om du har byggt sajter med Divi 4 undrar du säkert hur du tar steget. Elegant Themes har byggt in ett migreringsverktyg direkt i Divi, så du behöver inte bygga om något från grunden. Migreringen tar ditt befintliga Divi 4-innehåll...

läs mer
0 kommentarer

Skicka en kommentar

Din e-postadress kommer inte publiceras. Obligatoriska fält är märkta *