Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

MyFonts CSS import error


CopperCauldronArt

Question

Site URL: https://horse-potato-6mep.squarespace.com

Hi, I purchased 2 webfont licenses from MyFonts and am
in the process of referencing the kit to my trial page. I have installed the fonts sucessfully, but the line

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

keeps giving error message "f.location is undefine"
the @import line is responsible for the pageview count and I need to use it because my license is limited to a certain amount of views.
The MyFonts support team says "Unfortunately, that sounds like an error specific to Squarespace (it is not a standard CSS error) so for assistance with that I'd contact Squarespace directly.

Could anyone help me out here? I really need to
install this correctly to comply with the license.

Thank you in advance,
Martha Schmidt

css error.PNG

Link to comment
  • Answers 15
  • Created
  • Last Reply

Top Posters For This Question

15 answers to this question

Recommended Posts

  • 1
16 hours ago, vincentvers said:

Can someone please help...
I have the same problem, but if I add my 


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

in the code injection header it just appears as a line at the top of my website, but it doesn't work.

I have uploaded the font's and used this code in my custom CSS
 


@font-face {
  font-family: 'MonoSpec-Regular';
  src: url('webFonts/MonoSpec-Regular/font.woff2https://static1.squarespace.com/static/5f27084b74011038bfe3bfb8/t/5f3d403a2dd86858ae580f20/1597849659484/font.woff2') format('woff2'), url('webFonts/MonoSpec-Regular/font.woffhttps://static1.squarespace.com/static/5f27084b74011038bfe3bfb8/t/5f3d403a2dd86858ae580f20/1597849659484/font.woff2') format('woff');
}

h1, h2, { 
	font-family: MonoSpec-Regular!important; 
}
p {font-family: MonoSpec-Regular!important;
}

 

But nothings seems to work... i'm going mad.
Can anyone help me. 

 

 your code is invalid, edit this line

@font-face {
  font-family: 'MonoSpec-Regular';
  src: url('webFonts/MonoSpec-Regular/font.woff2https://static1.squarespace.com/static/5f27084b74011038bfe3bfb8/t/5f3d403a2dd86858ae580f20/1597849659484/font.woff2') format('woff2'), url('webFonts/MonoSpec-Regular/font.woffhttps://static1.squarespace.com/static/5f27084b74011038bfe3bfb8/t/5f3d403a2dd86858ae580f20/1597849659484/font.woff2') format('woff');
}

to this

