Fonts-Plugin: Allow fonts from other sources than Typekit, Google and BoostrapCDN

[Kau-Boy]

For the ​WordCamp Berlin 2015, we have used the very popular Web Font "Hack". We included the font using @import in the Custom CSS. With changeset r2085 it is not longer possible to use @import in the Custom CSS. But as the font is not available through Google Fonts or Typekit, the design is now broken.

Would it be possible to allow more URLs in the Google Web Fonts setting, so we can continue to use Hack?

[jenmylo]

+1

[iandunn]

@jenmylo, is this something the Meta team should make a priority, or do we need a patch from the community?

---

I think it'd be great to add more font options, but I don't think it's practical to add individual fonts every time a team requests one. Instead, it'd probably be better to add popular services/collections that offer many fonts, and then ask organizers to choose from the supported ones.

I think it makes sense to prioritize open-source and free services, so maybe ​the League of Movable Type and ​Font Squrrel would be a good start. It looks like Font Squrrel does offer Hack.

[jenmylo]

Given the high priority stuff we're working on, I think it's more likely to get done faster if a community member contributes a patch.

This brings up something we should keep in mind for the future, though -- if there are plugins on wordcamp.org that might cause a regression for our organizers/sites, we should review them before updating. My guess is that Jetpack is the only one this is true of, but we should probably be hyperaware of any changes they make to the CSS bits, since that's something used by every WC site.

[Otto42]

I agree with Ian in that we should add additional options for free and open source fonts from sites with lots of them, as opposed to allowing for arbitrary fonts.

That said, this would be a very good-first-enhancement if anybody relatively new to meta wants to take it on. The actual adding of other font sites to the existing wc-fonts plugin should be quite easy to do.

https://meta.trac.wordpress.org/browser/sites/trunk/wordcamp.org/public_html/wp-content/plugins/wc-fonts/wc-fonts.php

Edit: fontsquirrel.com does indeed have Hack, however, it also appears to lack any form of CDN or any means by which to serve those fonts to the public. It's a download-only situation there.

Addendum: Hack is awesome and my new console font.

[Kau-Boy]

I am happy to see, that you guys also want to have new fonts. As for Hack, I haven't found it on any other site.

I could implement a patch to provide new font services. Should we allow different service URLs in the Google Web Fonts settings or should there be a settings option per font service?

[Heiko_Mamerow]

Actual Hack can only be used (in different flavors) with this CDN: ​http://www.jsdelivr.com/projects/font-hack

Unfortunatly there seems no way for Hack in Google Fonts. ​https://github.com/chrissimpkins/Hack/issues/40

@Kau-Boy: I think, we need a setting options per font.

[iandunn]

if there are plugins on wordcamp.org that might cause a regression for our organizers/sites, we should review them before updating

This was actually a security restriction that I added, but it only effects sites when making changes to Custom CSS. Sites that are currently @importing fonts are grandfathered in, unless they make changes in the future.

I went through all the recent/upcoming sites -- i.e., those likely to be making changes -- to make sure they wouldn't be effected, and manually configured the Fonts plugin for them, and added Font Awesome support because one of them needed it. It wasn't practical to do it for the other ~500 sites, though.

Actual Hack can only be used (in different flavors) with this CDN: ​http://www.jsdelivr.com/projects/font-hack

We can't whitelist the entire CDN, because malicious files could be hosted there. We'd have to limit it to just /projects/font-hack, but then we'd be back to whitelisting individual fonts, which isn't practical. See comment:2.

[Kau-Boy]

I totally understand the reason for the change in the Fonts-Plugin regarding security. Would it be possible to whitelist something like https://cdn.jsdelivr.net/font-*.css to allow only fonts?

We also talk about a plugin used for the WordCamp organizers. We should enforce the best security possible, but we should also trust the organizers that they don't intentionally try to break the platform by using unsecure ressources from such CDNs.

[iandunn]

Would it be possible to whitelist something like ​https://cdn.jsdelivr.net/font-*.css to allow only fonts?

Anybody can add a project to jsdelivr.com and name it whatever they want, so jsdelivr.net/font-awesomer/please-trust-me.css might not be a font at all; it could be full of expressions, bindings, etc.

we should also trust the organizers that they don't intentionally try to break the platform

I'm not really worried about organizers being malicious, but it'd be pretty easy for an attacker to compromise an organizer's account, or to compromise weak externally hosted services.

[zodiac1978]

I think you can use the font per Data-URI. That would solve all problems with individual fonts. Or is the use of Data-URI restricted too?

[Heiko_Mamerow]

Replying to zodiac1978:

I think you can use the font per Data-URI. That would solve all problems with individual fonts. Or is the use of Data-URI restricted too?

Unfortunately, no. All url() will be eaten... ;-(

[Heiko_Mamerow]

In my view, the only workaround for Hack: fork, rename and upload to Google Fonts.

[dd32]

This ticket has been moved to GitHub ​https://github.com/WordPress/wordcamp.org/issues/584