The method presented below uses the format "WOFF" and may not be compatible in some configurations with some older browsers.

To get maximum compatibility with major browsers we recommend that you read this article.

First get Google Web Fonts code : https://fonts.google.com/
We choose typography "Advent Pro," designed by Andreas Kalpakidis.

Google Web Fonts gives the following code :

Get the CSS @font-face code from url: http://fonts.googleapis.com/css?family=Advent+Pro

There are two methods :

Method 1 : Insert @font-face in the "head" section of your page (Toolbars)
Only the current page will call that font.

Insert @font-face code in the « head » section between tags <style> </style> :

Click on "save page" button top right or ctrl+s

Method 2 : Insert @font-face in the CSS
All the pages of site will call that font.

Insert @font-face code at the end of the CSS :

Click on « Apply » and save

With both methods imported typography can be used directly by any element of this page.
With method 2, any element in anay page can use that typography.

In our example for the "rich text", you'll find typography Advent Pro in the "Characters" at the end of the drop-down list under "import".