css Adding custom 'web font view counter' css to Squarespace site

Hi, I've successfully added a custom font to a website but I'm struggling with how / where to add the css code which tracks page views. The font license purchased from Myfonts allows 250,000 views and so I need to enable the counting. Their advice is a bit vague so I'm hoping someone here can help. 

Am I right in thinking the code I need to add to the header is...?

<!--
/**
* @license
* MyFonts Webfont Build ID 262022
*
* The fonts listed in this notice are subject to the End User License
* Agreement(s) entered into by the website owner. All other parties are
* explicitly restricted from using the Licensed Webfonts(s).
*
* You may obtain a valid license from one of MyFonts official sites.
* http://www.fonts.com
* http://www.myfonts.com
* http://www.linotype.com
*
*/
-->
<link rel="stylesheet" type="text/css" href="MyFontsWebfontsKit.css">

Which element do you apply custom font? on which pages?

7 hours ago, tuanphan said:

Which element do you apply custom font? on which pages?

 

I added the custom font css code to the whole site. It's all appearing fine:

Design > Custom css > copy and pasted into the column on the left in editor.

However, Myfonts needs to track how many of  all the website's pages are viewed. So is it the header that I'll need to add their tracking css? And if so then would it be a code injection? I'm not very familiar with css.

Thanks 

13 hours ago, iamdavehart said:

You shouldn't need to add anything: they track it themselves based on numbers of requests. it will only matter if you're using a pay as you go font, but if you are using one of those then you buy a certain number of page views (which may expire after a number of years depending on the individual font licence). MyFonts track the number of requests from your site and if you exceed the number (or your paid-for views expire) then your font will stop working and you'll need to go back and buy more.

they should notify you, but apparently you can also check it here https://www.myfonts.com/my/orders/webfontusage.html

 

It's a pay-as-you go-font so I'm pretty sure I need to add tracking code somewhere. I checked on Myfonts.com's view counter for the font I purchased and installed on the website I'm discussing. The website is live, but isn't showing a single view there, so something isn't right. The Squarespace analytics tell me that there have definitely been visitors.

OK, so the way that MyFonts do this is they let you build a "kit", which is really a download of a zip file containing a CSS file and the web fonts files (*.woff or other web font extensions). the counter is actually inside the .css file and looks like this

@import url("//hello.myfonts.net/count/xxxxxx");

so there would be a couple of ways to add this to Squarespace, but I think by the sound of it you've already added the custom font file by uploading it in the Custom CSS part of your site. if you've pasted in both the counter import above and the @font-face declaration that's also in your CSS then that should be enough.

I did also notice that the myFonts web counter is currently down, so maybe that's why it's not updating if you already have the import url included

On 10/14/2021 at 7:03 PM, iamdavehart said:

OK, so the way that MyFonts do this is they let you build a "kit", which is really a download of a zip file containing a CSS file and the web fonts files (*.woff or other web font extensions). the counter is actually inside the .css file and looks like this

@import url("//hello.myfonts.net/count/xxxxxx");

so there would be a couple of ways to add this to Squarespace, but I think by the sound of it you've already added the custom font file by uploading it in the Custom CSS part of your site. if you've pasted in both the counter import above and the @font-face declaration that's also in your CSS then that should be enough.

I did also notice that the myFonts web counter is currently down, so maybe that's why it's not updating if you already have the import url included

Thanks for the advice Dave. Any idea where I'm going wrong..?

When I add the specific license/counter part of the CSS to the website, I'm getting this error message: Cannot read properties of undefined (reading 'href') 

*QUICK UPDATE ON THIS* for anyone who encounters this problem.

Despite the error message I was getting here, it all now seems to be working.

I contacted Myfonts and they assure me that the 'counter' is definitely tracking page views. Happy days 🙂