Upload custom font to your store

Upload font to your theme 

With recent updates from Shopify, you can no longer upload .ttf and .ottf files into a theme anymore. Instead, you can add Font File into the File section in your Shopify Admin.

Step 1: Go to Shopify Admin > Content > File.  Upload your Font File by selecting “Upload file”.

Step 2: The opened window will allow you to select the font file to add. As an example, in this article, we are trying to upload a font called “Yumin”. After having successfully uploaded the file, select the “Link” icon to copy the file link.

Step 3: Go to Online Store > Themes. After that, look for the file “theme.liquid” under the Layout section or via the search bar. Select to open the file.

Step 4: Add the following codes at the bottom of the file.

<style>
@font-face {
  font-family: "FontName";
  src: url("Linkofthefontfile");
}
</style>

Replace the below elements of the code with actual data.

• Font name: the name of the font.
• Linkofthefontfile: the link of the Font File that was previously uploaded. It is copied after you select the Link icon.

Hit “Save” when finished.

Step 5: Look for the file “theme.gem-layout-none.liquid” under the Layout section or via the search bar. Select to open the file.

Next, repeat step 4 within this file.

Add the uploaded custom font to GemPages.

Step 1: From the GemPages Dashboard, open your preferred template to edit. Click on a text-based element (Heading, Text Block, etc.) to reveal the configurations on the left sidebar.

Step 2: Under the Settings tab, look for the Typography > Font section. Click on the dropdown menu and select “Open Font manager”.

Step 4: Enter the exact font name into the field and hit “Add.”

Next, hover over the Font name and click on the + icon to activate the font.

Step 5: Hit “Save.” Your added font will then be displayed in the Font dropdown of the Settings tab.

That’s all! If you have any difficulty taking these actions, please let us know directly via email & live chat to have them answered!