Tagged: Google font
April 11, 2013 at 9:30 pm #34910
I purchased a font through myfonts.com, and I want to use it for my headers.
The font installation guide tells me to
“place a reference to the fonts’ css file in the
headsection of your website’s HTML code. Make sure that the reference appears on all HTML pages of your site.”
Could someone please tell me in which file I should add this reference? My child theme has a functions.php and a style.css, but no header.php.
I can see a header.php in the Genesis Framework, but I understood we shouldn’t change these files?
Thank youApril 11, 2013 at 9:56 pm #34913
joycegraceParticipantPost count: 57
Under theme settings, at the bottom there is a place to enter header and footer scripts.
Or you can install Genesis Simple Hooks and add things to the head using that, it’s very simple.
But if these are font files you probably want to create an @font-embed using something like fontsquirrel.com to convert all the files for use on Web browsers first. When you create that package, in the download, there are very clear instructions on how to get it set up in your CSS file.
April 11, 2013 at 10:05 pm #34918
TWFParticipantPost count: 18
Hello, you can put the script to header/footer scripts
April 12, 2013 at 7:19 pm #35122
Thank you for your help.
I added the code to the header section, using both suggestions (header scripts in theme settings / simple hooks plugin). In both instances the font loaded correctly for the home page only.
So the titles were in the new font on the home page. But on all other pages, the titles reverted to the default (arial).
The fonts have already been converted to web use, and the MyFontsWebFontsKit.css is doing @fontface calls. The instructions in the webfont package tell me to add
<link rel=”stylesheet” type=”text/css” href=”www.momgoesonline.com/fonts/MyFontsWebfontsKit.css”>
to the head section of my website page, making sure it is added to all pages.
I just have no idea how to do that, and the header scripts in the settings page and the simple hooks only seem to work for the home page?
Through Firebug I can see that I have added the fonts to the correct title tags on all pages, but that the new font (PRoxima Nova) is not being picked up, and that the titles revert to the default Arial. (The website is Mom Goes Online)
Can anyone tell me how to add the code to the head section of all pages? Do I need to add a call in functions.php?April 12, 2013 at 8:15 pm #35134
TWFParticipantPost count: 18
Hello, your <h1><h2> and sidebar titles , are in ProximaNova-Bold,arial,sans-serif , on home, post, category.
To insert the code, I was thinking more in genesis -> Theme settings -> Header and Footer Scripts.(header)
Sorry for my english
April 12, 2013 at 8:22 pm #35137
braddaltonParticipantPost count: 10598
I think you should simply use the download kit which Joyce suggested and upload the files to your child theme.
You can add the CSS to your child themes style.css file or upload the entire folder to your child themes root directory.
If you want to add a custom function:
add_action(‘wp_head’, ‘ref_custom_fonts’, 5 );
echo ‘<link rel=”stylesheet” type=”text/css” href=”www.momgoesonline.com/fonts/MyFontsWebfontsKit.css”>';
This outputs in the source on all pages. Same as if you added it to Simple hooks wrapped in php tags without the hook.
You can change the hook to [php]genesis_meta[/php] or any other header hooks.
Or you can also install a plugin http://wordpress.org/extend/plugins/font-uploader/
Help Installing Fonts http://www.fontsquirrel.com/help
April 12, 2013 at 9:00 pm #35153
Thx for your help!
@braddalton – I tried what you said (You can add the CSS to your child themes style.css )
So I added
in the style.css file and that worked! woo hoo!
So unless I get told this is a bad way of doing it, I am inclined to leave it?
You must be logged in to reply to this topic.