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 my own font?

    Asked by TessaMeier on April 22, 2011 at 02:13 PM

    According to past forum responses, to add my own font I need to click on "setup and share." My form only offers "setup and embed." I don't understand how to add my own font to the form or even how to find a font's source code. I want to change the standard font for the whole page to say "Androgyne." Can someone help? Thanks!

    source inject css custom font
  • Profile Image
    JotForm Support

    Answered by NeilVicente on April 22, 2011 at 03:21 PM

    Hi,

    I apologize as our user guides have not been updated lately. It used to be setup and share and not setup and embed. Anyway,the easiest way to change fonts is to:

    1.  Go to Form Style tab

    2.  Click Font button

    3.  Choose font

    It is not advisable to use any font that is not considered as web-safe, because your visitor needs to have the font you specified installed in their system. If it is not available, the page will revert to the default web-safe font in their browser.

    If you insist on using a custom font for your form, inject this custom css in your form:

    .form-all {
        font-familyVerdana;
    }

    Replace Verdana with any font you'd like.

    To learn how to Inject Custom CSS, refer to this user guide.

    To learn about web safe fonts, click here

     

    Hope you find this post useful. Let us know if you have other questions.

  • Profile Image

    Answered by ninjas4christ on September 30, 2011 at 05:58 PM

    Hi, 

    I have a question related to this.  I'm attempting to use a custom font with the css injection, but when I use @font-family to refrence to the font, it replaces the @ with //.  Any ideas?

    Thanks!

  • Profile Image
    JotForm Support

    Answered by idarktech on October 01, 2011 at 03:28 AM

    Hi there,

     

    As I have just checked you can't do that in CSS Injection not even in Downloaded CSS File, it wouldn't work, But you can embed font by adding that in your html file inside < head >  tag, which means you have to download the source code of your form, and upload it in your host.

    Also I would encourage you to use google webfonts to embed fonts easier. Here's my working form with lobster font.

    And here's a small guide from Google

    Let us know if you have more questions or clarifications with regards to this matter.

     

    Regards,

    idarktech

  • Profile Image
    JotForm Support

    Answered by NeilVicente on October 01, 2011 at 05:31 AM

    @ninjas4christ

    May I see the exact code that you're trying to inject in your form? What exactly is the reason why you're using @ in the font-family property of your css code? In my example above, the @ character is not needed at all.

    Did you try to follow the instructions I posted in my previous response to this thread?

    I'll be awaiting your feedback so we can solve our issue once and for all. Thank you very much for using JotForm!


    Neil