Adding custom fonts allows you to stand out and create a unique brand identity. This can enhance the user experience, boosting the likelihood of conversions.
The right typography enhances readability, keeping visitors engaged and immersed in your message - leaving a lasting impression on your audience and elevating your online presence.
To add a custom font, you must first upload the font file and then direct the site to use the file.
How to Upload a Font File
STEP 1
From the Shopify admin, click on Content.
STEP 2
Click on Files.
STEP 3
Click on Upload Files and select the font file.
STEP 4
Click on the link icon to copy the file link.
How to Use the Custom Font
STEP 1
From the Shopify admin, under Online Store and click on Themes.
STEP 2
Click on the Ellipsis (Actions).
STEP 3
Click on Edit Code.
STEP 4
Search and open the file "theme.scss.liquid".
STEP 5
Add the code below, replacing highlighted elements of the code with actual data.
@font-face { font-family: "FONTNAME"; src: url("ADDLINKHERE") format("woff"), url("ADDLINKHERE") format("woff2"); }Once the font has been configured correctly, you change the CSS styles to change specific parts of your store to the font, for example.
p{ font-family:FONTNAME; }This code will change all paragraphs to your uploaded font.