Google fonts not working in Firefox

  • snaplash
    Asked on September 17, 2014 at 10:31 AM

    Could you have a look and see why my fonts are not working in Firefox please?

     

    http://snaplashwebsite.com/section2.html

  • jedcadorna
    Replied on September 17, 2014 at 11:44 AM

    I was searching online and found this documentation from google https://developers.google.com/fonts/docs/technical_considerations

    Downloading the form source might fix this by including the Web Font Loader that was developed by google https://developers.google.com/fonts/docs/webfont_loader#Example.

  • snaplash
    Replied on September 17, 2014 at 11:56 AM

    I find it strange that jotform would not have a fix for this as you offer the use of google fonts

     

    Am i to believe that jotform users can only expect that fonts will be displayed in chrome?

  • jedcadorna
    Replied on September 17, 2014 at 12:14 PM

    I think the reason why it is not working in firefox because of the new restriction they implemented which is 'Same Domain' restriction that the font must be hosted at the same domain as the web page. 

    If you download your form source and upload your font in your own web server then this might pass firefox restriction. You can read more about the Same-origin policy of firefox here https://developer.mozilla.org/en-US/docs/Web/Security/Same-origin_policy.

  • snaplash
    Replied on September 17, 2014 at 4:29 PM

    http://www.jotform.com/answers/430198-Google-fonts-not-working-in-Firefox#3

  • snaplash
    Replied on September 17, 2014 at 4:30 PM

     

    @font-face {

      font-family: "Emblema One";

      src: url("http://www.sxxx.com/bebasneue_regular-webfont.woff"),

          url("http://www.snxxxx.com/bebasneue_regular-webfont.ttf");

          url("http://www.sxxxx.com/bebasneue_regular-webfont.woff");

          url("http://www.sxxxxxx.com/bebasneue_regular-webfont.svg");

    }

     

     

     

    .form-all, .form-all label, .form-all input, .form-all select, .form-all button, .form-all textarea{

     

    font-family: 'Bebas Neue';

     

    }

  • jonathan
    Replied on September 17, 2014 at 5:32 PM

    Hi,

    Please review the user guide http://www.jotform.com/help/100-Beautify-your-Form-with-Google-Web-Fonts

    If you check the demo  jotform http://form.jotformpro.com/form/30267508766966  

    it actually works even in FF browser

    Google fonts not working in Firefox Image 1 Screenshot 30

    so the caused of issue could probably just a wrong procedure applied to use Google fonts on the jotform

    Here is my demo jotform http://form.jotform.me/form/42596383121455? using a clone of your jotform. It also works on FF.

    Google fonts not working in Firefox Image 2 Screenshot 41

    this the CSS code I used

     

    /*//////////////FONT/////////////////// */.form-all, .form-all label, .form-all input, .form-all select, .form-all button, .form-all textarea{

     

    font-family: 'Emblema One', cursive;

    font-style: normal;

    font-weight: 400;

    }

     

    Please try again by following the user guide.

    Inform us if still not working.

    Thanks.