Go to Font Squirrel and download a webfont kit pack. You can download existing packs or upload your own fonts to the webfont generator.
2 Extract the downloaded zip archive and open all folders to access the web fonts.
3 Copy the 4 font formats (.eot, .svg, .ttf, .woff) to the root Opencart installation folder. See this example.
4 Open the "stylesheet.css" file from the downloaded package and copy the code and paste it in Journal admin in Settings > Custom Code > CSS.
5 Access your Opencart root installation files and open "system/journal2/data/fonts/system-fonts.json" to add your custom font to the System Fonts in the Font Editor. See this example. You will then see the custom font in the editor, example.
Note that the font preview inside the Font Editor will not work but the actual font is applied to your element in the store front.