[SOLVED] Changing font - with @font-face

[csstag]

Good morning People,

 

I would like to use a custom font in my prestashop, and I have tried to use css font-face utility, but without any success.

 

What I have done:

 

1. copy newfont.ttf in the root of the server (I have copied it into the themes root as well - doens't work either)

2. in the global.css have put these code:

@font-face{

font-family: batman;

src: url('batmfa.ttf');

}

3. call the new font in the body tag:

body{

font: batman, arial 12px/14px;

}

 

Can anyone please help me how to do it?

Edited January 23, 2014 by csstag (see edit history)

[Paul C]

You can take a look at the source for http://fontawesome.io/ to see a practical implementation (it's designed for the Bootstrap framework but is an excellent general example regardless).

 

There's also some good background reading here: http://www.webdirections.org/blog/the-return-of-font-embedding-to-the-web/ including information about compatibility and standards for font embedding.

 

Have fun!

[CartExpert.net]

Hi.

 

You can also try http://www.font2web.com/ . It will generate all the formats (for different browsers) and the css file too.

 

Regards.

Robin.

The CartExpert Team

[csstag]

Thank you very much for your help, solved!