Skip navigation
benn1982
Currently Being Moderated

Can anyone help me using these fonts?...

Dec 1, 2012 4:37 AM

Hi guys, im building a site in dreamweaver and was hoping to use the fonts - positive a, barnes and pen of truth.

 

I know that there is something you can do with some copy and paste code from google but i cant seem to find it.

 

Can anyone help?!

 

Heres my site - www.allroots.org

 

Cheers

 

Benn

 
Replies
  • Sudarshan Thiagarajan
    4,000 posts
    Oct 15, 2010
    Currently Being Moderated
    Dec 1, 2012 7:21 AM   in reply to benn1982

    Benn,

     

    The 3 fonts you've mentioned are unavailable on Google Font Library - meaning they may not be free-to-use web fonts. However, if you purchase the font or maybe read the documentation, you can figure out to see if you could use it on the web as a custom webfont. If yes, you can use one of the online webfont conversion services such as 'fontsquirrel.com' to convert the font into a webfont.

     

    Or, search from over 500+ fonts on Google's Webfont API that you could instantly embed: http://www.google.com/webfonts

     

    -ST

     
    |
    Mark as:
  • Currently Being Moderated
    Dec 1, 2012 12:37 PM   in reply to benn1982
     
    |
    Mark as:
  • Sudarshan Thiagarajan
    4,000 posts
    Oct 15, 2010
    Currently Being Moderated
    Dec 5, 2012 6:54 AM   in reply to benn1982

    Benn,

     

    Line 6 of your HTML where you've used the reference for CabinSketch - it is incorrect referencing to Google Webfont library. The correct references it this:

     

     

    <link href='http://fonts.googleapis.com/css?family=Cabin+Sketch:700' rel='stylesheet' type='text/css'>

    700 being font-weight, bold.

     

    One more thing I noticed - Rye regular is also incorrectly referenced in your HTML. The correct line of reference is:

     

     

    <link href='http://fonts.googleapis.com/css?family=Rye' rel='stylesheet' type='text/css'>

     

    Replace both these to your existing lines that define these 2 font references.

     

    The current URL you've referenced to on Google Fonts API gives a 404 not found error - which means the font is not stored at Google at the referenced location which is why the font doesn't show up on your page. Try clicking on these links as given your document to see what I mean:

     

    CabinSketch Bold

    Rye Regular

     

    Trust this helps.

     

    -ST

     
    |
    Mark as:
  • Sudarshan Thiagarajan
    4,000 posts
    Oct 15, 2010
    Currently Being Moderated
    Dec 5, 2012 8:15 AM   in reply to benn1982

    My bad, forgot to add this in the previous reply.

     

    In your CSS, find references to this:

     

    font-family: "CabinSketch Bold";

    Change to:

     

    font-family: "Cabin Sketch";

    because the definition in google fonts API file is this:

     

    @font-face {

      font-family: 'Cabin Sketch';

      font-style: normal;

      font-weight: 700;

      src: local('CabinSketch Bold'), local('CabinSketch-Bold'), url(http://themes.googleusercontent.com/static/fonts/cabinsketch/v5/ki3SSN 5HMOO0-IOLOj069BAPw1J91axKNXP_-QX9CC8.woff) format('woff');

    }

     

    So, whatever name is given to the font in font-family during a font-face reference is what you should use in your CSS to replicate that font.

     

    Do the same thing for Rye as well.

     

    -ST

     
    |
    Mark as:
  • Sudarshan Thiagarajan
    4,000 posts
    Oct 15, 2010
    Currently Being Moderated
    Dec 5, 2012 8:30 AM   in reply to benn1982

    You're welcome.

     

    -ST

     
    |
    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points