Forum Academy Marketplace Showcase Pricing Features

Is it possible to add Typography.com fonts to Bubble?

We’re a design company so we’re pretty particular about having consistent branding across the site. We use the Whitney font and are wondering if it’s possible to get the web fonts in the site. Has anyone done this? Typography.com is a little unconventional with how their forms work.

Have you seen this post:

3 Likes

No I missed that. It looks like that will work though for us. Thanks!

Great!

I’m also having trouble doing this. Typography.com is fairly hard to set up regularly. Although the custom fonts feature allows you to add a font stylesheet, I’m not sure the font family gets referenced properly. When using CSS on a regular website you refer to the font by using:

h1 {
font-family: “Whitney A”, “Whitney B”;
font-style: normal;
font-weight: 600;
}

It shows two items in the font family and I’m not sure what they do on the typography.com ends of things but it isn’t showing up on the app.

If anyone knows how to get these fonts into the app or if the devs know how to implement it that would be great!

Thanks for any help!

Can you try to do it, with the relevant CSS file in an open app, so that other users can jump in.

Emmanuel I’m currently trying to figure out how to make an open app. Is there an easy way to do this or a simple tutorial to follow?

There’s an open forum app that you could use. Just add a new page to it and then upload the css file in the settings tab like you did on your app.

1 Like

Chris,

Thanks for jumping in here. I tried this out but it doesn’t seem to be working right.

The issue that @isaac and I are having is that the css folder has to be in a certain position within the website. This is for security purposes where Typography.com won’t let the fonts load otherwise. Here are the exact instructions:

Then here is what the whole folder looks like to give you some reference of what we’re dealing with.

Based on this info, do you still suggest the same advice?

Thanks,

David

Ah, I see what you’re saying now. It has me rather stumped, to be honest. Based on the screen shot it looks like it’s possible to change the location where they are stored, so I would imagine that you can upload them to the test app and then change the location later to your actual application’s domain name.

@david @isaac

Did anyone figure this out by chance? I have my Typography.com fonts in Production and on my AWS server. I’ve got no clue (and neither does Hoefler & Co. after my call with them) on how to add each font weight separately into Bubble.

I’ve already tried using @font-face in the HTML header with the provided CSS key. Personally, I don’t know how to use each font throughout the website with HTML. I wish this was plug and play…

Anyone?