Tagged: CDN, google fonts
-
AuthorPosts
-
February 26, 2017 at 12:11 pm #751922
Hi guys
Still loving the theme after all these years!!
I would like to serve Google fonts from my CDN (KeyCDN). I have the CSS ready but before I mess everything up I would like to know what CSS I need to insert to tell the theme to get the fonts from the CDN location rather than making a call to the Google servers.
Can you help please?
Thanks in advance
EdFebruary 26, 2017 at 7:15 pm #752000Hey Swarez,
It sounds like you have already enqueue the fonts in your functions.php, and now want to @import the new url to your style sheet.@import url(https://your.CDN.url);
If you want to review enqueuing, check it out here: https://kriesi.at/support/topic/new-custom-font/#post-121902
Best regards,
MikeFebruary 26, 2017 at 8:29 pm #752021Thanks Mike
Sorry to be a dummy but that is a little over my technical prowess!
I have some CSS but I do not know where to put it or even if it will work.
I have a fonts folder in the root directory and have this (an example for Lato font) as the base CSS with CDN location but I do not know how to tell the theme to go there for fonts instead of calling the Google servers.The Lato example CSS:
/* lato-300 - latin */ @font-face { font-family: 'Lato'; font-style: normal; font-weight: 300; src: url('https://cdn.swarez.co.uk/fonts/lato-v11-latin-300.eot'); /* IE9 Compat Modes */ src: local('Lato Light'), local('Lato-Light'), url('https://cdn.swarez.co.uk/fonts/lato-v11-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('https://cdn.swarez.co.uk/fonts/lato-v11-latin-300.woff2') format('woff2'), /* Super Modern Browsers */ url('https://cdn.swarez.co.uk/fonts/lato-v11-latin-300.woff') format('woff'), /* Modern Browsers */ url('https://cdn.swarez.co.uk/fonts/lato-v11-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */ url('https://cdn.swarez.co.uk/fonts/lato-v11-latin-300.svg#Lato') format('svg'); /* Legacy iOS */ }
Any help is appreciated.
Regards
EdFebruary 26, 2017 at 9:21 pm #752035Hi,
Place your code in your child theme css or in the General Styling > Quick CSS field
Also include this:h1, h2, h3, h4, h5, h6, p, tr.pricing-row td, #top .portfolio-title, .callout .content-area, .avia-big-box .avia-innerbox { font-family:"Lato"; }
Best regards,
MikeFebruary 26, 2017 at 9:38 pm #752041I appreciate all your help Mike.
I now find the problem being that I also use Oswald for all the headers and titles etc.
Essentially the theme is using these two fonts in the Options which is great for all the page styling – and that’s how i want to keep it.
However, now I have added the CSS and the code you kindly gave me I only have Oswald or Lato and not both. Additionally there is no weighting for things like Special Headings which are different when i use the theme options rather than putting in my own CSS.Is there any way the theme can simply be told to replace the source of the fonts from Google API’s to my CDN? The way this is right now is stripping away all the styling…. I am struggling I admit… Sorry Mike – I am very grateful for your help
Best
EdFebruary 26, 2017 at 10:32 pm #752063Hi,
Oh, I see, you should remove the code I gave you with the h1, h2,… that is replacing all your headers.
Sorry
Best regards,
MikeFebruary 27, 2017 at 11:07 pm #752606Thanks Mike
I still can’t get this to work properly but thanks for trying anyway.
Regards
EdFebruary 27, 2017 at 11:32 pm #752621Sorry to ask again Mike – what does this do?
@import url(https://cdn.myurl.co.uk);
Thanks
EdMarch 4, 2017 at 5:29 pm #755627Hi,
The @import is one way to tell your theme where to get your font, but since you are using “src: url” in your @font-face you wont need to use @import.
If you are still having trouble please include a admin login in the private content area so we can take a closer look.Best regards,
Mike -
AuthorPosts
- You must be logged in to reply to this topic.