Do you want to make your website look better? Adding custom or Google fonts can help you achieve a unique and personalized design. In this guide, we’ll show you how to easily integrate these fonts using the Spectra plugin. Whether you’re a web developer, designer, or just someone who wants to improve their online presence, you’ll find step-by-step instructions for adding custom or Google fonts. Let’s get started and explore the exciting world of typography!
Note
What are Google fonts?
Let’s understand what Google fonts are and what they do. Google Fonts is a collection of 1,364 font families that are all free to use. For typical tasks and items, the collection also offers entertaining and wonderfully made icons.
Though the collection is huge, to maintain the uniformity of the typography throughout the website, we use only a few of them. While these wide ranges of fonts give you a huge opportunity of making your site beautiful; however, at the same time, make it load slower. This is the reason why we have decided to give the users to choose the font that they would like to load on their website.
How to Add Custom/Google fonts using the Spectra plugin
Spectra offers 1500+ Google font options. You can select which you want to use in your FSE Typography.
Step 1: From the WordPress Dashboard, navigate to Spectra > Dashboard
Step 2: Choose Settings from the top navigation bar
Step 3: Click on Theme Fonts and enable the option “Font Families”.
Step 4: Click on the arrow to open the dropdown menu and select the font, font style, and font-weight that you would like to use on your site.
Step 5: Click on Add Google Font option.
Step 6: Now navigate to Appearance > Editor.
Step 7: Choose the Styles tab and click on Typography.
Step 8: Click on typography settings for different elements to see the previously added font family in the spectra dashboard.
Step 8: Select the newly added custom/google font and click on the Save option.