@font-face {
  font-family: 'MonoSpec-Regular';
  src: url('https://static1.squarespace.com/static/5f27084b74011038bfe3bfb8/t/5f3d403a2dd86858ae580f20/1597849659484/font.woff2') format('woff2'), url('https://static1.squarespace.com/static/5f27084b74011038bfe3bfb8/t/5f3d403a2dd86858ae580f20/1597849659484/font.woff2') format('woff');
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

Link to comment
  • 0
3 hours ago, humxahafeex said:

Hi , Site seems Private Please make it public or password protected so I can have a look 🙂

To make it Public ot Password protected : 

Home > Settings > Site Availability 

Hi, it's still a test site but I've set 2020 as the password so you should be able to view it now 🙂

Link to comment
  • 0
2 minutes ago, CopperCauldronArt said:

I tried it - sadly there's still the error after adding the https

Got it , Actually you have to  use some file path in@ import like below instead of just link.

@import url("https://somelink.com/example.css")

If you just simply use the link it will return one of 2 errors :  f.location undefined or href is undefined.

Please try to use the link to file and let me know if it helps It should fix this issue 🙂

 

Link to comment
  • 0

thank you for this advice! 🙂 just one question - how do I get the file path? The css editor has "add images or fonts" and I can add all kinds of font files but no css file or something 🤔 I mean, to use my fonts, I uploaded them, and when I clicked the uploaded font file a custom url appeared in my css window which I used sucessfully. But what file do I add to get the code in question to work? Sorry if I'm being stupid, I have zero css knowledge and am totally winging it here 😞

Link to comment
  • 0

HI @CopperCauldronArt!

What exactly did you do to solve this? I am having the exact same issue installing a web font licensed from myfonts.com.  

Did you just paste the @import url line in to the code injection Header field? Did you have to include anything else before or after it in the code injection field? Or just the text provided by myfonts? This is mine --  @import url("//hello.myfonts.net/count/3b882c");  

Did you then delete that line from the CSS editor completely, or leave it there?  I've just tried doing this after reading your post, but it's still not working for me :(

Thank you in advance!
Link to comment
  • 0

So after you include the @import in the header go back to your custom css and add "!important" to where you want the font to be. Example: h1 { font-family: 'fontname' !important; }

It overrides any other styling that prevents your custom style from working. Not the best fix best fix but the only thing I could get to work so far.

Link to comment
  • 0

Can someone please help...
I have the same problem, but if I add my 

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

in the code injection header it just appears as a line at the top of my website, but it doesn't work.

I have uploaded the font's and used this code in my custom CSS
 

@font-face {
  font-family: 'MonoSpec-Regular';
  src: url('webFonts/MonoSpec-Regular/font.woff2https://static1.squarespace.com/static/5f27084b74011038bfe3bfb8/t/5f3d403a2dd86858ae580f20/1597849659484/font.woff2') format('woff2'), url('webFonts/MonoSpec-Regular/font.woffhttps://static1.squarespace.com/static/5f27084b74011038bfe3bfb8/t/5f3d403a2dd86858ae580f20/1597849659484/font.woff2') format('woff');
}

h1, h2, { 
	font-family: MonoSpec-Regular!important; 
}
p {font-family: MonoSpec-Regular!important;
}

 

But nothings seems to work... i'm going mad.
Can anyone help me. 

 

Link to comment
  • 0
On 3/14/2020 at 3:54 PM, CopperCauldronArt said:

SOLVED!

I had posted this question on other locations too a while ago, and now in a facebook group a lady helped me put the thing in my header via code injection, instead of using the css window 🙂

What was the solution here? Did you add the MyFonts import via a <link> element in the header via code injection instead of an @import?

In essence

<link href="//hello.myfonts.net/count/3c1555" rel="stylesheet">

in place of

@import url("//hello.myfonts.net/count/3c1555")

?

Link to comment
  • 0
8 hours ago, jyo208 said:

What was the solution here? Did you add the MyFonts import via a <link> element in the header via code injection instead of an @import?

In essence

<link href="//hello.myfonts.net/count/3c1555" rel="stylesheet">

in place of

@import url("//hello.myfonts.net/count/3c1555")

?

try this

<link href="//hello.myfonts.net/count/3c1555" rel="stylesheet">

Add to Code Injection > Header

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

Link to comment
  • 0

Actually, you don't have to rely on third party hosting at all.

Go to Custom CSS and click on Manage Custom Files. Upload your WOFF and WOFF2 font files (I assume you have appropriate rights to use these files.)

Then you can add your custom CSS: 

@font-face{
	font-family:"Gabriela-Italic";
        src:url("https://static1.squarespace.com/static/611686940176536662089c16/t/611695e27407426b9e855e53/1628870114352/bb397cca-a87c-4199-8f2c-739e09729b8d.woff2") format("woff2"),url("https://static1.squarespace.com/static/611686940176536662089c16/t/611695e27407426b9e855e53/1628870114352/cdf54c6a-99fe-4cd4-9fbb-2d4ed1745a2c.woff") format("woff");
    }
    @font-face{
        font-family:"Gabriela-SemiBold";
        src:url("https://static1.squarespace.com/static/611686940176536662089c16/t/611695e27407426b9e855e53/1628870114352/6aa8eb6d-911f-4ce9-90ee-240046f59092.woff2") format("woff2"),url("https://static1.squarespace.com/static/611686940176536662089c16/t/611695e27407426b9e855e53/1628870114352/96c51cef-64fe-480a-8da0-e6f29e63fb02.woff") format("woff");
    }


h1, h2, h3, h4, h5, h6 {
  font-family: 'Gabriela-SemiBold' !important;
}

h1 em, h2 em, h3 em, h4 em, i, emphasis {
   font-family: 'Gabriela-Italic' !important;
}

Replace the src:url with your account info, your WOFF and WOFF2 file names, and your font-family names. Make sure your font-family names are the same. 

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...