Embedding fonts in inkscape

Question

Does any body know what is the current status of embedding fonts into an svg file that is readable by inkscape. I find the lack of embedded fonts severely impedes portability of svg files, particular if sending the file to a person who doesn't have admin access on their machine and cannot install fonts.

I tried to follow the instructions given at this link:

HOWTO: Embedding a font in a Linux Inkscape SVG document

but have been unable to get it to work, this link also suggests that it is possible:

https://answers.launchpad.net/inkscape/+question/83618

I, to be fair am trying to get this to work on windows, not linux (I don't have access to a linux machine right now). Does any one know of or have access to an actual svg file where this feature is working?

Answer 1

You can make a portable SVG file by converting the text to a vector path.

Select the text object, then go to the menu Path → Object to Path. (You could also use Stroke to Path, depending upon what you want to do).

Of course as a vector, the text will no longer b be editable as text, but that may not matter as much to you as being able to have your SVG viewable on the other end.

Answer 2

In the current version of Inkscape seems not yet possible to embed SVG fonts (see also here a little example).

In 0.48 Release Notes:

There is a known limitation where the list of glyphs in the dialog are not yet rendered in the selected font, but still in the system font

In 0.47 Release Notes there is a more detailed explanation of the limitations:

As a SoC 2008 project, JucaBlues implemented initial parsing and rendering of SVG Fonts. You can design fonts within Inkscape, but using them to render text on the canvas is not yet supported. We are waiting for libpango to implement proper support of the user-fonts feature.

The render of SVG Fonts is not supported by Firefox or Internet Explorer, and Inkscape Wiki tell us that:

SVG2.0 may replace SVG fonts by WOFF

(let's wait and see)

---

At the moment, following this tutorial I was able to embed a WOFF font in SVG:

<svg xmlns="http://www.w3.org/2000/svg"
     xmlns:xlink="http://www.w3.org/1999/xlink"
     width="100%" height="100%" viewBox="30 40 340 135">

  <title>WebFont Template for SVG</title>

  <style type="text/css"><![CDATA[
    @font-face {
        font-family: "indie_flower";
        src: url("indie_flower.woff") format("woff");
        font-weight: normal;
        font-style: normal;
    }

    text { 
        font-family: "indie_flower", serif;
        font-size: 40px;
        fill: silver;
        stroke: gray;
        stroke-width: 0.5px;
        text-anchor: middle;
    }

    textPath { 
        font-size: 35px;
        text-anchor: start;
        fill: silver;
        stroke: none;       
    }

  ]]></style>

  <text x="200" y="80">http://schepers.cc/svg-webfonts</text>  

  <path id="curve" d="M75,170 C150,140 200,140 250,160" fill="none"/>
  <text><textPath xlink:href="#curve">Google Indie Flower</textPath></text>

</svg>

The font was copied locally following this url (get from here) and obtaining the download link (conveniently renamed into "indie_flower.woff").

The SVG file uses a local font and renders well (tested with Firefox 34, Chrome 39 and Internet Explorer 11 under Windows 8.1). Using a local font I cannot link the SVG file, you have to settle for a screenshot:

Unfortunately (see above), Inkscape at the moment is not able to render it and use the default font.

At the moment...let's wait and see.