-
AuthorPosts
-
January 6, 2016 at 10:19 pm #735276
Hello There,
Upon checking your font, you are using .otf and it is not the standard font and it is not compatible is some browser. You need to convert this font from .otf file to .ttf, .otf, .eot, .woff and .svg files. This is the proper way of using a custom font in your site which ensure that every site visitor is seeing the same font as what you have envisioned. You can use this online font converter tools:
http://www.font2web.com
http://www.freefontconverter.comOnce you have converted your .otf file to all the needed files, you may use this custom css:
@font-face { font-family: 'AvenirNextLTPro-Regular'; src: url('http://anthillrealtors.co.id/wp-content/themes/x-child/fonts/AvenirNextLTPro-Regular.eot'); src: url('http://anthillrealtors.co.id/wp-content/themes/x-child/fonts/AvenirNextLTPro-Regular.eot?#iefix') format('embedded-opentype'), url('http://anthillrealtors.co.id/wp-content/themes/x-child/fonts/AvenirNextLTPro-Regular.woff') format('woff'), url('http://anthillrealtors.co.id/wp-content/themes/x-child/fonts/AvenirNextLTPro-Regular.ttf') format('truetype'), url('http://anthillrealtors.co.id/wp-content/themes/x-child/fonts/AvenirNextLTPro-Regular.svg#AvenirNextLTPro-Regular') format('svg'); } body{ font-family: 'AvenirNextLTPro-Regular'; }
Hope this helps. Please let us know how it goes.
January 6, 2016 at 11:30 pm #735358Hi there!
Unfortunately we still are unable to get the font up there but I sense we are getting close to it!
I attached two attachment to check with you whether
1) Upload in the correct directory
2) Should replace /wp-content/themes/x-child/Fonts with public_html/wp-content/themes/x-child/FontsThank you in advance!
January 6, 2016 at 11:46 pm #735372Hi there,
Use this CSS code instead:
@font-face { font-family: 'AvenirNextLTPro-Regular'; src: url('http://anthillrealtors.co.id/wp-content/themes/x-child/Fonts/AvenirNextLTPro-Regular.eot'); src: url('http://anthillrealtors.co.id/wp-content/themes/x-child/Fonts/AvenirNextLTPro-Regular.eot?#iefix') format('embedded-opentype'), url('http://anthillrealtors.co.id/wp-content/themes/x-child/Fonts/AvenirNextLTPro-Regular.woff') format('woff'), url('http://anthillrealtors.co.id/wp-content/themes/x-child/Fonts/AvenirNextLTPro-Regular.ttf') format('truetype'), url('http://anthillrealtors.co.id/wp-content/themes/x-child/Fonts/AvenirNextLTPro-Regular.svg#AvenirNextLTPro-Regular') format('svg'); } body{ font-family: 'AvenirNextLTPro-Regular'; }
The name of your directory is in capital, so I’ve replaced fonts to Fonts.
Thank you!
January 7, 2016 at 12:14 am #735408Hi there! Sorry for that stubborn mistake!
The font has successfully been uploaded! Just one last question! Not everything is changed to the font I want (Custom Headline, contact form, buttons) is there a universal command to change everything to the font i want?
Sorry and thank you so much
January 7, 2016 at 12:25 am #735419Hello Again,
To apply the custom font to all elements in your site, please update your custom css and use this instead:
body, body *{ font-family: 'AvenirNextLTPro-Regular' !important; }
We would loved to know if this has work for you. Thank you.
January 7, 2016 at 1:03 am #735450I want to thank you so much for helping in this long and tiring process! Very educational!
Thank you for patience and hope you and have a wonderful year ahead!
Happy 2016!!January 7, 2016 at 1:06 am #735453Hey There,
You’re welcome! We are just glad we were able to help you out.
Thanks for letting us know that it has worked for you.
If you need anything else we can help you with, don’t hesitate to open another thread.Best Regards.
January 7, 2016 at 1:18 am #735455Hi there!
The code did change everything to avenir next
body,
body *{
font-family: ‘AvenirNextLTPro-Regular’ !important;
}However, it causes the social icons (and many other icons) to bug and revolution slider fonts to change too?
Is there a way to fix this?
January 7, 2016 at 1:30 am #735458Hello There,
Please update again the code
body, article, aside, footer, header, hgroup, main, nav, section, h1, h2, h3, h4, h5, h6, p, div input, button, select, textarea{ font-family: 'AvenirNextLTPro-Regular'; }
This way it doesn’t remove the font icons. Hope this helps.
-
AuthorPosts