Showing posts with label css. Show all posts
Showing posts with label css. Show all posts

Saturday, December 20, 2008

Embedding fonts using SIFR

I've been around on the net since 1995, and have seen at least 3 ways to embed fonts on webpages: The microsoft way, the netscape way and now a cross platform way - SIFR.

As I try to put my threads short, I will just write a way to implement SIFR custom fonts on your website

  1. Locate a TTF font you whish to use on your webpage
  2. Goto the page which offers to convert the font to a "flash swf font" (used by SIFT):
    http://www.sifrgenerator.com/wizard.html
  3. Follow the wizard guide and choose version 2 in the end.
  4. Download the SWF file to a path near your website, say in a folder named "fonts"

Now the font is ready, all you need to do now is to try another free service appearing as a plugin for JQUERY - the sIFR plugin!

  1. Goto the website http://jquery.thewikies.com/sifr/
  2. Download the "Jquery sIFR plugin version 2" All in one.zip file
  3. unpack it and follow the guide

To be able to use the font you generated yourself - copy'n'paste the font into the "fonts" directory in the unpacked "all-in-one" zip file.

That's it! :-)

Thursday, November 13, 2008

Code snippets - lets unite!!

As I was browsing for some help for doing a simpel task I came across a site which contains Snippets - http://snipplr.com. Wow! That sounded interesting - the snippet I first clicked on was: "Opacity Hack. I was a litle disapointed, not with the snippet in question, but the fact that it was nothing but simpel text...

For years in the back of my head I have had the thought that code snippets should unite! :-) My hopes that snipplr.com was such a united snippet spot was spoiled...

But I tried to write my POWs about snippets - which was not 100% allowed by their comment system, so here goes - a (hopefully) working copy of what I tried to write about snippets standardlization:


Hi, In general I like the Idea of snippets, no doubt about that! But I would love to see some kind of standardilzation of them, preferable in a combination of XML, XSD (schema). You could then transform your XML snippet to what ever purpose you would need it in - say a HTML context. You can validate the input to the snippet using XSD. And some clever programmer might create add-ins for say MS Visual Studio 2008 or other commenly used development tools.
Here is my first thoughts about how it could be put together - based on this snippet for opacity:
<?xml version="1.0" encoding="utf-8"?>
<snippets>
<snippet>
<name>Opacity hack</name>
<version>1.0</version>
<context>CSS</context>
<template>
<outputRaw><![CDATA[selector { filter: alpha(opacity=60); /* MSIE/PC */ -moz-opacity: 0.6; /* Mozilla 1.6 and older */ opacity: 0.6;}]]></outputRaw>
<output>
<input id="alpha" type="string" default=".selector" /> {
filter: alpha(opacity=<input id="opacity" type="int" default="60"/>); /* MSIE/PC */
-moz-opacity: <eval id="moz-opacity"><![CDATA[opacity/100]]></eval>; /* Mozilla 1.6 and older */
opacity: <eval id="moz-opacity"><![CDATA[moz-opacity]]></eval>;
}
</output>
</template>
</snippet>
</snippets>