How to Use a Custom Font on Your Signup Form & Referral Page

Import the font

Before you can apply a font to any text in your signup form and/or referral page, you'll need the form to import it first for it to be usable. 

From your Prefinery project dashboard, go to the Integrations > Code Injection. Paste the import code for your font in the Head Code area and click Save. 

For example, let's say you want to add the Roboto font from Google Fonts to your Signup Form - you would paste the following code into the Head Code area:

<link href="https://fonts.googleapis.com/css2?family=Roboto&display=swap" rel="stylesheet">

Apply the font

Now that the font gets imported when your signup form or referral page loaded for the user, you'll want to apply it on any text in your form or referral page by adding some custom CSS. 

To do this for the signup form, navigate to Signup Form and from there click on the CSS tab: 

For the referral page, navigate to Referral Page > Edit > CSS: 

Enter your custom styles in the CSS box. Use the font-family property to apply your font to a given selector. For example, the following CSS will apply the imported font Roboto to the entire Signup Form:

body {
  font-family: 'Roboto', sans-serif;
}

Make sure to Save your changes.