Adding Custom Fonts

Please note, the UI has changed a bit since the recording of these videos. Instead of the builder settings appearing on the left hand side, they will show on the right side in the funnel/website builder now.

Converting Custom Font Files:


Importing Custom Fonts - Template CSS Code (Regardless Of Where File Is Hosted):

@font-face {
  font-family: FONTNAME;
  src: url('YOURFONTURL') format('woff2');}

.LABEL {
  font-family: 'FONTNAME' !important;
  font-weight: normal;
  font-style: normal;}

The videos below show how to upload your font file, and fill out the CSS template above with the correct details to use your custom font file in FG Funnels.



Hosting Font In FGF Membership Area Tutorial:

Example Of Importing Font Hosted in FGF Membership Area - CSS Code Filled Out:

@font-face {
    font-family: reey;
    src: url('https://firebasestorage.googleapis.com/v0/b/highlevel-backend.appspot.com/o/memberships%reallylongstringoflettersnumbersymbols-Reey-Regular.woff2?alt=media&token=reallylongstringoflettersnumbersymbols') format('woff2');}

.reey {
  font-family: 'reey' !important;
  font-weight: normal;
  font-style: normal;
}

Hosting Font In Dropbox Tutorial:

Example Of Importing Font Hosted in Dropbox - CSS Code Filled Out:

@font-face {
  font-family: GotchaRegular;
  src: url(https://dl.dropbox.com/s/stringofnumbersandletters/GotchaRegular.woff2?dl=1) format('woff2');}

.gotcha {font-family: 'GotchaRegular' !important;
  font-weight: normal;
  font-style: normal;}