Is there anyway to change fonts on headers, footers, and page blocks?

Greetings,

I’ve successfully downloaded canvas and so far the system is working perfect on bubble.io. I’ve recently updated the logos and have started the process of updating the sites fonts to fit the new logo and scheme better, however there are a few problems I have run into:

  1. Almost all page blocks, headers and footers have not changed since completely updating my styles tab in the editor
  2. I’ve found no way to change this one static font used around the site “inter” besides from the styles tab, but as mentioned, not all elements are effected.

After doing some searching I found a header element within the header where an HTML ID was used, so I decided to implement my own STYLE instead of an ID but could not fully replicate what the header was supposed to look like.

My attempt:

Does anyone know of a way to use your own font using HTML or through an easier means? If not, is there any word of an update?

Thank you,
Andrew Sheron

Hi @effluence ,

I’m glad to hear that your experience with Canvas has been good so far. Your are correct in that the marketing pages, header, and footer are not linked to the Bubble styles.

To update the font of the header and footer, you would need to do the following:

  • In your app editor, go to the Settings tab > SEO / meta tags > Script / meta tags in header. Replace font-family with the name of the font that you want to use. Please note that only google fonts would work here so make sure that your font is supported.

  • Go to the Data tab > App data > Website object > App-wide HTML header and replace the font-family with the font of your choice. This should be done in both the development and live databases.

  • Once you’ve implemented these updates, press command + shift + r to perform a hard refresh. You’ll find that the header and footer fonts have been updated.

Unfortunately, for marketing pages and blocks, we currently do not support different fonts. As an alternative, you could use marketing page templates built with Bubble elements.

1 Like