Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #340274

    Hi,

    We’ve been using Enfold for the past 4 or so months with absolutely no issues until recently. We have loaded a custom font (non-web font) to be used within LayerSlider. I added the following code to custom.css:

    @font-face { font-family:’Lust’; src: url(‘wp-includes/fonts/2B62CD_1_0.ttf’) format(‘truetype’), url(‘wp-includes/fonts/2B62CD_1_0.woff’) format(‘woff’), url(‘wp-includes/fonts/2B62CD_1_0.eot’) format(‘embedded-opentype’), url(‘wp-includes/fonts/2B62CD_0_0.ttf’) format(‘truetype’) font-style: italic, oblique, url(‘wp-includes/fonts/2B62CD_0_0.woff’) format(‘woff’) font-style: italic, oblique, url(‘wp-includes/fonts/2B62CD_0_0.eot’) format(‘embedded-opentype’)font-style: italic, oblique,; }

    }

    Font is still uploaded in all those formats in FTP server.
    Within LayerSlider we would call “Lust” (w/o quotes) in the Font section under styles.

    This has worked perfectly for the past few months and it still works on my personal computers, but I believe that is because I have the font also installed in my font book on OS X. I recall when we first started working on the site that I verified the font by loading it on multiple Windows machines running both Chrome and IE – neither of which had the font installed.

    This issue was pointed out by the client that the font is no longer loading, and when I check on mobile (iPhone 6 running 8.1 using Safari) the font doesn’t load.

    We were running WP 3.9.2 and an older theme version – since this issue has came up, I have updated everything to the newest versions and the font still is not loading.

    I’ve created login information for you in the private section to look into this.

    These are direct links to the original font:
    http://lust.positype.com/Lust/
    http://www.myfonts.com/fonts/positype/lust/

    Thanks.

    • This topic was modified 10 years, 2 months ago by jdygas.
    #340500

    Hi jdygas!

    Thank you for using Enfold.

    Why is it located on the wp-includes folder? Please try to use the absolute url or directory name of the fonts. Something like:

    http://www.mysite.com/wp-content/uploads/fonts/lust.ttf

    Best regards,
    Ismael

    #340820

    I can move those and give that a shot – but if I am not mistaken…why would that matter as long as its located within the same main folder in the FTP?

    I will let you know as I make the changes…

    #341210

    Hi!

    Yes, it will work if custom.css is also located on the wp-includes folder but it’s not. You need to use the absolute url or transfer the font files on a different directory.

    Cheers!
    Ismael

    #342275

    I’m having similar problems with an outside webfont using @font-face. I’ve tried both absolute and relative URLs, but just can’t get the font to load properly. I’ve done this on another WordPress installation with a different theme, but I can’t get it to work with the Enfold child theme I have set up.

    Any insight as to how to use an outside webfont? I’m happy to move the files to a specific folder or update the CSS file.

    #343405

    Hi!

    Can you please give us a link to the website? A lot of Enfold users are using the @font-face code on custom.css file or Quick CSS field for their custom fonts. Please post your code on pastebin.com. Try to place the font files on wp-content folder then use absolute url. Make sure that the directories have the correct file permissions.

    Cheers!
    Ismael

    #343515

    Ok, so I actually got it to work with a relative URL, as long as the files are — as you advise — in the wp-content folder, rather than within the themes/enfold-child/css/ folder, as it was just prior.

    I’ve added this to styles.css in my child theme, rather than custom.css or quick.css. I suppose it doesn’t matter, but is one preferable to the other?

    Here’s the code, which I suppose is FYI at this point:

    @font-face {
    	font-family: 'VerbCond Light Italic';
    	src: url(/wp-content/webfonts/verbcond-light-italic.eot);
    	src: url(/wp-content/webfonts/verbcond-light-italic.eot?#iefix) format('embedded-opentype'),
    	     url(/wp-content/webfonts/verbcond-light-italic.woff) format('woff'),
    	     url(/wp-content/webfonts/verbcond-light-italic.ttf) format('truetype'),
    	     url(/wp-content/webfonts/verbcond-light-italic.svg#ywftsvg) format('svg');
    	font-weight: normal;
    	font-style: normal;	}
    #344595

    Hey!

    style.css in child theme is totally fine. Glad you did it.
    If you have any other questions please let us know. We are happy to assist you.

    Cheers!
    Andy

    #344656

    Thanks for your help. This issue is solved for now.

Viewing 9 posts - 1 through 9 (of 9 total)
  • The topic ‘Custom font no longer loading (using @font-face)’ is closed to new replies.