I am not a programmer. The language is foreign. I am creating a WordPress website. I created a child-theme.
- I read the theme documentation. Understood very little.
- sent an email to the theme owner. No answer (2 weeks ago)
- searched the web – found many websites – i.e. http://www.w3schools.com/ – http://css-tricks.com/sans-serif/ & others – me, no speak the language. Can you place html code in a CSS file?
The child-theme consists of a new style.css file. The top section of the style.css file is what was needed to create the child-theme. Then there are color changes which I inserted & that has gone very well.
Changing the font family is confusing. Poking around the parent theme and also using ‘Firebug’ the font(s) seem(s) to be (‘inherited’?). .genericon, ‘Roboto Condensed’, Sans-serif, Arimo, Arial and a few other standard MS Word fonts. I saw on the Google font site a couple of fonts I would prefer to use for my website.
- How do I (or even can I) download the Google fonts to the Style.css file?
- What do I need to insert in the child style.css file to override the parent fonts?
In case this is important, the theme has more than one template (PHP?) option. I am using W7 OS.
The Google Fonts site is really direct and helpful.
In your example, you mention Roboto. Here’s the page for that font.
You would check the varieties of Roboto that you want to be able to use on your site under Step 1.
Step 2 allows you to select additional character sets — for example if you were likely to be displaying text in Russian.
Step 3 gives you three ways to “enable” the font on your site. You’ll be placing a line of code somewhere, telling users’ browsers to go and get the font from Google when called for. The easiest way to do this is probably the @import option. Copy and paste the code under that tab into your
style.cssat the top (that’s important — it should go before any of the stuff describing the layout or type on your stylesheet). Your sub-theme likely has a bunch of other@importlines up there already.Step 4 shows what specifically you need to tell your stylesheet to look for.
Good luck!
External style sheets have the highest hierarchy, so just specify your styles with the id, class or element name.
Google is your friend here.
To use google fonts, go to the google font page and search for your font with the search box on the left, then click add to collection. Once in your collection, go to your collection and click “use”.
You should get an “@import()” code, place this at the top of your external sheet.