Can I change the font type for my form?

  • Profile Image
    Tono86
    Asked on August 16, 2017 at 06:31 PM

    I need to use a specific type of font named "permapetit" I want to know if is it posible to use it on my form...

  • Profile Image
    aubreybourke
    Answered on August 16, 2017 at 06:35 PM

    Yes its possible to use custom fonts. You will need your font to be online. You can use either Google fonts or you can use the @font-face rule. Both of these techniques are described in this guide:

    How to Use Google Fonts in your Form 

  • Profile Image
    Tono86
    Answered on August 21, 2017 at 01:57 PM

    Thank you. I've already tried using the @font-face rule:

    font-face {
        font-family : 'tono', ParmaPetitOutline;
        font-style : normal;
        font-weight : normal;
        src : url('ParmaPetitOutline.ttf')  format('truetype');
    }

    .form-all, .form-all label, .form-all input, .form-all select, .form-all button, textarea, .form-header, .form-line, .form-input-wideif-required div, .form-textbox, .form-dropdown, .form-all matrix-row-headers, .form-all form-radio-item label, .form-label.form-label-top, .form-all undefined strong, .form-all .form-pagebreak-back, .form-all .form-pagebreak-next {
        font-family : 'tono', ParmaPetitOutline;
        font-weight : normal;
        font-size : 16px;
        font-weight : normal;
    }

    Unfortunately the font only changes when I open the form in my laptop, if anybody else opens the form in another device (laptop, mobile)  the font stays as the chosen before the application of the rule. please help!

  • Profile Image
    AIDAN
    Answered on August 21, 2017 at 02:41 PM

    Please note that the source URL you have for your font is url('ParmaPetitOutline.ttf') and that can be skipped if the device that is rendering your page does not have the font in question, which would explain why this works only for your machine.

    Please consider my colleague Aubrey's suggestion of using one of the similar fonts that are available through Google Fonts, with the guide provided, as that would allow all the devices and environments to download the font and render your form correctly.

    Here is our guide on how to use Google Fonts in your form again, for your convenience: https://www.jotform.com/help/100-How-to-Use-Google-Fonts-in-your-Form

    I hope this helps. If you need further assistance please let us know. Thank you.