Congratulations for a really good theme!
I wish to use a specific Google Gujarati font Mukta Vaani (https://fonts.google.com/?subset=gujarati&selection.family=Mukta+Vaani) on my website. I enabled the Gujarati support in Theme Fonts > Google Fonts Settings.
Now in the Post Content font list, another Gujarati font Hind-Vadodara (https://fonts.google.com/?subset=gujarati&selection.family=Hind+Vadodara|Mukta+Vaani) is listed, but not the Mukta Vaani. How do I get it?
Also, I want to give this font priority over the usual web-safe Unicode Gujarati font Shruti.
How do I do this?
Thanks for reply, but as I have mentioned, I have already used that guide and done what is required. My question is, even after activating the Gujarati font support in Theme Fonts > Google Fonts Settings, the font I need does not show in the font lists.
There are total 9 Gujarati fonts in Google Fonts, but only one of them (Hind-Vadodara) is visible in the any font dropdown list. Do I need to anything else, than activating Gujarati font support in theme?
Hi,
If the font you need is not available, try uploading it manually in the theme panel custom font section. Follow the guide provided above. Then it should appear in the font selection drop down and you can select it and use it.
Thanks
Thanks a lot! It worked, but didn’t solve the problem!
As suggested, I downloaded the required font, turned into .woff and uploaded in the custom font section. Now the font is displayed in the font selection drop-down list, but even after selecting it, the site doesn’t use it.
Whereas, if I choose the already available Gujarati font in the list (after enabling Gujarati support), the site uses it.
Am I doing something wrong?
On many smartphones, the web-safe Gujarati font (Shruti) is not present by default and hence need to use a Google Gujarati font.
Please guide.
Hi,
It should display for the elements you select from the theme panel, once it is uploaded. I have downloaded the same font you mention and uploaded it
– https://www.screencast.com/t/3OlxZSH1ht8
Then is have set it for the post content for example
– https://www.screencast.com/t/42DqAw6ic
The result is that the post content is now using that font
– https://www.screencast.com/t/39edhk9oHSjd
And the font is loaded by the theme
– https://www.screencast.com/t/Cltze1qS
Maybe you are not setting the font for the elements you want it to appear. It could be as well that you have caching, try clearing any installed cache.
Thanks
Thanks a lot for detailed guidance.
I was setting the font for the post body and titles.
Still, will try it again as you have guided and revert.
Thanks again!
Now this is getting interesting!
I did exactly as you directed and seeing the Muktavaani font in the inspect panel, but the font on the front page is not that!
Please see these three images.
Image-1 cs-1-with Muktavaani font rendering
https://cybersafar.org/wp/wp-content/uploads/2017/07/cs-1-with-Muktavaani-font-rendering.jpg
This is from my old joomla site, where the MuktaVaani font is rendered properly.
Image-2 cs-2-Not-rendering-Muktavaani-font.jpg
https://cybersafar.org/wp/wp-content/uploads/2017/07/cs-2-Not-rendering-Muktavaani-font.jpg
This is the same content, from the new WordPress site with newspaper template, where the Chrome Inspect is showing MuktaVaani font, but rendering default Gujarati web-font, Shruti, present in my pc.
Image-3
https://cybersafar.org/wp/wp-content/uploads/2017/07/cs-3-Not-rendering-Muktavaani-font-on-mobile.jpg
This is a mobile screenshot from the new WordPress site, with Newspaper template. Here the font doesn’t have the default Gujarati web-font so body text of the post is blank. In the title and subtitle, I have selected Hind-Vadodara, the Google Custom font that is visible in the list without any upload. They are rendered properly.
My assumption is, for some reason, the template is using the default Gujarati web-font, even if we select MuktaVaani font. It is overriding the font we upload and then choose.
Please see if you can find the reason! I am sorry for keeping you occupied and thanks indeed for all your support!
Hi,
Please provide a link to your website in order to inspect the issue. The uploaded font should be displayed with priority once properly set for the chosen elements, in the theme fonts settings.
Thanks
It is cybersafar.org/wp
Currently the site is not open for public.
Please let me know if you need access details.
Thanks!
A correction, the site can be viewed by anyone, but we haven’t shared the domain to anyone!
Hi,
It seems to be replaced by this font in the post content
– https://www.screencast.com/t/0WCalNYqi
That happens for me as well in my tests. Forcing it with custom css seems to make it apply however
– https://www.screencast.com/t/xMSKyP0T
In my case I tried loading the font directly in the header
– https://www.screencast.com/t/GxLmkSvjCqv
And applied it with css
– https://www.screencast.com/t/a3oLjsQaVnDZ
I could not say why it gets replaced with the other font, since there is no such font available at least for me, in the theme panel. It could be a default fallback. You could try applying the font manually with css as shown for the moment
– https://www.screencast.com/t/Ry54d5KA
Thanks
Thanks a lot, I think this should solve the problem!
I tried Live CSS feature for some color change and it’s working. I have added the font code too.
Where should I add the font link? in the header.php file as you have shown? I have migrated from Joomla, where in the backend there is a facility to edit header.php. Does WordPress have similar facility? I tried using the custom code facility in the theme panel, but it is not working.
Regards,
Hi,
Glad you could find a solution. Simply enter the font link in the header.php file between the head tags. This file is located in the main theme folder
– https://www.screencast.com/t/YGJWc6Xm
The custom code can be entered in the Theme panel->Custom Css section.
Thanks
Thanks a lot! I will try this and revert.
Thanks again,
Regards,
