Font does not display necessary glyphs

Hello

I am hoping someone can help me.

I am using the Marquee theme for a Polish client and the affected font is Source San Pro.

Glyphs used in Polish include ? ? ? ? ? but are being substituted by what appears to be Helvetica.

As you can see, even this post is displaying the affected issue, unless of course you have the correct font loaded on your own system elsewhere.

I would be extremely grateful if someone could explain how I can upload the font from my system so that the Marquee theme can push out to any browser. I have a feeling this can be done but I haven't any idea.

My level is very basic for any follow-up HTML or CSS so please be descriptive if you can.

PS Looking for a compromise I tried every other San Serif listed but none of them load missing glyphs.

Thank you in advance.

Please find a screen hot to illustrate the issue (I disabled the same font in Suitcases so that you could better understand)

It looks like the issue is more widespread than I thought. I turned off all user installed fonts to double-check and found that the font PT Serif is also affected.

At this rate, I really need some assistance

Are the glyphs missing from body text as well or only in headings?

Hello Eanderson. Thank you so much for chiming in.

Where the font should display the Polish characters it doesn't, so both heading and body text.

Eanderson, I went to the Google Fonts site and found the fonts there working beautifully with the Polish alphabet. These are fonts, PT Serif, PT Serif Caption and Source Sans Pro.

It suggests adding this code to my website:

<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:200,300,400,600,700,900,200italic,300italic,400italic,600italic,700italic,900italic|PT+Serif+Caption:400,400italic|PT+Serif:400,700,400italic,700italic' rel='stylesheet' type='text/css'>

As a further step it suggests:

“Integrate the fonts into your CSS: The Google Fonts API will generate the necessary browser-specific CSS to use the fonts. All you need to do is add the font name to your CSS styles. For example:

 font-family: 'Source Sans Pro', sans-serif;  
font-family: 'PT Serif Caption', serif;  
font-family: 'PT Serif', serif;

I found this just before chatting with Squarespace support. They suggested using a Code Block.

I entered the HTML code above at the top of a page but there is no change. I have no idea where to put CSS though.

I also read here, Answers: Google Fonts, that one can go to Site Management > Settings > Code Injection > Header and insert:

<link href='http://fonts.googleapis.com/css?family=NameOfFont' rel='stylesheet' type='text/css'>

Then use the CSS as instructed on the Google Fonts page:

font-family: 'Quicksand', sans-serif;

But where does the CSS go?

Can you suggest anything else?

@santoscork don't start with all that—the Squarespace system is supposed to be doing all that for you...instead, file an issue with Squarespace Customer Care and report the problem so it can be investigated.

Eanderson.

Your reply has given me a massive sense of relief. I was even contemplating purchase of Adobe's font kit. A lot of work as gone on so far, prepping this site.

It seems you are convinced the font should provide me the glyphs.

Thank you so much for your advice. I will keep you posted.

I have created a ticket, waiting for squarespace to reply.

Hi Andears

Squarespace has acknowledged the issue to the extent that the support person asks for my patience while they investigate.

Update: There is no update from squarespace yet.

In my case, the template I use is Marquee and it uses two fonts, Source Sans Pro and PT Serif.

The code below has to be entered into Settings > Code Injection.

<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:200,300,400,600,700,900&subset=latin,latin-ext' rel='stylesheet'>
<link href='http://fonts.googleapis.com/css?family=PT+Serif:400,700&subset=latin,latin-ext' rel='stylesheet'>

I used Google Fonts, searched for the fonts and clicked on the Sentence Tab to be sure the glyphs I expect to display do print on screen by entering them in the Preview Text field and then adding all the 200, 300, 400 etc into the code.

Your code may differ depending on the fonts in the default template or if you change them be sure to change the code.

Squarespace was very helpful and even offered me 2 more weeks trial due to the extenuating circumstance. They were most helpful. Another reason Squarespace shines! Excellent customer support.

The code they gave me was not correct but lead me in the right direction, this page question and answer helped, Google Fonts, CSS, Latin.

Hello, where should i inject code you provided? In header or footer?

Nvm, i figured it out (header).

Squarespace did reply. Although their answer was incorrect it lead me in the right direction. The code I had to inject:

<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:200,300,400,600,700,900&subset=latin,latin-ext' rel='stylesheet'>
<link href='http://fonts.googleapis.com/css?family=PT+Serif:400,700&subset=latin,latin-ext' rel='stylesheet'>

I’ve formatted the code in your answer. To format code, just highlight the lines of code and use the 5th button in the toolbar:

Also note that you don’t need the type="text/css" attributes in there either, I’ve removed it from your answer.