How to add custom font in PageFly

In this article, you’ll learn how to use Uploaded fonts manager to add custom fonts and apply them to your PageFly page.

Please note that you can use all Google Fonts in PageFly without uploading them in Uploaded fonts manager! You can see and apply all Google Fonts here:

About Uploaded Fonts ManagerClick to copy

The Uploaded Fonts Manager is a feature that allows you to upload and manage your desired fonts but Google fonts don’t have.

There are 4 supported formats: TTF, OTF, WOFF, WOFF2

After you upload custom fonts, all fonts will be automatically converted to WOFF2 format to optimize the page performance in the Live view.

IMPORTANT NOTE:Click to copy

If you are in the Shopify Trial Plan, you can’t upload your fonts in the Uploaded Fonts Manager due to the Shopify’s file format requirement. Please check this article to learn more about this policy.

Access Uploaded Fonts ManagerClick to copy

To access this feature, go to Settings in the PageFly dashboard > click on Uploaded Fonts Manager here.

custom font

How to upload custom fonts?Click to copy

After accessing the Uploaded Fonts Manager, click the Upload new fonts button to start adding your fonts.

custom font

How to use custom fonts in PageFly?Click to copy

After adding custom fonts in the Uploaded Fonts Manager, please go to Global Styling .

Here you can select your common use fonts for the Font Family parameter:

 Step 1: Click on the Font type > Go to Styling tab

Step 2: Hit the Setting icon on the right 

Step 3: Click Uploaded fonts in the popup > Select fonts that you want > hit Select button

custom font

Step 4: Then click on the dropdown menu to select the fonts for each Font Family type

custom font

Finally, don’t forget to hit the Publish button on the top right!

custom font

Then get back to the editor page > choose the Global Styling option to apply the new fonts.

custom font

Frequently asked questionsClick to copy

  • After uploading, can I use the custom font directly in the editor page and not use the Global Styling?

Answer: No, you must add the custom font in Global Styling feature then apply in the editor page.

custom font

  • Can I use custom code to add new fonts?

Answer: Yes, but we are not suggesting that you do it.  

  • I have used custom code to add a font before, should I delete the code first then upload the font in the Uploaded Fonts Manager?

Answer: Yes, you should delete the code then upload the font in the Uploaded Fonts Manager and continue to use it as normal. 

  • If I delete a custom font that is used in a page, will it affect the Live page?

Answer: No, if you delete the custom font, elements have been applied the font will show with the font of its container. You can learn more about it here.

Halloween is right around the corner! Let’s make your store ready for this holiday!

Thank you for your feedback!

Navigate this category

Could not find the answer
to your question?

Chat with us
PageFly Languagues

PageFly Help Center is now available in Chinese. Please check the flags on the page header.

I got it!
Join PageFly Facebook Group to get Bearie Coin JOIN US NOW