Diary SiteMap RecentChanges About Contact 2012-09 Calendar

Search:

Matching Pages:

2012-09-29 External Fonts for SVG Files

I was writing a Perl CGI script that takes a SVG file I created with Inkscape, replaces a few placeholders and serves it via the web. How to supply this SVG file with an external TrueType font?

Upload the fonthttp://campaignwiki.org/Purisa.ttf

Add an appropriate MIME type – in the directory where the font file is, register an appropriate MIME type in your .htaccess file:

AddType application/x-font-ttf        .ttf

If you are creating a new .htaccess file, remember it needs a permission like -rw-r--r--.

Add an external style sheet to the SVG file – it is not obvious how to do this in Inkscape. I guess you can open the XML Editor and add an svg:style element. I just pasted the following into the beginning of my SVG file:

  <style
     type="text/css">
      @font-face {
          font-family: 'Purisa';
          src: local('Purisa'),
               url('/Purisa.ttf') format('truetype');
      }
  </style>

Care about Internet Explorer? I don’t have access to IE at the moment. I read that you might need to add an .eot file to support IE, and that would also require another MIME type to be added. You can convert a .ttf font to an .eot font using ttf2eot on the web.

Tags: RSS RSS

Show Google +1

Comments


Please make sure you contribute only your own work, or work licensed under the GNU Free Documentation License. See Info for text formatting rules. You can edit the comment page if you need to fix typos. You can subscribe to new comments by email without leaving a comment.

A carefully selected set of emoji for you to copy and paste: • ✕ ✓ ✝ ☠ ☢ ☣ ⚛ ☭ ☮ ☯ ⚒ ⚓ ⚔⚙ ★ ☆ ✨ 🌟 🐣 🐤 🐥 🐦 🐧 🐨 🐷 🐻 🐼 🐢 🐝 🐛 🐙 🐒 🐌 🐋 👑 ✊ 👊 ✌ 👋 👌 👍 👎 👏 👸 🍵 🍷 👹 👺 👻 👽 👾 👿 💀 ❤ ❦ ♥ 💔 📓 📖 📜 📝 🔒 🔓 🔔 🔥 🔨 🔪 🔫 🔮 😁 😂 😃 😄 😅 😆 😉 😊 😋 😌 😍 😏 😒 😓 😔 😖 😘 😚 😜 😝 😞 😠 😡 😢 😣 😤 😥 😨 😩 😪 😫 😭 😰 😱 😲 😳 😵 😷 😸 😹 😺 😻 😼 😽 😾 😿 🙀 🙇 🙈 🙉 🙊 🚶 🚲 🚀 🚽

To save this page you must answer this question:

Please say HELLO.