How to Upload Custom Fonts to Your Bubble.io App

[@thoughtsinhardtoreachplace4546]

Very sneaky Gaby - I loved option 2 👌

[@Juliana-cx7qq]

Thank you so much. Easy and concise. Those are the best videos

[@coachingnocodeapps]

You're welcome, Juliana!

[@joemontero741]

I'm currently learning the ins-out of bubble and your channel is really good. Do you guys have a video that shows how to build a portfolio website and how to set up case study projects with rich text editor, etc?

[@coachingnocodeapps]

Hey Joe! We don't have one specific video covering all the functionality you're needing, but I'd suggest checking out our resources here: coachingnocodeapps.com/resources. There's a ton of training available!

[@predictaog8763]

1) When external URL is used, make sure to open URL in the browser first to ensure font-family name matches what you type in the Add font field in Bubble. 2) In the font code ('INSERT FILE RULE) must be taken in single quotes on both sides as follows ('INSERT FILE RULE')

[@pratyakshm]

you're a genius. thank you!

[@coachingnocodeapps]

You're welcome! 🙏👊

[@georgemontgomery6825]

Great job, thanks for the help!

[@coachingnocodeapps]

You're welcome, Tom!

[@DrTees]

Didn't work..... Mine is a .otf file.... Wondering if that was why

[@jxe79]

How to do this on Macbook? It did not work with me at all, when i tried to upload it says invalid :(

[@flurinjenal374]

Make sure that the "Font name" field in the bubble settings cointains the same value as the font-family value in the css file is.

[@thinusenslin]

I also noticed that spaces and special characters makes the upload of the font fail eg Handwriting-Helvetia. Just stick to a single name.

[@AmyAliExposed]

How can I get the code copy? I don’t see it in the description as mentioned. I followed all these steps and the font uploaded to Bubble but the style didn’t convert. Maybe I didn’t type the html code correctly?

[@coachingnocodeapps]

Hey Amy! Here's the code: @font-face { font-family: 'INSERT FONT NAME' ; src: url('INSERT FILE URL); }

[@BronzeBoxer_]

@@coachingnocodeapps If you look at the third line of that code, there is no apostrophe after the "INSERT FILE URL" part. Is there supposed to be one? In the video, you have an apostrophe after that, so I'm assuming there's supposed to be one. Thanks.

[@flurinjenal374]

Doesn't work.

[@flurinjenal374]

Got it: Make sure that the "Font name" field in the bubble settings cointains the same value as the font-family value in the css file is.

[@coachingnocodeapps]

Glad you found where you needed to make a fix 👍