Custom Fonts in the Site Builder

Follow these steps to learn how to customize the font in your funnel or website, using a few different methods.

Available Default Custom Fonts in Sites

You can use four elements within funnels for text with different styles.

• Navigate to Sites on the left → Funnels/Websites at the top → Edit the desired page or funnel step.

• Add sections, rows, and elements to your preference
• Click on an element to highlight it and modify the text with the menu at the top
• Navigate to the “Menu” at the top of the builder.
• Click on Typography.

• Choose the native Headline and Content fonts that will be used throughout the funnel.

• Click on a specific element to modify the text typography.
• Choose a font family.
• Choose a Google Font.

Custom Fonts in the Site Builder Using CSS

If you have the expertise, using custom CSS allows you to completely customize the funnel/website beyond standard options. CSS, or Cascading Style Sheets, is the technology used by most websites to create visually engaging web pages, including aspects such as the layout, colors, and fonts.

Please Note: You may need to reach out to a developer for assistance if you don’t have the expertise.

Method 1: Add code

• Navigate to the funnel builder and edit the funnel.
• Click on Custom CSS from top Menu > Tracking code and use code similar to this method:

Method 2: Using the CSS selector

You can uniquely modify a specific element by using the CSS selector instead

Method 3: Importing with CSS/HTML

You can use the CSS @import rule or the HTML <link> tag. 

To make use of HTML in the Site Builder use the “Code element”

FAQ’s

1. What font options are available in the builder by default?

By default, you can select different fonts for headlines and content throughout your funnel or website. The builder provides access to a variety of Google Fonts and font families.

2. Can I use custom fonts in my funnel or website?

Yes, you can use custom fonts by adding custom CSS to your funnel or website. This requires knowledge of CSS, and you can use the CSS @import rule or the HTML <link> tag to include custom fonts.

3. What is CSS, and why would I use it to customize fonts?

CSS (Cascading Style Sheets) is a language used to control the visual appearance of web pages, including layout, colors, and fonts. By using CSS, you can fully customize the fonts and styles on your site beyond the standard options provided by the builder.

4. How do I add custom CSS to my funnel or website?

To add custom CSS:

1. Navigate to the funnel builder and edit the funnel.
2. Click on Custom CSS from the top menu, then select Tracking code.
3. Add your CSS code to customize the font or other styles.

5. What is the CSS selector method, and how do I use it?

The CSS selector method allows you to target and modify specific elements on your site. By using the appropriate CSS selectors, you can apply custom styles to individual elements. This is useful for making unique adjustments to particular parts of your page.

6. Can I import fonts using CSS or HTML in the builder?

Yes, you can import fonts using the CSS @import rule or the HTML <link> tag. To do this in the Site Builder, use the “Code element” to add the necessary HTML or CSS code.

7. Do I need a developer to help with custom fonts?

If you are not familiar with CSS or HTML, it may be helpful to reach out to a developer for assistance with adding custom fonts or making advanced customizations to your funnel or website.