Eventually Ticketing
Branding & Customization

Matching your Squarespace fonts in the Eventually widget

The branded Eventually widget loads fonts from synced brand data and, when needed, from curated Google Font families selected in Settings → Brand. Fonts on your Squarespace parent page still do not load into the widget on their own — the widget is a cross-origin iframe — so Eventually injects a server-built @font-face block when brand sync captured a matching face, and can load a supported Google family when no synced face supplies it.

How fonts load in the branded widget

The branded widget render (including the live branded preview on Set up your widget and the embed on your site) can load fonts in these ways:

  • Synced brand web fonts — When brand sync captures matching @font-face data for the heading or body family the widget uses, Eventually injects those rules into the widget HTML before any per-widget custom CSS, so the font family the widget requests can actually load. Host custom CSS can still override the result. A family already supplied this way is not requested again from Google Fonts.

  • Built-in widget fonts — A curated set of Google Font families (such as Poppins, Inter, Roboto, and Montserrat) and web-safe faces. When you select a supported Google family for Headings or Body and brand sync did not already supply that family, the branded widget loads it from Google Fonts automatically — no custom CSS required. Body and heading families share one font stylesheet, and each family is requested only once.

  • No third-party font request — Web-safe fonts (such as Arial or Georgia) and Geist do not contact Google Fonts. Geist is self-hosted in the widget. Unsupported faces with no Google-hosted copy and no matching synced face also make no Google Fonts request.

When a supported Google family does need to load, visitors’ browsers contact fonts.googleapis.com and fonts.gstatic.com. That request is conditional: it happens only for the branded widget and only when the selected family needs a hosted copy. The stylesheet loads without blocking the widget, so an unavailable or blocked Google Fonts host does not prevent the widget from mounting — the widget can still fall back to a system font.

This automatic font loading applies only inside the branded widget iframe. It does not change fonts on the Squarespace parent page.

What you see after brand sync

On first-publish setup and later branded previews, a successful sync can show your pulled colors, logo, and actual fonts in the live widget. The branded preview uses the same widget render path as the embed, so the font experience there matches what visitors see when brand is applied.

The neutral widget preview — the widget as it looks before a brand sync — does not load brand fonts or other branded styling. That unbranded render is also what you get when the widget is requested with ?brand=off.

When a font still falls back to a system font

If the widget cannot load the requested family — for example, the family has no supported hosted copy and no matching synced face (including many Adobe or Squarespace faces), the external font request is unavailable or blocked, malformed font data was skipped, or the face cannot be loaded — it falls back to a system font. That fallback is silent in the widget itself.

Supported Google families selected in Settings → Brand → Typography do not need a matching synced face or custom CSS to paint in the branded widget. They still fall back to a system font if the external request cannot complete.

In Settings → Brand, under Typography, fonts outside the widget’s built-in set still show a notice:

Font Name falls back to a system font in your widget — match it exactly

Expanding the notice reveals a copyable @font-face CSS snippet. Use that path when the branded widget still does not show the exact face you want, or when you want to force an exact match through custom CSS. Paste the snippet into Widget builder → Custom CSS — not Squarespace’s site-wide Custom CSS, which cannot reach inside the widget’s iframe.

Brand settings may still show this notice for fonts outside the built-in set even when a matching synced face is already loading automatically in the branded widget. Check the live branded widget preview first; use the snippet only if the face is still not rendering as expected.

If the snippet is already prefilled

When brand sync captured a matching font file from your site, the snippet includes the real src URL. The instruction reads:

src already points at the font file your site serves — paste as-is:

Click Copy snippet, paste it into the Advanced tab of your widget builder, and save. The widget then loads the font from the same source your Squarespace site uses, including Adobe Fonts kits or Squarespace-hosted font files.

If the snippet has a placeholder URL

When no matching font face is found, the instruction reads:

Point src at your licensed font file:

Replace the placeholder src URL with the actual URL to your licensed font file before pasting it into the widget builder.

Self-hosting the exact font

If the snippet has a placeholder URL, host the .woff2 file on your own server or CDN and update the snippet before pasting it into the widget builder. The widget’s CSS sanitizer allows @font-face rules with https src URLs.

@font-face {
  font-family: "Your Font Name";
  src: url("https://your-site.com/fonts/your-font.woff2") format("woff2");
  font-display: swap;
}

Replace Your Font Name with the exact font family and your-site.com/fonts/your-font.woff2 with the actual URL to your file.

Was this helpful?
Was this helpful?