Support Forum

Please note that this forum is only available to you in read only mode. In order to contribute to this conversation you will need to renew your subscription.

Add Font from Google Web Fonts to Stack

zentoolsIf you use Zentools please post a review at the Joomla! Extensions Directory.

Greetings Anthony, et al,

I'd like to use Google's Paprika display font for headings in my latest project. How might I go about adding this to the font stack? I don't want to seem ungrateful - the number of fonts you offer currently is impressive! Paprika just works for the current design better. :dry:

I've searched the forums and KB but didn't come across any information about how to do this without hard coding in the CSS - not optimal IMHO.

Thanks in advance for your response.

~ Lisa
  • Lisa Harrington's Avatar
  • Lisa Harrington
  • 12 Month basic
  • 64 posts
  • 1 Thanks
  • Karma: 1
The administrator has disabled public write access.
Well, you can 1) edit framework and add this font inside or 2) add link inside index.php (also inside framework, but implementation much simpler).

So details:
1) you can add your font in this file: plugins/zengridframework/assets/zenfontlist.php but I would use second approach

2) open this file: plugins/zengridframework/index.php and place this code:
<link href='fonts.googleapis.com/css?family=Paprika' rel='stylesheet' type='text/css'>
just before < / head > tag.
  • Zuzuzu's Avatar
  • Zuzuzu
  • LIfetime Developer - Big Bamboo
  • 1925 posts
  • 107 Thanks
  • Karma: 67
The administrator has disabled public write access.
The following user(s) said Thank You: Lisa Harrington
I tried both of the options you suggested and had no luck with 1) adding "Paprika" to the font options for headings, or 2) having it display as the heading font in the front end by the means you specified.

So, I decided to do a little more digging -- spent a huge amount of time searching through my local installation for various keywords, changed a whole bunch of files and still had no success -- and found an item in the ZenGrid documentation which referred to this file: plugins/system/zengridframework/admin/j17/zenoptions.php. After adding "Paprika" to zenoptions.php, it did appear in the drop-down font stack options. I also added the desired font to the following files:

plugins/system/zengridframework/zengridframework/admin/assets/fonts.json
plugins/system/zengridframework/zengridframework/admin/J17/zengridoptions.php
plugins/system/zengridframework/zengridframework/assets/zenfontlist.php

templates/zengridframework/admin/elements/zenfonts.php
templates/zengridframework/admin/functions/elements/fonts.php

(Perhaps I overdid this but I didn't want to leave it to chance that just adding the font to zenoptions.php would produce the desired result.)

Logically, this should have worked. Nope.

Light bulb. Sudden realization... Duh.

I forgot that "Compress System and Core CSS Files" was selected in the template settings, so had to clear the cache. Once cleared, the Paprika font was visible on both the site front and back end.

What a PITA! Hope this helps someone else.

Now to transfer all those files to the remote site and move on...

~ Lisa
  • Lisa Harrington's Avatar
  • Lisa Harrington
  • 12 Month basic
  • 64 posts
  • 1 Thanks
  • Karma: 1
The administrator has disabled public write access.
Thanks Lisa :)

This issue can also crop up with compression if you move the site to another domain - turn off compression and then back on to fix it

Thanks again for taking the time to post back

Cheers
Paul
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.

zentoolsIf you use Zentools please post a review at the Joomla! Extensions Directory.

Happy Campers