Is it possible to add webfonts from Typekit? Can't figure out how...
Thanks in advice
Just worked on this today. It will be possible in the new update.
Coming soon :D
Woop woop! You're the man!
Ok now in version 1.022 you can add a webfont by <script> tag and CSS. This lets you add an Adobe Typekit webfont!
Let me show you how to do that.
Then at "font-family CSS" you need to type in your font family CSS. Here's where you find it in Adobe Typekit:
Cool! Let me know if it works for you.
There seems to be a bug here.
It worked like a charm to add the webfont from Typekit. You can use the font under Text Formats and add a paragraph style for example:
But when you use it directly on a page text field it's like the preview doesn't work?
It's rendered correctly on the website though...
Yeah, as I wrote in the description on the "Webfonts" admin page:
"Please note that Webfonts added by "<script>" tag and CSS are not displayed correctly in the text editor. Also, here in the Webfonts Manager they will only be displayed correctly after you clicked Save Changes."
Nerdy explanation why it doesn't work:
I decided to stay flexible and not code the "add by <script> tag" specifically for these foundries. You can now add fonts from any foundry by <script> tag, possibly future ones :+1: But the downside is that these fonts don't show up correctly in the texteditor :(
Nice font by the way!
Ooops. My mistake! :)
Here is a different way to insert your typekit font with <link>:
"lay options" -> "webfonts" -> "+ add font" -> "add by link tag and css"
Make sure your website domain is entered in the kit settings in "Domains":
Now click on "Embed Code" and you'll see the default <link> tag. Put this tag inside "Link tag:" when adding the webfont to lay theme.
Now click "using fonts in css"
Copy this CSS (selected here) and insert it in "font-family" CSS: in lay theme.
In the end it looks like this:
@arminunruh Hi Armin,
I've tried both way of adding the font 'P22 Underground' from Adobe Typekit but I've had no luck so far. Would you be able to take a look for me?
Can you post a link to our website?
Then we can have a look and inspect that.
Before you post
Use the Search Feature. Maybe there is already a solution to your issue.
1. Update Lay Theme and all Lay Theme Addons
2. Disable all Plugins
3. Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code ", click "Save Changes"
4. Now see if your problem solved itself
5. Go here, see if your problem is listed here:
When you post:
1. Post a link to where the problem is
2. If the problem is difficult to explain, post screenshots / link to a video to explain it