-
The function esplanade_register_styles defines a list of web_fonts that can be used in the theme. I would like to add another font without changing the functions.php file.
I’m using a child theme. Can I add a little bit of code to add an extra font or do I have to copy the whole function to my own functions.php file?You need to change the entire function. I may add a filter for this in the next version, thanks for the idea.
Thanks for your reply and I think this would certainly be a nice feature for a next version!
For now I solved it in a little different way. I’ve added this line to my style.css
@import url(http://fonts.googleapis.com/css?family=Lobster);
and defined the font just for H1 manually. This is fine for me right now.Working on this problem I cam across another issue. I would like to change the color of H1, while H2-H6 should stay the default color. It appears that the color in style.css is overruled by the function esplanade_custom_styles() and the variable headings_color. Is there any way around this to assign different colors to the various headings?
Consider that using an @import cs rule can affect your website’s loading speed.
You can overrule any css declaration by adding
!importantto it. e.g.:h1 { color:#000 !important; }Why is my @import rule different from yours, when you use it for loading the Droid Web Font?
The !important code seems to work for H1. Thnx!
BTW: how can I include code in my posts on this forum, like you just did? I tried it before, but it was filtered out.
The theme loads the google font css file from the html document’s head, which makes it load in parallel with the theme’s stylesheet.
Using an @import rule in the theme’s stylesheet requires the stylesheet to be loadeded first which makes the files download serialized rather than parallel. See here for more details.
HTML tags are stripped out for non-admin users for security reasons.
Ok, I understand, but that’s something to figure out later. For now it’s working (we have a deadline…)
The security reasons are clear too, but I hoped there was something, that made it possible to display some code. That makes it easier to help others.
Hi,
I need to be able to add a custom font, having read the above I can see this could be somewhat tricky.
The company the site is for uses the font Lithos Pro Regular in the colour #2298a9. I have created the files and uploaded them to a directory, along with the style css.
But having looked at the above I can see this is locked out through the functions file – what can I do to be able to add the font to the site, it’s only for the header, but do not want to use an image.
ThanksLithos Pro Regular is not a Google Web Font, so this would be another topic. I wouldn’t know how to include a font like that…
For the logo, it’s better to create an image with transparency and insert it into the header file. I tried using custom fonts and due to some sort of layer added by the theme, the fonts just didn’t look right. Had to settle for the stock Google fonts although I was able to pull from those not included on the default menu, by using the method described above.
You must be logged in to reply to this topic.