In this tutorial I'll show you in 3 steps how to use any Google Font in a RapidWeaver theme and how to target an element in your page or all pages of your project.
1 - First get the link to your desired font in Google Fonts https://fonts.google.com. For this example we are choosing the Montserrat font. Go to the Google Fonts page and get the standard embed code, it looks like this for Montserrat:
<link href="https://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet">
2 - Insert the above code in the custom header of the page or in the global Head for all pages in your project, like the screenshot below:
3 - Then go to global CSS (or the CSS field of a page) and set the element for the font, examples:
For all text elements use:
body {font-family: 'Montserrat', sans-serif;}
For headings only use:
h1, h2, h3, h4, h5, h6 {font-family: 'Montserrat', sans-serif;}
In specific containers, like extra containers:
#myExtraContent1 {font-family: 'Montserrat', sans-serif;}
Comments
0 comments
Article is closed for comments.