System font not showing on computers it's not installed on

25 Posts

CharlieT posted this 11 April 2016

Hi guys,

I've set my headings to be Bebas Neu, a system font in my wordpress theme. I've attmepted to edit the CSS:

 @font-face {
    font-family: 'bebas_neueregular';
    src: url('bebasneue-webfont.eot');
    src: url('bebasneue-webfont.eot?#iefix') format('embedded-opentype'),
         url('bebasneue-webfont.woff2') format('woff2'),
         url('bebasneue-webfont.woff') format('woff'),
         url('bebasneue-webfont.ttf') format('truetype'),
         url('bebasneue-webfont.svg#bebas_neueregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

It's still not showing on devices the font isn't installed on. I read that SSL (HTTPS) could be an issue also. Can you advise what I'm doing wrong?

The site is https://soldieron.org.au

Cheers,
Charlie.

Hi guys, I've set my headings to be Bebas Neu, a system font in my wordpress theme. I've attmepted to edit the CSS: @font-face { font-family: 'bebas_neueregular'; src: url('bebasneue-webfont.eot'); src: url('bebasneue-webfont.eot?#iefix') format('embedded-opentype'), url('bebasneue-webfont.woff2') format('woff2'), url('bebasneue-webfont.woff') format('woff'), url('bebasneue-webfont.ttf') format('truetype'), url('bebasneue-webfont.svg#bebas_neueregular') format('svg'); font-weight: normal; font-style: normal; } It's still not showing on devices the font isn't installed on. I read that SSL (HTTPS) could be an issue also. Can you advise what I'm doing wrong? The site is https://soldieron.org.au Cheers, Charlie.

font custom-font Fontface

Vote to pay developers attention to this features or issue.

11 Comments

Order By: Standard | Newest

1818 Posts

Stagger Lee posted this 11 April 2016

Is your bootstrap.css in same folder (level) as fonts ? According to paths it should be.

25 Posts

CharlieT posted this 12 April 2016

Hi Stagger Lee,

Bootstrap.css is in the same folder as the fonts folder. I have copied the ttf and woff files into the fonts folder. Am I missing a step? Could the SSL certificate be an issue?

Cheers,
Charlie.

Hi Stagger Lee, Bootstrap.css is in the same folder as the fonts folder. I have copied the ttf and woff files into the fonts folder. Am I missing a step? Could the SSL certificate be an issue? Cheers, Charlie.

1818 Posts

Stagger Lee posted this 12 April 2016

No "fonts folder". Font raw files should be where bootstrap.css is. Or change paths to "url('fonts/bebasneue-webfont.woff2') format('woff2'),".
Do same for preview theme, if you want to see changes in Themler.

No "fonts folder". Font raw files should be where bootstrap.css is. Or change paths to "url('fonts/bebasneue-webfont.woff2') format('woff2'),". Do same for preview theme, if you want to see changes in Themler.

25 Posts

CharlieT posted this 13 April 2016

I copied the font files into my theme's folder, on the same level as bootstrap.css:

The problems remains. Am I missing something here?

I copied the font files into my theme's folder, on the same level as bootstrap.css: !font2.png! The problems remains. Am I missing something here?

font2.png

1818 Posts

Stagger Lee posted this 13 April 2016

It is just one part of job. Find in forum topic how to do second part. It is new, maybe from one week ago. You need to repeat it for theme_preview folder.

25 Posts

CharlieT posted this 14 April 2016

I've repeated that step for the preview folder to no avail and can't find the recent topic in the forum. can you remember what it was called?

25 Posts

CharlieT posted this 14 April 2016

I found this thread: http://answers.themler.com/questions/72076/can-t-find-themler-additional-css

Modified the CSS to:

 @font-face {
    font-family: 'bebas_neueregular';
    src: url('https://www.soldieron.org.au/wp-content/themes/newseasonSO/bebasneue-webfont.eot');
    src: url('https://www.soldieron.org.au/wp-content/themes/newseasonSO/bebasneue-webfont.eot?#iefix') format('embedded-opentype'),
         url('https://www.soldieron.org.au/wp-content/themes/newseasonSO/bebasneue-webfont.woff2') format('woff2'),
         url('https://www.soldieron.org.au/wp-content/themes/newseasonSO/bebasneue-webfont.woff') format('woff'),
         url('https://www.soldieron.org.au/wp-content/themes/newseasonSO/bebasneue-webfont.ttf') format('truetype'),
         url('https://www.soldieron.org.au/wp-content/themes/newseasonSO/bebasneue-webfont.svg#bebas_neueregular') format('svg');
    font-weight: normal;
    font-style: normal;}

Still no luck :(

I found this thread: http://answers.themler.com/questions/72076/can-t-find-themler-additional-css Modified the CSS to: @font-face { font-family: 'bebas_neueregular'; src: url('https://www.soldieron.org.au/wp-content/themes/newseasonSO/bebasneue-webfont.eot'); src: url('https://www.soldieron.org.au/wp-content/themes/newseasonSO/bebasneue-webfont.eot?#iefix') format('embedded-opentype'), url('https://www.soldieron.org.au/wp-content/themes/newseasonSO/bebasneue-webfont.woff2') format('woff2'), url('https://www.soldieron.org.au/wp-content/themes/newseasonSO/bebasneue-webfont.woff') format('woff'), url('https://www.soldieron.org.au/wp-content/themes/newseasonSO/bebasneue-webfont.ttf') format('truetype'), url('https://www.soldieron.org.au/wp-content/themes/newseasonSO/bebasneue-webfont.svg#bebas_neueregular') format('svg'); font-weight: normal; font-style: normal;} Still no luck :(

1818 Posts

Stagger Lee posted this 14 April 2016

https://answers.themler.com/questions/41734/how-to-add-chinese-font-like-microsoft-yahei/

25 Posts

Is Solution

CharlieT posted this 14 April 2016

Stagger Lee, if I ever meet you I will buy you 7 beers!

The fix for me:

Added font files into below path

Added the below CSS:

 @font-face {
    font-family: 'bebas_neueregular';
    src: url('https://www.soldieron.org.au/wp-content/themes/newseasonSO/bebasneue-webfont.eot');
    src: url('https://www.soldieron.org.au/wp-content/themes/newseasonSO/bebasneue-webfont.eot?#iefix') format('embedded-opentype'),
         url('https://www.soldieron.org.au/wp-content/themes/newseasonSO/bebasneue-webfont.woff2') format('woff2'),
         url('https://www.soldieron.org.au/wp-content/themes/newseasonSO/bebasneue-webfont.woff') format('woff'),
         url('https://www.soldieron.org.au/wp-content/themes/newseasonSO/bebasneue-webfont.ttf') format('truetype'),
         url('https://www.soldieron.org.au/wp-content/themes/newseasonSO/bebasneue-webfont.svg#bebas_neueregular') format('svg');
    font-weight: normal;
    font-style: normal;}

Then went into Design >> Fonts >> Font Options and then pasted bebas_neueregular as the headings font.

Thanks Stagger Lee, you rock!

Stagger Lee, if I ever meet you I will buy you 7 beers! The fix for me: Added font files into below path Added the below CSS: @font-face { font-family: 'bebas_neueregular'; src: url('https://www.soldieron.org.au/wp-content/themes/newseasonSO/bebasneue-webfont.eot'); src: url('https://www.soldieron.org.au/wp-content/themes/newseasonSO/bebasneue-webfont.eot?#iefix') format('embedded-opentype'), url('https://www.soldieron.org.au/wp-content/themes/newseasonSO/bebasneue-webfont.woff2') format('woff2'), url('https://www.soldieron.org.au/wp-content/themes/newseasonSO/bebasneue-webfont.woff') format('woff'), url('https://www.soldieron.org.au/wp-content/themes/newseasonSO/bebasneue-webfont.ttf') format('truetype'), url('https://www.soldieron.org.au/wp-content/themes/newseasonSO/bebasneue-webfont.svg#bebas_neueregular') format('svg'); font-weight: normal; font-style: normal;} Then went into Design >> Fonts >> Font Options and then pasted bebas_neueregular as the headings font. Thanks Stagger Lee, you rock!

1818 Posts

Stagger Lee posted this 14 April 2016

You can use relative paths, as you did first time.
Mostly problem is if you forgot to paste font files in theme_preview folder. That it is why they allways work in Themler screen with absolute paths.

You can use relative paths, as you did first time. Mostly problem is if you forgot to paste font files in theme_preview folder. That it is why they allways work in Themler screen with absolute paths.

25 Posts

CharlieT posted this 15 April 2016

Thanks for the info! I will remember this for next time.