Change fonts

  • Anonymous

    #10290

    Is there a simple way for an idiot like me to change fonts? I don’t know how to “enter the Google Webfont font family string in the format that is used in the Webfont Loader.”

    Thanks in advance.

    Mod

    Kenneth John Odle

    #45633

    It’s not difficult, but it does deserve an explanation.

    1) Find the Google Web Font you want to use.

    2) Click on the “Quick-use” icon (the box with an arrow pointing to the right).

    3) Follow Google’s steps: select the styles you want*, and then choose the character sets you want (usually, Latin is selected by default; unless you need characters from another language, you shouldn’t need to do anything here).

    4) Click on the “Javascript” tag. You’ll see something like this (I’m looking at the “Open Sans” font):

    Quote:
    <script type=”text/javascript”>

    WebFontConfig = {

    google: { families: [ ‘Open+Sans::latin’ ] }

    };

    (function() {

    var wf = document.createElement(‘script’);

    wf.src = (‘https:’ == document.location.protocol ? ‘https’ : ‘http’) +

    ‘://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js’;

    wf.type = ‘text/javascript’;

    wf.async = ‘true’;

    var s = document.getElementsByTagName(‘script’)[0];

    s.parentNode.insertBefore(wf, s);

    })(); </script>

    5) It looks complicated, but don’t worry, you don’t need most of this code. See the third line, that starts with “google”? Copy everything between the single quotes. In this case, copy:

    Quote:
    Open+Sans::latin

    6) Paste that in Graphene Options >> Display Options >> Text Style Options >> Font families

    7) You can now enter the font name in any box below labeled “font”. Remember that if the font name is a single word, you can just write the name (e.g., Roboto), but if it is two or more words, enclose them in single quotation marks (e.g., ‘Open Sans’)

    Try this, and if you still have issues with it, let me know and I’ll post some screen caps.

    * You can load as many styles here as you want, but only add the ones you’re going to use, because loading additional styles will slow down your site. For most fonts, you can safely just load the “Normal 400” and rely on CSS to make it italic or bold.

    Marcel

    #48708

    Is this still the right method using GT V2.1.2 ?

Viewing 3 posts - 1 through 3 (of 3 total)

  • You must be logged in to reply to this topic.