Afbeeldingen en lettertypen in SVG insluiten
Voeg één SVG en de afbeeldingen (PNG, JPEG, WebP, GIF) of lettertypen (TTF, OTF, WOFF, WOFF2) waarnaar deze verwijst toe en bundel ze in één SVG, zodat u de assets niet afzonderlijk hoeft te delen. Geef voor elke verwijzing de te gebruiken asset op en maak de SVG. U kunt deze opslaan zodra het voorbeeld correct wordt weergegeven. Assets van externe URL’s worden niet automatisch opgehaald.
Wat u kunt doen
Afbeeldingen en lettertypen bundelen
Sluit toegevoegde lokale assets in de SVG in, zodat u ze minder vaak afzonderlijk hoeft te versturen.
Verwijzingen en assets controleren
Selecteer voor elk afbeeldingspad of elke lettertypenaam in de SVG het bijbehorende bestand. De SVG wordt niet gemaakt zolang er verwijzingen onopgelost zijn.
Weergave van de gemaakte SVG controleren en opslaan
Controleer de weergave als afbeelding en sla de SVG met ingesloten assets op. Oorspronkelijke bestanden worden niet overschreven.
Zo gebruikt u het
Een SVG en assets toevoegen
Selecteer één SVG en de afbeeldingen en lettertypen waarnaar deze verwijst. U kunt ze ook samen vanuit een map toevoegen.
Assets koppelen om in te sluiten
Controleer welk lokaal bestand bij elke verwijzing hoort. Selecteer voor verwijzingen die niet automatisch zijn gekoppeld een bestand uit de al toegevoegde assets.
De SVG maken
Als er geen onopgeloste verwijzingen meer zijn, klikt u op SVG met afbeeldingen en lettertypen maken.
Weergave controleren en opslaan
Controleer vóór het opslaan de tekst en afbeeldingen in het voorbeeld. Als de weergave mislukt, controleert u de oorspronkelijke SVG en assets.
Handig wanneer u
De SVG en assets samen overdragen
Een illustratie met verwijzingen naar afbeeldingen en lettertypen in afzonderlijke mappen wilt combineren tot één SVG die gemakkelijk kan worden overgedragen.
Oorzaak van verbroken verwijzingen controleren
De benodigde assets vergelijken met de toegevoegde bestanden en ontbrekende afbeeldingen of lettertypen selecteren.
Hoe verwijzingen en insluiten werken
Relatieve paden en bestanden koppelen
Verwijzingen worden automatisch gekoppeld als een relatief pad in de SVG exact overeenkomt met het pad van een toegevoegde asset. Selecteer handmatig als gelijknamige bestanden in verschillende mappen staan of kandidaten elkaar overlappen.
Het bestand voor elke lettertypenaam selecteren
De tool haalt geen lettertypen van uw apparaat op basis van alleen de namen in de SVG. Voeg de benodigde lettertypebestanden toe en selecteer de juiste bestanden.
Assets van URL’s worden niet automatisch opgehaald
Ook als er naar een externe URL wordt verwezen, moet u de afbeeldingen of lettertypen lokaal aanleveren en selecteren. Deze pagina haalt geen assets van URL’s op.
Insluiten is iets anders dan bestanden verkleinen
Afbeeldingsgegevens in de SVG opnemen kan de SVG zelf groter maken. Lettertypen worden naar WOFF2 geconverteerd en ingesloten. Optimaliseer de SVG-code met een afzonderlijke tool.
Verschillen per weergavemethode
Het voorbeeld geeft de SVG als afbeelding weer. Dezelfde weergave is niet in elke app gegarandeerd; controleer daarom ook de vereiste weergave op de bestemming.
Veelgestelde vragen
Wat moet ik doen als een asset niet kan worden gevonden?
Voeg afbeeldingen of lettertypen toe en selecteer ze in het selectieveld bij de bijbehorende verwijzing. Automatische koppeling werkt mogelijk niet met verschillende mappen, dubbele paden of externe URL’s.
Welke assets kan ik gebruiken?
Afbeeldingen mogen PNG, JPEG, WebP of GIF zijn; lettertypen TTF, OTF, WOFF of WOFF2. Selecteer SVG-bestanden één voor één.
Vindt de tool lettertypen automatisch?
Deze tool zoekt niet op basis van alleen een lettertypenaam in de SVG naar lettertypen op uw apparaat of op het web. Voeg lokaal een bestand toe en selecteer het.
Wat gebeurt er met assets die al zijn ingesloten?
Afbeeldingen en lettertypen die als data-URI zijn ingesloten en #‑verwijzingen binnen de SVG gelden niet als externe verwijzingen. U kunt de SVG maken als er geen gevonden verwijzingen onopgelost blijven.
Wat gebeurt er als ik assets toevoeg of opnieuw selecteer?
Als u alleen assets toevoegt, worden deze aan de lijst toegevoegd en blijven eerder toegewezen assets behouden. Controleer bijvoorbeeld de automatische koppeling als er meer kandidaten met hetzelfde pad beschikbaar komen. Invoer met een nieuwe SVG vervangt de huidige SVG en alle assets ervan.
Wat als er niet-ondersteunde verwijzingen zijn?
Externe gebruiks- of scriptverwijzingen kunnen niet worden ingesloten. SVG’s met imports van externe CSS kunnen ook niet worden geladen. Orden de verwijzingen in de oorspronkelijke app of een andere geschikte app voordat u de SVG selecteert.
Wordt de SVG kleiner?
Deze tool is niet bedoeld om bestanden kleiner te maken. Het opnemen van assets in de SVG kan de bestandsgrootte verhogen. Gebruik SVG-optimalisatie om de code op te schonen.
Wat als de gemaakte SVG niet kan worden weergegeven?
De opslagoptie verschijnt pas op dit scherm nadat de SVG met succes wordt weergegeven. Controleer de oorspronkelijke SVG en assets, bekijk de koppelingen of bestanden en maak de SVG opnieuw.
Invoer en resultaten
- Invoer
- Eén SVG plus afbeeldingen en lettertypen. Voeg ze toe vanuit bestanden of mappen.
- Afbeeldingen
- De oorspronkelijke afbeeldingsgegevens worden ingesloten. Afbeeldingen worden niet verkleind of gecomprimeerd.
- Lettertypen
- Gekoppelde lettertypen worden naar WOFF2 geconverteerd en ingesloten.
- Uitvoer
- original-name-embedded.svg. U kunt opslaan nadat de gemaakte SVG met succes wordt weergegeven.