Unable to use Google fonts. I am providing the code below. Thx

  • Profile Image
    vido
    Asked on February 04, 2014 at 11:53 AM

    @font-face {

    font-family: 'Open Sans';

    font-style: normal;

    font-weight: 300;

    src: local('Open Sans Light'), local('OpenSans-Light'), url(http://themes.googleusercontent.com/static/fonts/opensans/v7/DXI1ORHCpsQm3Vp6mXoaTaRDOzjiPcYnFooOUGCOsRk.woff) format('woff');

    }

    @font-face {

    font-family: 'Open Sans';

    font-style: normal;

    font-weight: 600;

    src: local('Open Sans Semibold'), local('OpenSans-Semibold'), url(http://themes.googleusercontent.com/static/fonts/opensans/v7/MTP_ySUJH_bn48VBG8sNSqRDOzjiPcYnFooOUGCOsRk.woff) format('woff');

    }

    @font-face {

    font-family: 'Open Sans';

    font-style: normal;

    font-weight: 700;

    src: local('Open Sans Bold'), local('OpenSans-Bold'), url(http://themes.googleusercontent.com/static/fonts/opensans/v7/k3k702ZOKiLJc3WVjuplzKRDOzjiPcYnFooOUGCOsRk.woff) format('woff');

    }

    @font-face {

    font-family: 'Open Sans';

    font-style: italic;

    font-weight: 300;

    src: local('Open Sans Light Italic'), local('OpenSansLight-Italic'), url(http://themes.googleusercontent.com/static/fonts/opensans/v7/PRmiXeptR36kaC0GEAetxvR_54zmj3SbGZQh3vCOwvY.woff) format('woff');

    }

    @font-face {

    font-family: 'Open Sans';

    font-style: italic;

    font-weight: 600;

    src: local('Open Sans Semibold Italic'), local('OpenSans-SemiboldItalic'), url(http://themes.googleusercontent.com/static/fonts/opensans/v7/PRmiXeptR36kaC0GEAetxuw_rQOTGi-AJs5XCWaKIhU.woff) format('woff');

    }

    .form-all{font-family: 'Open Sans';}

  • Profile Image
    Carina
    Answered on February 04, 2014 at 12:32 PM

    Hello

    In which form are you trying to use this fonts?

    Thanks

  • Profile Image
    vido
    Answered on February 04, 2014 at 01:10 PM

    Estate Plan Client Questionnaire

    Thx

  • Profile Image
    vido
    Answered on February 04, 2014 at 01:16 PM

    Carina, I had another questions...I upgraded my account to paid subscription this morning, but it still shows as a free account??

    Thx

  • Profile Image
    Carina
    Answered on February 04, 2014 at 01:31 PM

    Hello

    For the upgrading question, I kindly ask you to open a new thread as we try to keep one subject per thread.

    Regarding the fonts I managed to install them:

     

    The only thing I did was to remove the quotes from the .form-all:

     

    @font-face {

    font-family: 'Open Sans';

    font-style: normal;

    font-weight: 300;

    src: local('Open Sans Light'), local('OpenSans-Light'), url(http://themes.googleusercontent.com/static/fonts/opensans/v7/DXI1ORHCpsQm3Vp6mXoaTaRDOzjiPcYnFooOUGCOsRk.woff) format('woff');

    }

     

    .form-all{font-family: Open Sans;}

     

    Kindly let us know if you need more assistance.

     

  • Profile Image
    vido
    Answered on February 04, 2014 at 02:04 PM

    Thanks for doing that...I still don't see where i can add the font as a choice.

    Thx

  • Profile Image
    EltonCris
    Answered on February 04, 2014 at 02:18 PM

    @vido 

    Sorry but what exactly are you trying to achieve?

    I can see from your form now that the fonts has been applied to your form fields/labels as also seen on the screenshot provided by my colleague.

    You can also refer to this guide to find out what selectors you can use to apply the font styles.

    http://www.jotform.com/help/100-Beautify-your-Form-with-Google-Web-Fonts

    Is this how you're supposed to use the google fonts? If not, let us know the details so we can assist you further.

    Thanks!

  • Profile Image
    vido
    Answered on February 04, 2014 at 02:24 PM

    Thanks Elton, I don't see a choice of the above font when I go to select fonts from the font menu?? Im I missing something??

    Thx

  • Profile Image
    Welvin
    Answered on February 04, 2014 at 02:32 PM

    Hi,

    Since you are using Google Fonts, your must find it through Google Webfonts page: http://www.google.com/fonts/. This is a custom workaround so you can't see this in our form builder. You have to inject this to your form custom CSS area.

    If you will check this guide: Beautify-your-Form-with-Google-Web-Fonts. You should be able to do this to your form(s). If you need help, please let us know here.

    Thanks

  • Profile Image
    vido
    Answered on February 04, 2014 at 02:40 PM

    I did all that!!

    Thx

  • Profile Image
    Welvin
    Answered on February 04, 2014 at 02:48 PM

    We can see it. If you need to change the font family, just simply access the injected custom CSS codes to your form by following this guide: How to Inject Custom CSS Codes and change the links from there. Again, let us know if you need help with changing the font.

    Thanks