Right Font-face url

  • johnnyRing

    (@johnnyring)


    12 years, 10 months ago

    Hi,
    I’m trying to change my web font family by using font face method (http://blog.themeforest.net/tutorials/how-to-achieve-cross-browser-font-face-support/).
    I must confess that I wasn’t able to write the right lines code to adding to css style for getting the result that I want.
    I’ve tried in this way:

    @font-face {
    font-family: 'alegreya_scregular';
    src: "http://b5srl.eu/wp-content/themes/Flexibile/fonts/alegreya/alegreyasc-regular-webfont.eot";
    src: "http://b5srl.eu/wp-content/theme/flexibile/fonts/alegreya/alegreyasc-regular-webfont.eot?#iefix" format('embedded-opentype'),
         "http://b5srl.eu/wp-content/theme/flexibile/fonts/alegreya/alegreyasc-regular-webfont.woff" format('woff')",
         "http://b5srl.eu/wp-content/theme/flexibile/fonts/alegreya/alegreyasc-regular-webfont.ttf" format('truetype')",
         "http://b5srl.eu/wp-content/theme/flexibile/fonts/alegreya/alegreyasc-regular-webfont.svg#alegreya_scregular" format('svg')";
    font-weight: normal;
    font-style: normal;

}

    In this other

    @font-face {
    font-family: 'alegreya_scregular';
    src: http://b5srl.eu/wp-content/theme/flexibile/fonts/alegreya/('alegreyasc-regular-webfont.eot');
    src: http://b5srl.eu/wp-content/theme/flexibile/fonts/alegreya/('alegreyasc-regular-webfont.eot?#iefix') format('embedded-opentype'),
         http://b5srl.eu/wp-content/theme/flexibile/fonts/alegreya/('alegreyasc-regular-webfont.woff') format('woff'),
         http://b5srl.eu/wp-content/theme/flexibile/fonts/alegreya/('alegreyasc-regular-webfont.ttf') format('truetype'),
         http://b5srl.eu/wp-content/theme/flexibile/fonts/alegreya/('alegreyasc-regular-webfont.svg#alegreya_scregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

    and in many other without success.
    Someone could help me, please?
    Particularly I really appreciate someone who explain me my mistake.
    Thanks a lot

Viewing 5 replies - 1 through 5 (of 5 total)
  • esmi

    (@esmi)

    12 years, 10 months ago

    http://www.fontsquirrel.com/tools/webfont-generator

    Thread Starter johnnyRing

    (@johnnyring)

    12 years, 10 months ago

    Thank you,
    I know this tool, what I can’t get is the right url,
    that is which path I must substitute to url for giving eot, ttf, etc. files to the browsers and so changing my webfont family.
    Could you help me please?

    Thread Starter johnnyRing

    (@johnnyring)

    12 years, 10 months ago

    Hi, these should be the correct code lines:

    @font-face {
font-family: 'architects_daughterregular';
src: url('http://mysite.eu/wp-content/themes/flexibile/architectsdaughter-webfont.eot');
src: url('http://mysite.eu/wp-content/themes/flexibile/architectsdaughter-webfont.eot?#iefix') format('embedded-opentype'),
url('http://mysite.eu/wp-content/themes/flexibile/architectsdaughter-webfont.woff') format('woff'),
url('http://mysite.eu/wp-content/themes/flexibile/architectsdaughter-webfont.ttf') format('truetype'),
url('http://mysite.eu/wp-content/themes/flexibile/architectsdaughter-webfont.svg#architects_daughterregular') format('svg');
font-weight: normal;
font-style: normal;

}

    as eot, ttf, etc files are in
    flexibile
    directory.

    These ones too

    @font-face {
font-family: 'alegreya_scregular';
src: url('http://mysite.eu/wp-content/themes/flexibile/fonts/alegreya/alegreyasc-regular-webfont.eot');
src: url('http://mysite.eu/wp-content/themes/flexibile/fonts/alegreya/alegreyasc-regular-webfont.eot?#iefix') format('embedded-opentype'),
url('http://mysite.eu/wp-content/themes/flexibile/fonts/alegreya/alegreyasc-regular-webfont.woff') format('woff'),
url('http://mysite.eu/wp-content/themes/flexibile/fonts/alegreya/alegreyasc-regular-webfont.ttf') format('truetype'),
url('http://mysite.eu/wp-content/themes/flexibile/fonts/alegreya/alegreyasc-regular-webfont.svg#alegreya_scregular') format('svg');
font-weight: normal;
font-style: normal;

}

    considered that I’ve created
    fonts
    directory and
    alegreya
    subdirectory.
    Both of them don’t work at all.
    I’d glad top know your opinion about this.
    Thank you

    esmi

    (@esmi)

    12 years, 10 months ago

    Where are the font files located in relation to the .css file?

    Thread Starter johnnyRing

    (@johnnyring)

    12 years, 10 months ago

    css.style is in Flexibile directory.
    Thanks a lot

Viewing 5 replies - 1 through 5 (of 5 total)

The topic ‘Right Font-face url’ is closed to new replies.