Add Font "Advent Pro" and Use it in Form

  • russbanner
    Asked on February 5, 2015 at 6:06 AM

    I want all my forms on my website to match in font for me that is advent pro. But you don't use this on your form designer. Can you add advent pro font to your form designer?. I tried to copy the css code from google to add in the css code but not successfully. is there a work around to do this, so i dont have to either keep putting in new lines etc.

    thanks

    Russ

     

  • Charlie
    Replied on February 5, 2015 at 10:02 AM

    Hi,

    You can actually use fonts from Google Web Fonts to design your form in JotForm.

    Here's a guide: http://www.jotform.com/help/100-Beautify-your-Form-with-Google-Web-Fonts.

    For the meantime, you can also check this quick guide:

    1. Here's the Google Font page for Advent Pro: http://www.google.com/fonts#UsePlace:use/Collection:Advent+Pro

    2. In that page, scroll down and get the link found in the @import tab.

    Add Font Advent Pro and Use it in Form Image 1 Screenshot 40

     

    3. Get the link and open it in a browser.

    Add Font Advent Pro and Use it in Form Image 2 Screenshot 51

    4. Copy the code and that will be the CSS code that you will use.

    5. Inside the Form Designer, paste the code under the CSS tab. The "Advent Pro" font is now available to be use. To make all the fields to use that field, I will use this custom CSS declaration then:

    .form-all {

    font-family: 'Advent Pro';

    }

    Add Font Advent Pro and Use it in Form Image 3 Screenshot 62

     

    6. I've cloned your form for testing purposes, here's the edited one that I have: http://form.jotformpro.com/form/50353723941958. Please do take note to remove other codes that might be a conflict.

    I hope this helps. Do let us know if you need more information on this.

    Thank you.