You are viewing an old version of this page. View the current version.

Compare with Current View Page History

« Previous Version 7 Current »

Getting a link to a Google Web Font

Google publishes a catalog of open source designer web fonts which are relatively easy to download and use on your website.

In this example, we will use the font Dancing Script and apply it to our Heading 2 (H2) tag.

  1. To view Google Fonts, go to https://fonts.google.com/

  2.  Choose your font(s) and select your styles.

  3. For your Selected families, click Embed and copy the Link code they provide

    For example:

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



Adding the font code to your website

  1. Go to Website > HTML Head, click Edit

  2.  Next to Page Header HTML, paste the embed link you copied from Google.

  3. Click Save Website Header and Footer

  4. Go to RescueGroups.org and click Login, once logged in go to Website > Custom CSS

Example:

/* Applies formatting for Heading 2*/

h2 {
margin: 0 0 15px 10px;
font-family: 'Dancing Script', serif;
font-size: 41px;
font-style: normal;
font-weight: 400;
text-decoration: none;
text-transform: none;
letter-spacing: 0.061em;
word-spacing: 0.115em;
line-height: 1.11;
}



  • No labels