JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.
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.
Using a custom fontAsked by marketing905 on September 01, 2016 at 11:21 AM
I'm looking to match the font used within our website, unfortunately it's not listed as a google font so instead I've injected the following CSS into my form.
font-family : 'truman';
src : url("http://www.yewdale.co.uk/fonts/FSTrumanWeb-Regular.eot");
src : url("http://www.yewdale.co.uk/fonts/FSTrumanWeb-Regular.eot?#iefix") format("embedded-opentype"), url("http://www.yewdale.co.uk/fonts/FSTrumanWeb-Regular.woff") format("woff");
font-weight : normal;
font-style : normal;
When I try to select the font "truman" I can't see it listed within the fonts available.. Am I missing something?
Many thanks in advance.
When you said you cannot see the font listed within the fonts available, are you referring to the Font Options in Designer of your form?
Added custom fonts are not automatically added to the Font Options in Designer but if you have added the CSS code you provided in your form above, you can still use the font by injecting custom CSS code. For example,
font-family: 'truman' !important;
Do let us know if you need further assistance.
Many thanks for your help,
I have added the code via the injecting custom css code element, but can't see how I associate that code to the form.
Within the code I can see the injected css but it how do I change the code within the jotform control panel?
.form-all is set to 'Arial' but I need to change it to 'truman'.
Many thanks in advance,
Your code seems to be setup correctly. However, after further checking, I noticed that Jotform is not being allowed to access the font file, which is why it is not being displayed on your form.
Font from origin 'http://www.yewdale.co.uk' has been blocked from loading by Cross-Origin Resource Sharing policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://www.jotform.com' is therefore not allowed access.
You will need to allow Jotform to access the files on your site so the font files will be loaded properly on your form. Here are a couple of threads that may help you in allowing jotform to access your files: