![[OzzModz] Easy Google Fonts](/data/resource_icons/8/8298.jpg?1639399259){kind=icon}
- Compatible XF Versions
- 2.1
- 2.2
This small handy addon allows you to easily add Google Font embed codes directly to your theme using a single Style Property, instead of using messy template edits.
How to use
1. Visit the Google Fonts website and select your fonts & weights
2. Copy the <link> embed codes supplied on the page
3. Paste these codes into the Font Scripts field on the Style Properties -> Typography page for your style.
4. Add the name of your Google font to the body font family on the Style Properties -> Typography page.
Selecting fonts
Embedding fonts
FAQ
Q. Where can I find the settings for this addon?
A: You can find the field for pasting font codes in Style Properties -> Typography
Q. How do I paste the codes? Where do I get it from?
A: You should always paste the code as supplied directly on the Google Fonts website after selecting your fonts. See the above screenshot for example. Google supplies this code in three lines - you should copy and paste all three lines, similar to this:
How to use
1. Visit the Google Fonts website and select your fonts & weights
2. Copy the <link> embed codes supplied on the page
3. Paste these codes into the Font Scripts field on the Style Properties -> Typography page for your style.
4. Add the name of your Google font to the body font family on the Style Properties -> Typography page.
Selecting fonts
Embedding fonts
FAQ
Q. Where can I find the settings for this addon?
A: You can find the field for pasting font codes in Style Properties -> Typography
Q. How do I paste the codes? Where do I get it from?
A: You should always paste the code as supplied directly on the Google Fonts website after selecting your fonts. See the above screenshot for example. Google supplies this code in three lines - you should copy and paste all three lines, similar to this:
Code:
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600&display=swap" rel="stylesheet">
![[OzzModz] Website Verification](/data/resource_icons/757/757854.jpg?1678767801){kind=icon}
![OzzModz] Editor Icon Styling](/data/resource_icons/758/758314.jpg?1708561765){kind=icon}
![OzzModz] User Batch Update Action: Birthday Remove](/data/resource_icons/757/757884.jpg?1680552084){kind=icon}
![OzzModz] Usergroup View In ACP](/data/resource_icons/7/7635.jpg?1603138123){kind=icon}
![[OzzModz/Banxix] Bump Thread](/data/resource_icons/5/5860.jpg?1605294642){kind=icon}