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

    How to apply Google fonts on my form

    Asked by mpt512 on October 10, 2014 at 09:56 AM

    I must be retarded because I cannot get this to work, any chance you all could a look at my code and see what the problem is?

    @font-face {

    font-family: 'Jura';

    font-style: normal;

    font-weight: 600;

    src: local('Jura DemiBold'), local('Jura-DemiBold'), url(http://fonts.gstatic.com/s/jura/v7/jylivVcL1U8Es-mK45GQHvY6323mHUZFJMgTvxaG2iE.woff2) format('woff2');

    }

    .form-all, .form-all label, .form-all input, .form-all select, .form-all button, .form-all textarea{font-family: 'Jura', normal;}

    Also, is this supposed to appear in the drop down box as a selectable font or is it just suppposed to be there whenever I type? I'm really confused right now.



    This is a re-post of a comment on How to Use Google Fonts in your Form

    textarea style label google fonts @font-face input dropdown using google fonts font-family
  • Profile Image
    JotForm Support

    Answered by Jan on October 10, 2014 at 10:24 AM

    Hi mpt512,

    Can you share the URL of your form? 

    I can see that the CSS code that you posted are correct. Please be reminded that the font will be applied once you click "Preview" or opening the actual form in a new tab or window. It will not appear on the editor. Please check the screenshot below.

    Hope this helps. Thank you.

  • Profile Image
    JotForm Support

    Answered by Jan on October 10, 2014 at 10:33 AM

    Just to answer this question.

    Is this supposed to appear in the drop down box as a selectable font or is it just supposed to be there whenever I type?

    Yes it will be applied on the elements that you wanted. 

    .form-all, .form-all label, .form-all input, .form-all select, .form-all button, .form-all textarea{font-family: 'Jura', normal;}

    On the css code above, it is stated that the buttons, text-area, inputs and select should use the font-family: Jura.

     

    Hope this helps. Thank you.

  • Profile Image

    Answered by mpt512 on October 10, 2014 at 08:08 PM

    Ok, so it works in the preview and it works when I post a direct link, like the following: http://form.jotform.us/form/42827881473162

     

    But when I embed it into a lightbox for squarespace it popups and everything is fine, but the font reverts back to some comic sans crap, what do I do?
  • Profile Image
    JotForm Support

    Answered by Jan on October 10, 2014 at 09:29 PM

    I created a separate thread for the other issue. http://www.jotform.com/answers/441558

    We will reply to that thread. Thank you for understanding.