Change font styles for Graphene

  • ng_social


    Excuse me,

    Can anyone help me please..:)

    I’m using Graphene theme for our website, and I’d like to change the Font styles of the words ALL OVER the site. I’ve found the CSS codes with the help of Firebug.

    I want to use the font styles that I have downloaded from the net. It works when I change the font style codes thru CSS and view the website with MY computer, but if I view it using another computer (which does not have the same font installed), It goes back to the default font.

    Oh, and I’m just a beginner with this stuff, so I can’t really catch up with the “technical” terms. hehe..thanks much in advance!..



    Is the font style you downloaded a TTF?

    You would need to add a call in your stylesheet to import the font into the browser. The reason you can only see it on your computer is because you already have that font installed on that computer.


    #20601, I can only use True Type Fonts for my website?..

    I had the same idea, that the only reason I could see it is because I have it installed in my computer.

    Ok, so have to add a CALL to my style sheet and import the font to my website itself. exactly do i do that? I said, I’m still somewhat of a beginner right now.

    Thanks again.



    Well, they don’t have to be true types. I was simply assuming.

    But yes, you need to import the font into wordpress using your stylesheet.

    Do you have an @import url for the font you are wanting to use?



    Oh.ok., i don’t think I have an @import url for the fonts (‘coz I haven’t really dont anyhting to them). Do I have to make it myself? or should it go with the font when I donwload it?



    Well, google webfonts seem to be getting pretty big right now. Go here and see if you can find a similar font to what you are using.. and then let me know it’s name:



    Ok..thank you very much..can choose a couple of them? or just one?

    I’ll get back to you in a couple of minutes.

    Thanks again.



    Here’s the font that I’ve chosen: Mate SC



    You can choose multiple… but each one makes a separate call… slowing your page load times. The more you use, the longer your page must work.

    Okay, gimme a second to grab the code.

    Have you set up a child theme yet??



    If you haven’t, you can add this to your custom css box in graphene options menu.

    However, I still recommend setting up a child theme if you plan on making future adjustments.

    So, paste this into your css:

    @import url(;

    And then whatever element you want to use the font, add this property to it’s css:

    font-family: 'Mate SC', serif;

Viewing 10 posts - 1 through 10 (of 53 total)

  • You must be logged in to reply to this topic.
Graphene Themes Forum