I want to change the font used for the site title so it matches the look of our corporate font. However, I’m 10 years rusty on html and css and new to WP so I’m having trouble. Your tutorials (great help by the way) talk about either editing the CSS in a child theme (already installed) or using a plugin like WP Google Fonts.
The challenge I face is the plugin only offers options for body, h1 to h6, blockquotes, paragraphs, and lists. If I look at the CSS (which would be my preferred way to make the change as I only want this one change), I think the code you have that relates to the site title font is:
@font-face {
font-family: ‘raleway’;
src: url(‘fonts/raleway-regular.eot’);
src: url(‘fonts/raleway-regular.eot?#iefix’) format(’embedded-opentype’),
url(‘fonts/raleway-regular.woff’) format(‘woff’),
url(‘fonts/raleway-regular.ttf’) format(‘truetype’),
url(‘fonts/raleway-regular.svg#ralewayregular’) format(‘svg’);
font-weight: normal;
font-style: normal;
}
#cir-site-title {
font: normal 2.313em/1em raleway;
margin: 3px 0 0;
…but the example information Google have on how to add a fond to the CSS is quite different:
h1 { font-family: ‘Metrophobic’, Arial, serif; font-weight: 400; }
…not similar enough to enable an easy cut and paste. To make the change, would I be correct to add:
@font-face {
font-family: ‘ChosenFONT’;
src: url(‘fonts/ChosenFONT-regular.eot’);
src: url(‘fonts/ChosenFONT-regular.eot?#iefix’) format(’embedded-opentype’),
url(‘fonts/ChosenFONT-regular.woff’) format(‘woff’),
url(‘fonts/ChosenFONT-regular.ttf’) format(‘truetype’),
url(‘fonts/ChosenFONT-regular.svg#ChosenFONTregular’) format(‘svg’);
font-weight: normal;
font-style: normal;
}
to call the font and then:
#cir-site-title {
font: normal 2.313em/1em ChosenFONT;
margin: 3px 0 0;
to implement it?
Thanks, John