How to refer to a font that is on my web site server?


(Gustavo) #1

I do not want to use Google’s fonts. How to use a different font that is inside my website directory.
Any examples please?


#2

Could you elaborate a bit more on this. Is this a directory somewhere on your website outside of the resources directory? Or is this the resources folder?

The following will help you when adding custom fonts. You can use a relative or absolute path to where your fonts live.

You would add this code to the Head HTML (including the <style> tags) Notice that the url includes the special variable from Hype. If your fonts are somewhere else then you would change this url to the path where your fonts are.

http://tumult.com/hype/documentation/3.0/#declaring-an-font-face-style


(Gustavo) #3

The font is inside a folder where the website is hosted:

http://www.rfill.co/fonts

I’m trying to do the link you sent me but I can not. Can you help me again?


#4
<style>
    @font-face {
        font-family: 'NameOfYourFont';
        src: url('../fonts/name-of-your-font.eot?#iefix') format('embedded-opentype'),
             url('../fonts/name-of-your-font.woff') format('woff'),
             url('../fonts/name-of-your-font.ttf') format('truetype'),
             url('../fonts/name-of-your-font.svg#font-family-name') format('svg');
    }
</style>

This needs to go into your HeadHTML obviously replacing with your font name and path. And your hype file and resources must be within the same URL


(Gustavo) #5

I got it !!! Thank you very much!


(Gustavo) #6

:confused:Ops!
I just tested on a windows computer and did not load the font.


#7

Can you share a document and URL?


(Gustavo) #8

Of course!usando fonts proprias com css.hype.zip (14.9 KB)
font web.zip (93.8 KB)