Hi.
I use a Google font which I select in the style options of Helix Ultimate. This is a font with a lot of weights.
Discovered that although I selected the right weight (Semi Bold which is 600) the font on my page is actually the font weight 700.
Looking into the head section of my code I can see that font weight 600 is not loaded.
Updated my Google fonts list but that do the trick.
How can I be sure that the right fonts are loaded?
Hello Krachtstroom
Please share a screenshot of your issue to understand it better.
Best regards
Hi Ofi,
This is the line in my header: <link href="//fonts.googleapis.com/css?family=Poppins:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i&display=swap&subset=latin-ext" rel="stylesheet" type="text/css">
As you cansee the Poppins 600 and 600i are not loaded. And that's exactly the font I need. Strange thing is that I can choose for it in the dropdown list/settings in the Helix Ultimate styles (600 = semibold). The font is available in semibold/600 at Google.
Hope to hear soon.
Please share your administrator access here to check the issue. Use the Hidden Content box to share the credentials.
Hi Ofi,
Here it is
Anything?
Sorry, I could not access your administrator URL. Please check this.
O yes, I forgot. If you give me your IP I can whitelist that one
Here it is: 119.148.8.82
Hi Ofi,
I added this one to the admin whitelist, now you must be able to login.
Anyone?
Apology for the delay. Please add my public ip to the whitelist.
Hi Ofi,
I understand. Added to whitelist.
Thanks. But I could not log in again. Please take a full site backup with Akeeba Backup in ZIP format and share here. Follow this tutorial. Then I will check the backup and investigate the issue.
Hi Ofi,
Yes, security is a bitch.
Does this link work: https://drive.google.com/file/d/10nox856FuZWNfj76X-ZvHnCYj6jlLmXL/view?usp=sharing
Sorry to bother you again. The backup is in JPA format. Please go to Components -> Akeeba Backup -> Configuration and set backup format as ZIP. Then take the backup again and share.
Oops, overlooked that. Here's the correct file:
https://drive.google.com/file/d/10sHneC4qYwNvg6Ly0bcW4teHeFWzhQ4s/view?usp=sharing
You have sent me your full site folder. I want the Akeeba Backup. Please take a full site backup with Akeeba Backup in ZIP format and share here. Follow this tutorial
Hi Ofi,
The backup profile says: full site backup, so I don't understand what is going wrong. Anyway, I disabled admintools for now, so you can login from where ever you want. Use the credentials you already have.
Keep me updated.
Regards, Hans
Thanks. I have checked the Navigation Menu and font-weight is 600 here (which semi-bold).
Hi Ofi,
Yes, it looks like it is font-weight 600. But it isn't. When you look in the headsection of the page you'll see this line:
<link href="//fonts.googleapis.com/css?family=Poppins:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i&display=swap&subset=latin" rel="stylesheet" type="text/css">
And from that line you can see that the 600 weight isn't loaded. And that's the problem. Because there is no weight 600, the browser will load the weight 700 instead. And that's not what I want.
The problem lies in the fact that the weight 600 isn't in the link to Google fonts.
Can you please check again?
Thanks
I have checked but could not get the issue.
Hi Ofi,
Not quite sure what you mean. Do you mean that you don't have the same issue? Or is it not clear to you what the issue is?
O wait: I see the line I copied is removed from my answer.
Look in the head section of the site and you will see the link href to Google fonts, in this line you can see that the weight 600 isn't loaded although this is specified in the template settings, hence, it is written in the css too, as you can see in the screendump you made. But because this font is not available, the browser will make it a 700 weight.
family=Poppins:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i&display=swap&subset=latin" rel="stylesheet" (stripped line in the head of the site)
Clear to you?
In that case - you can use alternative method of loading Google Fonts.
As you know, loading all fonts weight slown down site loading process, so I recommend using only selected.
Here is custom CSS you should use for menu items:
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;600;700&display=swap');
.sp-megamenu-parent > li > a,
.sp-megamenu-parent > li > span,
.sp-megamenu-parent .sp-dropdown li.sp-menu-item >
{ font-family: 'Poppins', sans-serif; }Remember to disable Google font from Typography options (!)
BTW
To be honest I don't see big difference between 600 and 700, like tiny difference, but I guess Hair-dresser have a better eye.
Hahahahaha. I don't know, I have to deal with my designer. She's worse ;-)
But thank you for the solution, will try that one.
It should work, I use this method all the time.
Besides, not only me.