I am working on a Pardot landing page which shows a simple form. Now the customer wants us to use a custom font on the landing page for which a *.woff file was provided to us.
I uploaded the font file to Pardot (Marketing>Content>Files) and now am in the middle of editing the Layout Template for my landing page but I can't get the form on my landing page to start using my custom font.
Here are the first 14 lines of my Layout Template where I declare my uploaded font.
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Loading custom fonts -->
<style type="text/css">
@font-face {
font-family: "test_font";
src: url('http://go.pardot.com/blahblahblah/blahblah/fontname.woff') format('woff');
}
#pardot-form {
font-family:'test_font';
}
</style>
Any ideas as to why the form on my landing page is not using this font to display the names of the fields??
EDIT: Here are the errors I get from the console:
CSS3115: @font-face failed cross-origin request. No Access-Control-Allow-Origin header.
CSS3119: No fonts available for @font-face rule