Tagged: custom font
-
AuthorPosts
-
October 4, 2017 at 9:40 pm #860326
Dear Enfold Team,
i followed up all the instructions in forums to add my custom font but no success. Here is the code i added to my quick CSS after uploading my custom font to a “Fonts” folder in Enfold theme directory:
@font-face {
font-family: ‘iransansweblight’;
src: url(‘fonts/iransansweb_light-webfont.eot?#’) format(‘eot’),
url(‘fonts/iransansweb_light-webfont.woff2’) format(‘woff2’),
url(‘fonts/iransansweb_light-webfont.woff’) format(‘woff’);
url(‘fonts/iransansweb_light-webfont.ttf’) format(‘truetype’);
}
h1, h2, h3, h4, h5 , h6, body p {
font-family: “iransansweblight” !important;
}
#avia-menu .avia-menu-text { font-family: “iransansweblight” !important; }Could you please tell me where i’m doing wrong?
Thanks a lot!
GsharifiOctober 4, 2017 at 10:30 pm #860340try the absolute path to see if you have addressed it with your relative path correct.
I would try it in style.css of your child-theme – which you can easily edit via dashboard – appearance – edit.
and the urls are comma separated – and only the last one gets a semicolon !October 5, 2017 at 10:14 am #860506Hey Guenni i tried it in style.css, no luck.
edited the urls commas. still no luck.
also tried the absolute path too. still no luck.
Any idea?October 5, 2017 at 11:56 am #860538Hi,
Could you post a link to the site in question so that we can take a closer look please? Also please point out on what element you are trying to apply the new font to.
Best regards,
RikardOctober 5, 2017 at 11:59 am #860540Hey Rikard
The site: malekzadegan.com
I want to have all the menu options, body, footer and headers in my custom font.
Regards
GsharifiOctober 5, 2017 at 3:27 pm #860609hm – i can see the font on nearly all letters.
except the logo :lol
so clear all cache options (browser etc.)October 5, 2017 at 10:23 pm #860766well i think you are not familiar with Persian fonts, Guenni. That’s why you cannot recognize, which font i am expecting to show up.
October 6, 2017 at 10:16 am #860923Could anyone from the Kriesi Team help me?!
October 6, 2017 at 3:21 pm #861047this assumption is probably correct
look in your css code if you find any entries for IRANSans – because i do not find in your code the setted iransansweblight.
maybe it is an inline-code transfered via copy&paste from word to text block elementOctober 6, 2017 at 3:46 pm #861053and by the way you entered it in the enfold style css ?
/*
* PLEASE DO NOT EDIT THIS FILE!
*
* This file is only in your themefolder for WordPress to recognize basic theme data like name and version
* CSS Rules in this file will not be used by the theme.
* Instead use the custom.css file that is located in your themes /css/ folder to add your styles.
* You can copy a style rule from any of your css files and paste it in custom.css and
* it will override the original style. If you just want to add small css snippets you might also
* want to consider to add it to the designated CSS option field in your themes backend at: Theme Options->General Styling
*/and the real code you entered is:
@font-face { font-family: 'IRANSansWeb-Light'; src: url('IRANSansWeb-Light.eot?#iefix') format('embedded-opentype'), url('IRANSansWeb-Light.woff') format('woff'), url('IRANSansWeb-Light.ttf') format('truetype'), url('IRANSansWeb-Light.svg#IRANSansWeb-Light') format('svg'); }
so font-family has to be determined as: IRANSansWeb-Light
where exactly is your fonts folder with the IRANSansWeb-Light ?
October 6, 2017 at 4:08 pm #861058if you have no child-theme the best place maybe for it the custom.css
October 6, 2017 at 4:16 pm #861062Hey Guenni.
I’ve tried all of the things you said. still no luck.
some converters find the family as “iransans” some other find it as “iransanweb-light” or even “iransansweblight”.
No luck with any of them.
BTW the files were both in enfold root directory and a folder named “fonts” no luck with any of them.October 6, 2017 at 7:05 pm #861139what makes me wonder is that you haven’t eot itself and woff2 – nevertheless try this please in custom.css
Edit why don’t you tell us not the whole truth – you got woff2 and eot – this is important too!
1) i see you inserted again a relative path ( the path to the enfold root direktory is something different than what you did)
The root directory of enfold is not the root directory of your url2) Custom.css is the right way – but you inserted it in the mediaquery part.
this is not needed. place the @import rule above
so delete everything in this file and insert:@font-face { font-family: 'IRANSansWeb-Light'; src: url('http://malekzadegan.com/wp-content/themes/enfold/fonts/IRANSansWeb-Light.eot'); src: url('http://malekzadegan.com/wp-content/themes/enfold/fonts/IRANSansWeb-Light.eot?#iefix') format('embedded-opentype'), url('http://malekzadegan.com/wp-content/themes/enfold/fonts/IRANSansWeb-Light.woff2') format('woff2'), url('http://malekzadegan.com/wp-content/themes/enfold/fonts/IRANSansWeb-Light.woff') format('woff'), url('http://malekzadegan.com/wp-content/themes/enfold/fonts/IRANSansWeb-Light.ttf') format('truetype'), url('http://malekzadegan.com/wp-content/themes/enfold/fonts/IRANSansWeb-Light.svg#IRANSansWeb-Light') format('svg'); } @media only screen and (min-width: 768px) { } @media only screen and (max-width: 767px) { }
October 6, 2017 at 8:14 pm #861167are you able to copy&paste ?
can you please test it with absolut paththis is what you did:
@font-face { font-family: "IRANSansWeb-Light"; src: url("IRANSansWeb-Light.eot?#iefix") format("embedded-opentype"), url("IRANSansWeb-Light.woff") format("woff"), url("IRANSansWeb-Light.woff2") format("woff2"), url("IRANSansWeb-Light.ttf") format("truetype"), url("IRANSansWeb-Light.svg#IRANSansWeb-Light") format("svg"); } @media only screen and (min-width: 768px) { @media only screen and (max-width: 767px) { } }
the media queries are corrupted (curved brackets are not the way i did – open/close )
here stops my help now. I can not anymore.
- This reply was modified 7 years, 2 months ago by Guenni007.
October 7, 2017 at 6:10 pm #861402still no luck Guenni!
October 7, 2017 at 7:27 pm #861420please read the entries not only look for code :
you have still in your custom.css:and that is wrong
@font-face { font-family: "IRANSansWeb-Light"; src: url("IRANSansWeb-Light.eot?#iefix") format("embedded-opentype"), url("IRANSansWeb-Light.woff") format("woff"), url("IRANSansWeb-Light.woff2") format("woff2"), url("IRANSansWeb-Light.ttf") format("truetype"), url("IRANSansWeb-Light.svg#IRANSansWeb-Light") format("svg"); } @media only screen and (min-width: 768px) { @media only screen and (max-width: 767px) { } }
if you have your fonts in: malekzadegan.com/wp-content/themes/enfold/fonts
please try :@font-face { font-family: 'IRANSansWeb-Light'; src: url('http://malekzadegan.com/wp-content/themes/enfold/fonts/IRANSansWeb-Light.eot'); src: url('http://malekzadegan.com/wp-content/themes/enfold/fonts/IRANSansWeb-Light.eot?#iefix') format('embedded-opentype'), url('http://malekzadegan.com/wp-content/themes/enfold/fonts/IRANSansWeb-Light.woff2') format('woff2'), url('http://malekzadegan.com/wp-content/themes/enfold/fonts/IRANSansWeb-Light.woff') format('woff'), url('http://malekzadegan.com/wp-content/themes/enfold/fonts/IRANSansWeb-Light.ttf') format('truetype'), url('http://malekzadegan.com/wp-content/themes/enfold/fonts/IRANSansWeb-Light.svg#IRANSansWeb-Light') format('svg'); } @media only screen and (min-width: 768px) { } @media only screen and (max-width: 767px) { }
I’m out now – you are a bit “advice-resistant”
wait for a modLast advice: try a plugin like https://de.wordpress.org/plugins/use-any-font/
October 9, 2017 at 7:55 am #861769Hi,
Yes, please use absolute url instead of relative because the font directory may be incorrect. Example above:
http://malekzadegan.com/wp-content/themes/enfold/fonts/IRANSansWeb-Light.eot
Best regards,
IsmaelOctober 9, 2017 at 9:49 pm #862129i’m sorry that you think i’m advice-resistant. The plugin you mentioned didn’t work well with persian fonts. The body did not change, although i assigned the font to body text and some other elements.
thank you for your advice though.October 9, 2017 at 9:51 pm #862131Hi
i tried all the possible ways before i open this ticket. I opened it, after all my tries.October 10, 2017 at 8:13 am #862341Hi,
We’ll try to help you but we need admin access to the site. Please post the admin url and login credentials in the private field.
Best regards,
IsmaelOctober 10, 2017 at 1:29 pm #862447October 11, 2017 at 6:30 am #862742Hi Gsharifi,
Did you try to use the full URL for your font and did you have any luck with it? Thanks @guenni007 for helping out.
Best regards,
RikardOctober 11, 2017 at 7:15 pm #862988This reply has been marked as private.October 11, 2017 at 9:49 pm #863033just one comment : you have a different code itn rtl.css
so it is not the css you used – it is the path you used instead.
both css ( rtl.css and custom.css) are on the same layer (path) no difference at all.
We could have less time if you tried the absolute path- This reply was modified 7 years, 2 months ago by Guenni007.
October 15, 2017 at 9:51 pm #864562Hey everyone!
i solved it myself! The trick was to edit rtl.css file. It was not about custom.css or quick.css or about the directory! All about the tricky rtl.css file and adding the font urls there and adding the import command on the top.
Thanks for your helps though!October 15, 2017 at 10:34 pm #864578 -
AuthorPosts
- The topic ‘Custom font added but nothing happens’ is closed to new replies.