Build Your Own Business Website header image

How to Use Adobe Edge Fonts with Thesis 2.1

Difficulty Level -

Filed Under Topics -

Listed Under Lesson Subjects -

Applies to -

Whoops, you've found some premium content!

Watch the opening clip of this video to preview it,
the full video is available to paid members.

In this session we demonstrate how to use Adobe Edge Fonts with Thesis 2.1 and show where to place the scripts and the font family. We have prepared a seminar for this in Customize Thesis Like a Pro lesson number 2 where we go through the process of adding adobe fonts and talk about the different types of custom fonts available.

Video Transcript

Member: So here’s something I was just looking it. You know I have a subscription to the Adobe cloud and they give you some typekit option for fonts and I was wondering how you’d implement that?

Rick: You know I have prepared a seminar for that and it’s likely to be advertised by next week at this poont. It’s essentially lesson number 2 in Customize Thesis Like a Pro that will go through the process of adding Adobe fonts…my dog is going nuts.

Member: (chuckles)

Rick: I don’t know if you can hear that.

Member: Yeah, I can.

Rick: That’s the barking chihuahua cafe.

Member: Oh, okay! (laughs) it’s cute. Well, I have a house full of cats that I have to look out of my office when I’m doing things like this because they decide they have to be involved…

Rick: Well I’m in the basement, that chihuahua is upstairs in the other end of the house and you can still hear him (laughs)

Member: Wow. He’s got a voice! (laughs)

Rick: He’s got a serious voice (laughs) Anyway, the short answer to how you would use the Adobe Edge font so let’s see…Adobe Edge Font…

Member: Well, I did a search for Thesis 2.1 and Adobe Typekit and I didn’t really find a lot on it.

Rick: No, there aren’t a lot…and what do I have to do…do I have to be logged in? I also have an Adobe Cloud account.

Member: Yeah.

Rick: Well, I guess I don’t have to be logged in, let’s just say I’m going to choose this one here. So, in order to use this font, all I have to do is copy this script, come over to Thesis Home and go to the html head…

Member: Ahh, okay.

Rick: And I go to Head Scripts and place that script in the head like that. And then grab the font family and then let’s just say, what do I want to do? I want to change the site title, so now I come to custom css…

Member: Ahh, okay.

Rick: And say #site_title{

And then paste the font family like that. Save the custom css and it will be like that.

Member: Oh, look at that.

Rick: It’s that simple.

Member: So when I went to mine it sent me to browse fonts on Typekit…rather than Adobe Edge.

Rick: Well, see Adoble bought Typekit.

Member: Oh, okay.

Rick: Typekit fonts, you have to pay for it. Adobe Edge fonts, you don’t have to pay for it. But right now, Adobe is, obviously, it’s not even asking me to login to my cloud account.

Member: Yeah.

Rick: So clearly, Adobe has decided that it’s going to give away a bunch of fonts.

Member: Okay.

Rick: It’s advertising that it’s giving them away to its cloud subscribers.

Member: Okay.

Rick: I don’t believe your Typekit fonts are free…

Member: Really?

Rick: I don’t think so, but let’s see here…

Member: Well, yeah ‘cause I kind of wondered about that. It didn’t make me…hey, I just logged in through Adobe but it does have purchased fonts on there like when I log in to it through, you know, through that app that shows up in your toolbar…

Rick: Yeah

Member: That you can open up and upgrade from your desktop and everything. So when I went, it sends me to Typekit and then it has me, you know, launch a kit editor and stuff like that and then you assign it to a website, you know, your domain that you want to use it for…but they have the script tag just like that, so…

Rick: So the thing is that, Typekit…oh let’s see…Adobe wants to install an update before I can open up my cloud account.

Member: Oh, of course. Of course.

Rick: But, you know, I don’t know how long the Edge fonts are going to be available. But as long as they are available, they are free. Theoretically, they’re available to cloud subscribers because that’s the way Edge works. And you can see more fonts like this one on Typekit, but if you just click on Aguafina script…oh, we’re going to remove that one. If we just do that, come back over here to the head. Oh yeah, right up here HTML head. Oops, I guess I didn’t copy that, did I?

Member: Oh, I think you copied that but put it on the side…

Rick: Yeah I did, add it to the clipboard. And I’d come back over…

Member: You can add them both in there…

Rick: Yup.

Member: You can put the two different…oh, okay. That’s pretty cool.

Rick: And so, this is the site tagline. So, now we come over to custom css and under a tagline, paste that.

Member: So in the custom css, you don’t have to put custom in front of it?

Rick: Not in Thesis 2, no.

Member: Oh, okay.

Rick: In fact, if you put it in front of it, it won’t work.

Member: Oh, okay. Well that’s good to know.

Rick: So there it is.

Member: Oh look at that. Is that the font? I thought it is…

Rick: Aguafina script cursive

Member: I thought it was different than that. I thought that was a different font…

Rick: It totally looks different, doesn’t it?

Member: Yeah, it looks like a totally different font like it defaulted to something that it shouldn’t have.

Rick: Aguafina script…this is…that’s very odd isn’t it?

Member: That looks like Comic Sans almost.

Rick: Oh it’s cursive, that’s not cursive though. So maybe there is an issue here with getting that CSS well, let’s just see what it says. Oh, I see. You can’t actually…what you really have to do is do what they’re suggesting which is combine them.

Member: Oh, okay.

Rick: What they had us do was combine them. So we have these two things like this. And you had the Aguafina Aclonica…

Member: Okay.

Rick: And instead of doing that, I switched to using two different script calls. But I think the two different script calls…oh no, I just must not have saved it…

Member: Oh, okay. Yeah, that’s right. You probably didn’t go over to save it.

Rick: Huh. So anyway…

Member: There you go…

Rick: That’s what it looks like now.

Member: Alright.

Rick: So…

Member: Alright.

Rick: It’s relatively straightforward so you got yourself a little “why would you bother teaching a seminar on it?”…

Member: Yeah.

Rick: Because there are several different fonts to do, right? I mean there’s Google fonts, Typekit actually is a little different than Adobe Edge…so there’s that. There’s Font Squirrel, there’s Cufon fonts and there are self-hosted fonts. So I’m going to teach all that stuff plus a bunch of font-related css-like drop shadow or text shadow, stuff like that.

Member: Okay, that sounds great.

0 Comments… add one

Save $200 on Membership Now!

Start learning today for as little as
$0.82 PER DAY!
Subscription Options
0 comments… add one

Leave a Comment