Skip to main content

Add custom fonts to landing pages

You can personalise your landing pages by adding custom fonts to the Polytag landing page builder. Here's a step-by-step guide to help you import fonts from Google Fonts or Adobe Fonts.

Step 1: Open the Styling Options

  1. Navigate to one of your product pages in the QR Squared builder.

  2. Open the Settings tab on the right-hand side.

  3. Open the Custom Fonts expander.


Step 2A: Adding Fonts from Google Fonts

1. Import Fonts from Google Fonts

  • In the Custom Fonts section, click Import Fonts and select Google.

2. Choose Fonts from Google Fonts

  • Browse and select the font(s) you'd like to use. You can select one or multiple fonts.

3. Copy the Embed Code

  • After selecting your fonts, click the Get Embed Code button.

  • Copy the first piece of text from the embed code. This is the code for the <head> section of your HTML.

4. Paste the Embed Code into QR Squared

  • Return to the product page builder in QR Squared.

  • Paste the copied embed code into the Custom Fonts input field.

  • Click Import Fonts.


Step 2B: Adding Fonts from Adobe Fonts (Typekit)

1. Import Fonts from Adobe Fonts

2. Set Up Your Web Project

  • Find the fonts you'd like to use and add them to a Web Project.

  • In the top-right corner, click Manage Fonts > Web Projects.

  • Copy the embed code for your Web Project to your clipboard.

3. Paste the Embed Code into QR Squared

  • Return to the product page builder in QR Squared.

  • Paste the embed code into the Custom Fonts input field.

  • Click Import Fonts.


Step 3: Using Your Imported Fonts

Once you've added your custom fonts, you can use them in the following ways:

  1. Advanced Styling for Each Block:

    • Access advanced styling by clicking the three-dot overflow menu on a specific block (see green square in below image).

    • This will apply the font to only that module in the product page.

  2. Add from Themes tab:

    • To apply the custom font to the theme of your entire product page (ie to the applied throughout the product page) you can do this by opening the Themes tab on the right side of the page (blue square in image 1).

    • Select Font or Typography to apply the custom fonts to headings and paragraphs.


And That's It!

Your custom fonts are now ready to use in the QR Squared product page builder – across all your prodyct pages. If you need further assistance, refer back to this guide anytime!

You can delete any imported fonts from the Styling menu. When a font is deleted, any content that is displaying with that font will revert back to the product page’s default font.

Did this answer your question?