Essentials
Fonts
Guide to customizing fonts in SaasCart using Google Fonts
How to Change Fonts?
To customize fonts in the SaasCart template and use Google Fonts, follow these steps:
-
Visit Google Fonts: Go to the Google Fonts website.
-
Choose Your Fonts:
- Use the filters on the left to browse and select fonts you like.
- Click the ⊕ button next to each font you want to use.
-
Get the Font Embed Code:
- After selecting your fonts, a “Families Selected” bar will appear at the bottom of the page.
- Click this bar to see the HTML embed code.
- Copy the provided HTML
<link>
code.
-
Add Font Embed Code to HTML:
- Paste the
<link>
code into the<head>
section of yourindex.html
file, located in thesrc
directory. - Place it above any other CSS or font links to ensure the font is loaded properly.
- Paste the
-
Add Font CSS Declarations:
- On the Google Fonts page, you’ll also see CSS declarations for your chosen fonts.
- Copy the CSS rules provided (e.g.,
font-family: 'Roboto', sans-serif;
). - Add these declarations to your CSS to apply the custom fonts to your site.
Following these steps will allow you to easily change fonts in your SaasCart template using Google Fonts for a fully customized appearance.