Upload Custom Fonts
Last updated
Last updated
With some custom code you can add your own fonts to our themes. These fonts will not appear in the theme editor as a dropdown option, but instead override the values directly in the stylesheet.
Upload your custom font files to Font Squirrel with this tool. TTF file types have the best success. Then click the Download your kit button to get a zip file with the required files.
The first thing that we have to do is to add the fonts to the Shopify store. From there, we can reference it via code and use it in our theme.
From your Shopify admin, navigate to Settings > Files > Upload file.
Under snippets, click on “Add a new snippet” and create a snippet named: custom-fonts
This is the code we will use:
1. the code above has to be modified to work with your font.
“fontname” = exact name of the font you add.
“fonturl-” = link to the respective font file. So, if your font file has .woff and .woff2, replace them accordingly on the code above.
In our case, it would look like this:
4. Finally, in the custom-fonts snippet that we created, add the following code before the </style> line. Don’t forget to also rename “Poppins” to whichever font name you’re using:
Look for an open theme.liquid inside your snippets folder. Find the: </body> tag, and add the following code: