Typekit & Google fonts conflict

[mapsteps]

Issue description:

Hi :)

I'm using this snippet over here (https://github.com/vlthemes/VLThemes-Add-Typekit-fonts-to-Kirki) to integrate typekit fonts. Now, the problem is that we're adding the fonts to the Google Fonts dropdown and kirki still loads them that way. (Kirki tries to load them as google fonts) I haven't tried it yet to add them to the default fonts - Is there a way to add another "headline" under the typography dropdown for the Typekit fonts?

I've also created an issue on vlthemes repository that links here.

Version used:

3.0.9

[vlthemes]

#1369

[vlthemes]

New function is now available for connecting Typekit. Indeed, we need the ability to create our own groups in the font-family field.

https://blog.typekit.com/2017/08/30/css-font-loading/

[aristath]

Ability to use typekit and other custom implementations will be added in v3.1
I'm completely rewriting the fields there 👍

[wilrevehl]

Hello, Aristides! Any progress on TypeKit support. Anything we can do to help? Thanks for all you do.

[aristath]

I had never used typekit until today when I started working on this, and tbh I'm a bit skeptical.
With the new implementation that was added in #1807 (comment) adding typekit will now be possible.
However, Typekit requires you to create a kit, then whitelist your domain inside that kit. Then and only then can fonts work. So my reservations are purely UI-related.
Obviously a theme can't hardcode a kit-id and define that they want to use one of 10 font-families from Typekit, because the client's domain will have to be whitelisted. So that means that the kit-ID will have to be user-defined in a setting.
I'm still figuring out the best approach for this, once I have something I'll post back here. 👍

[mapsteps]

Hey @aristath,

I'm quite happy with the new typography implementation and the typekit solution over here – https://github.com/vlthemes/VLThemes-Add-Typekit-fonts-to-Kirki (@vlthemes)

My question is, will there be a deeper integration built into kirki in the future? For example, you could pull all the information in from the typekit api, etc.

My current setup looks something like this. Basically, you'd have to enter your typekit fonts manually. Just curious if something is planned here.

[wilrevehl]

The VLThemes approach is okay, but not ideal from a UX standpoint.

@aristath, is the webfonts class you added documented anywhere? Is it remotely viable for loading something like a Typekit set? I'm looking at the source code and it, with the AJAX loader, is very complex (but, very nice coding)! It is hard to determine where you left off, if it would be worth trying to hook into. I'm just not sure where to even start with hooking into it. For now we've overridden your large script.js file, but it isn't a sustainable approach. Any insight would be greatly appreciated!

[wilrevehl]

Hi, @aristath! I hope you are well, have not heard back on this inquiry. I tried using your filter 'kirki_fonts_standard_fonts'. Custom font names are able to be added, but your select dropdown for variations only shows 'regular', 'italic', '700', '700italic' regardless of the custom variations included with the filter arg. It is as if they're not being parsed. For our purposes (Typekit integration), we really only need a way to inject the family, name and variant into your Typography control and know that it is saved and parsed like you do a system font. It seems the main issue is the variations not matching what we hook.

It would be nice if we don't have to hack into your javascript to add custom fonts. Maybe I could pay you to help expedite this? We would like to use a filter instead of trying to recreate parts of the google font classes and JavaScript. It seems like it should be possible but may need some changes/additions to your typography control. Please advise. Thanks a lot for your time and consideration and always your hard work!

[mapsteps]

Hi @wilrevehl,

the kirki_fonts_standard_fonts filter is deprecated. Please check out this post to get an idea how to add custom fonts & custom optgroups – #1900 (comment)

[wilrevehl]

Thanks for the insight! I'll check it out.

…

On Sat, Oct 20, 2018 at 2:47 AM David Vongries ***@***.***> wrote: Hi @wilrevehl <https://github.com/wilrevehl>, the kirki_fonts_standard_fonts filter is deprecated. Please check out this post to get an idea how to add custom fonts & custom optgroups – #1900 (comment) <#1900 (comment)> — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#1537 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AA81d4obkvVbf0TE517cjj_oswdVPeKTks5umscKgaJpZM4PbHRU> .