- Published
- Byline
- GoHighLevel Partners Editorial
- Filed under
- GoHighLevel Automation
The upload is easy; the licence, the weights and what the page shows while the font downloads are where the work is.
Upload custom font builder: getting a brand typeface onto a live page
A client hands over a brand guide naming a typeface, and the page builder’s font list does not contain it. Uploading the font is usually straightforward. What surrounds the upload — the licence, the file formats, which weights you actually need, and what the page does while the font is still downloading — is where the work is, and where a page that looked right in the builder ends up looking wrong for the first second of every visit.
Start with the licence, because it is the one that cannot be fixed later
A font licence for print or for desktop use does not automatically permit embedding on a website. Web embedding is generally a separate grant, often priced on page views, and it is the client’s licence rather than yours even though you are the one uploading the file. Ask for the licence document rather than the font file, read what it covers, and keep a copy with the project.
This matters more for an agency than for a business doing its own site, because you are installing the same font across client sites and a single misreading repeats. If the licence is unclear or missing, the honest options are to obtain one or to choose an openly licensed typeface with a similar feel — not to upload it and hope.
Which files to upload
| Format | Where it stands | Do you need it |
|---|---|---|
| WOFF2 | The compressed web format supported by current browsers | Yes — this is the one that matters |
| WOFF | The older web format | Only if you support genuinely old browsers |
| TTF / OTF | Desktop formats, much larger files | Avoid on the web; convert instead |
| EOT / SVG font | Long obsolete | No |
If you have been given a desktop file, convert it to WOFF2 rather than uploading it as it is — the size difference is substantial and it is paid on every visit. Check the licence permits conversion first; most web licences do, some do not.
Weights and styles are separate files, and this is where bloat starts
Each weight and each italic is its own file. A family with nine weights in roman and italic is eighteen downloads if you upload all of them, and a typical site uses three or four. Decide the set before uploading: usually a regular, a bold, one heavier weight for headings if the design calls for it, and an italic only if the copy actually uses one.
Uploading a weight you do not use costs nothing directly, since an unused file is not downloaded — but it invites use, and the next person editing the site will reach for it. Keeping the list short is a design decision as much as a performance one.
Beware synthesised styles. If bold is not uploaded, a browser will manufacture one by thickening the regular, and the result is heavier and cruder than the real bold of the same family. It looks approximately right, which is why it survives review, and noticeably wrong beside a properly cut weight.
The fallback stack decides what the first second looks like
A custom font is downloaded, and until it arrives the browser shows something else or shows nothing. Both behaviours are visible: text that appears in a default face and then reflows, or a gap where the text should be. Neither is a fault to be eliminated so much as a trade-off to be chosen.
Name a fallback whose proportions are close to the real font, so the reflow when it swaps is small. A narrow custom face falling back to a wide default produces a visible jump in the layout, which is the version people notice. Where the header is involved this compounds, because a reusable header and footer means the same swap happens at the top of every page.
Where the upload goes, and where the CSS goes
Most builders offer a place to add a font at brand or site level, which is the right one to use: the font then appears in the picker and applies wherever it is selected. The alternative is declaring it yourself through code placed in the page header, which works and is worth understanding, but leaves the font invisible to the picker and to anyone editing the site after you.
Two practical points about the manual route. Serve the font file over the same secure protocol as the page, or the browser will refuse it and you will see the symptoms of a not-secure warning without the obvious cause. And put the declaration site-wide rather than on one page, or the font will apply on the page you tested and not on the others — which is the same class of problem as moving pages into a website container produces when head code is per-page.
What it costs
Font files are among the larger things a page downloads, and unlike an image they block text from appearing in its final form. a page speed score reflects this directly. lazy loading images does not help, because fonts are needed for the first visible text rather than for content further down.
The reductions worth making are: fewer weights, WOFF2 only, and — where the font supports it — subsetting to the characters the site actually uses. A face carrying several alphabets is carrying most of them for nothing on an English-language site.
Check it where type actually breaks
A typeface that reads well in a wide desktop heading can be unusable at a narrow width. Confirm the type after row and column width settings are settled rather than before, check how a phone stacks columns for anything set in a display weight, and look at what the tablet view inherits, where headings often sit at an awkward intermediate size.
Then bank the result. A header and a set of type styles that work belong in saving a section to the library so the next page starts from them, and in the starting template if the same brand has more sites coming — a funnel template import is how that travels. On commercial pages, check the font renders legibly at small sizes too: a product detail page carries prices and specifications in the smallest type on the site, and a display face that is charming at heading size can be genuinely hard to read there.
Frequently Asked Questions
Can I upload any font file I own?
Owning a font file is not the same as holding a web embedding licence. Desktop and print licences frequently exclude web use, which is usually a separate grant priced on traffic. Ask the client for the licence document rather than the file, and keep a copy with the project.
Which font format should I upload?
WOFF2 in almost every case. It is the compressed web format that current browsers support, and it is considerably smaller than a desktop TTF or OTF of the same face. Convert desktop files rather than uploading them directly, after confirming the licence permits conversion.
Do I need to upload every weight in the family?
No, and you should not. Each weight and italic is a separate file, and most sites use three or four. Upload the ones the design actually uses — an unused weight is not downloaded, but it invites use by whoever edits the site next.
Why does my bold text look wrong?
If the bold weight was not uploaded, the browser manufactures one by thickening the regular. The result is heavier and cruder than the real cut and looks approximately right, which is why it passes review and then reads badly beside properly drawn type.
Why does the text flicker or shift when the page loads?
Because the browser shows a fallback while the custom font downloads and then swaps. Choose a fallback whose proportions are close to the real face so the shift is small. A narrow custom font falling back to a wide default produces the visible jump people complain about.
The font works on one page but not the others. Why?
Almost always because the declaration was added to a single page’s header rather than site-wide. Use the builder’s brand or site-level font setting where one exists, since it applies everywhere and puts the font in the picker for whoever edits next.
How much does a custom font slow a page down?
Enough to be worth managing, because font files are large and they block text from appearing in final form rather than merely loading later. Fewer weights, WOFF2 only, and subsetting to the characters the site uses are the three reductions that make a measurable difference.
We build your GoHighLevel account for you
CRM, pipelines, funnels, SMS and automation — configured for your business, not left for you to figure out.
- Setup (one-time)$850
- Ongoing (per month)$38.80
No obligation quote · reply within 1 business day
This site is independently operated and is not officially affiliated with, endorsed by, or sponsored by HighLevel LLC. We do not receive referral commissions — this is our own flat-fee implementation service.