Why are the fonts I'm using in CSS working on the advanced design, but not in preview or on the actual form?

  • uhmasalud
    Asked on November 15, 2017 at 11:27 AM

    Hi!

    The Google fonts Roboto and Open Sans are working properly while I'm building the form and when I view it under the designer, but once I preview the form or export the JS to my actual page, the fonts are substituted.

    ¿How do I fix this?

    Jotform Thread 1299510 Screenshot
  • Nik_C
    Replied on November 15, 2017 at 12:19 PM

    I checked your form and you set Roboto font, but you're calling Roboto condensed:


    @import url('https://fonts.googleapis.com/css?family=Open+Sans|Roboto');


    h2 {

        margin-top : 0;

        color : #00928f;

        font-family : "Roboto Condensed",sans-serif;


    If you want to use Roboto Condensed, then this should be the CSS:

    @import url('https://fonts.googleapis.com/css?family=Roboto+Condensed');

    And you should call it:

    font-family: 'Roboto Condensed', sans-serif;

    1510766362Screen Shot 2017 11 15 at 6 Screenshot 10

    Please try and let us know how it worked.

    Thank you!

  • uhmasalud
    Replied on November 15, 2017 at 2:24 PM

    Hi Nik, Thank you for your reply. Unfortunately, I tried your solution and it doesn't work. What puzzles me is that when I switch from the form's build mode to the preview mode, the fonts change.

     1510773858Pantalla completa 15 11 17 13  Screenshot 10


    1510773801Pantalla completa 15 11 17 13  Screenshot 21

  • jonathan
    Replied on November 15, 2017 at 3:28 PM

    I reviewed your form but I found that it is not using the Roboto+Condensed font-style at this time.

    1510777700zzz 2017 11 16 04 Screenshot 10

    I am not sure if you have updated and saved the changes in your Advanced Designer. Please check again and redo as suggested by my colleague.

    Let us know if still not resolved.

    Thanks.

  • jonathan
    Replied on November 15, 2017 at 3:31 PM

    By the way I used a test form and it work so far. You can check as well.

    Let us know how it goes.