What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    Add Font "Advent Pro" and Use it in Form

    Asked by russbanner on February 05, 2015 at 06: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

     

    all and My Forms form designer font css code
  • Profile Image
    JotForm Support

    Answered by Charlie on February 05, 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.

     

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

    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';

    }

     

    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.