This tutorial will show you how to add Google Fonts to your pages.
Go to the website https://fonts.google.com/.
Select the fonts you like. We choose two fonts "Roboto" and "Lato" as examples.
We will select more styles from these two fonts as shown below in addition to the default "regular 400".
Click on the "EMBED" link. Select the text that include the tag "<link..." and the lines with "font family:" as shown below.
Right-click on the selected text and choose "Copy" from the context menu.
Select "Tools" > "Google Web Fonts Manager" from the main menu or clicking on this button on the toolbar. Click on the "Add" button on the right.
Paste the selected text from Google Web Fonts to the text field by clicking on the "Paste from Clipboard" button or right-click on the text field and choose "Paste" from the context menu.
Click on the OK button and these fonts will be added to the manager.
Click on the OK button to save the added fonts.
Two new font families "Roboto, sans-serif (Google Web Font)" and " Lato, sans-serif (Google Web Font)" will be added to the "Font family" drop down menu automatically.
To use this font, define a new style and apply it to elements or pages. Check out this tutorial Apply styles to an element or a page for details on how to do this. For example, we will use "Roboto" on our pages, so we define the following:
Please note that the "Font weight" should match styles chosen from Google Web Fonts. Browsers use this information and the font name to select which font files to be used. For example, if you select "300" for "Font weight". Browsers will not be able to find the exact font file and will try to render the text by simulating this style and the results will usually not look as good as an exact match.
The program will detect which Google Web Fonts are used on a page and generate the relevant link as those supplied by Google Web Fonts. Use the above as example, the following will be added to the page automatically.