Using Google Fonts in the Classic Builder


Google Fonts provide you with a massive selection of fonts to use for your landing page for free! Unbounce has streamlined the process for you by allowing you to select Google Fonts directly from the Unbounce Builder.

Read on below to find out how to select and add a Google Font in the Classic Builder.

  1. In the Unbounce builder, double-click on the text block you’d like to change to a Google Font.
  2. In the Properties tab on the right side of the Builder, select the Style tab.
  3. Expand the Family drop-down menu and select Add/Remove Font. A new dialog box will appear:google_fonts_drop_down_menu.png
  4. Find the font family you'd like to add (by browsing or using the search function) and click the + button in the top right corner of the font square.
    • Alternately, if you know the name of the font you’d like to add you can use the search bar in the top left corner of the dialog box. You can select and add multiple fonts at the same time.
  5. Click the Done button at the bottom right corner of the dialog box once you’ve selected your font(s).   google_fonts_add_.png
  6. Your newly selected fonts will now appear under the same Family drop-down menu for use on your landing page.

If you’ve added a font by mistake you can remove the font by clicking on the top right corner of the font square again. Fonts that you’re adding will have a green checkmark, and fonts you’re removing will have a red minus sign.google_fonts_remove.png

Pro Tip:

If you would like to use a Google Font on more than one page, you’ll need to repeat these steps for each landing page individually, as added fonts will not sync between pages. Or, you can embed a custom Google font across all your pages using Script Manager

Related Articles

Using Custom Bespoke Fonts and @font-face

Applying a Custom Google Font Across Your Landing Pages

Using Adobe Fonts on Your Landing Pages

Applying a Custom Google Font Across Your Landing Pages 

Do you agree or disagree with this statement: This article helped me find the information I needed quickly and easily.

Select an option and leave us some feedback in the comments:

Strongly DisagreeDisagreeSomewhat DisagreeUndecidedSomewhat AgreeAgreeStrongly Agree

Measuring Customer Effort Score with Nicereply