Viewing 16 posts - 1 through 16 (of 16 total)
  • Author
    Posts
  • #684786

    Hi,

    I have added the font ‘Akkurat’ to my website. But it does not work. That’s the steps I did:

    (1) Upload an otf.-file to child-theme folder child/fonts/akkurat/akkurat.otf
    (2) Add @font-face to CSS:

    @font-face {
    	font-family: 'Akkurat';
    	src: url('/wp/wp-content/themes/child-theme/fonts/akkurat/akkurat.otf') format(opentype');
    	font-weight: normal;
    	font-style:normal;
    }

    (3) Add PHP-Code to functions.php in Child-Theme:

    /* 	FUNC:	Add Font to ENFOLD-Theme */
    add_filter( 'avf_google_heading_font', 'avia_add_heading_font');
    function avia_add_heading_font($fonts)
    {
    $fonts['Akkurat'] = 'Akkurat:400,700';
    return $fonts;
    }
    
    add_filter( 'avf_google_content_font', 'avia_add_content_font');
    function avia_add_content_font($fonts)
    {
    $fonts['Akkurat'] = 'Akkurat:400,700';
    return $fonts;
    }
    
    add_filter( 'tiny_mce_before_init', 'wpex_mce_google_fonts_array' );
    function wpex_mce_google_fonts_array( $initArray ) {
        $initArray['font_formats'] = 'Akkurat=Akkurat,arial,sans-serif;Lato=Lato;Andale Mono=andale mono,times;Arial=arial,helvetica,sans-serif;Arial Black=arial black,avant garde;Book Antiqua=book antiqua,palatino;Comic Sans MS=comic sans ms,sans-serif;Courier New=courier new,courier;Georgia=georgia,palatino;Helvetica=helvetica;Impact=impact,chicago;Symbol=symbol;Tahoma=tahoma,arial,helvetica,sans-serif;Terminal=terminal,monaco;Times New Roman=times new roman,times;Trebuchet MS=trebuchet ms,geneva;Verdana=verdana,geneva;Webdings=webdings;Wingdings=wingdings,zapf dingbats';
        $theme_advanced_fonts = 'Akkurat=Akkurat,arial,sans-serif;';
        $initArray['font_formats'] = $theme_advanced_fonts;
        return $initArray;
    }

    Any idea what’s wrong here?

    #685894

    Hey Marcel,

    Please remove the code from functions.php file and add following custom CSS

    body p { font-family: 'Akkurat'; }

    Best regards,
    Yigit

    #686575

    Hi Yigit,

    I’m not sure what you mean. When I remove the code from funtions.php I am not able to use the font in theme settings. Furthermore the problem is alway the same, the font is not shown.

    Actually this is my custom css:

    @font-face {
    	font-family: 'Akkurat';
    	src: url('/wp/wp-content/themes/child-theme/fonts/akkurat/akkurat.otf') format(opentype');
    	font-weight: normal;
    	font-style:normal;
    }
    
    body p { font-family: 'Akkurat'; }
    #686887

    Hi,

    That code you used in functions.php is for Google fonts not for custom fonts, so not needed.
    To which elements would you like to apply this font?
    Also, if you do not mind, please create a temporary admin login and post it here privately.

    Best regards,
    Yigit

    #687089

    H Yigit.

    thanks for your explanation. So I do not need the first both filters as well? It woul be great to change the font in Enfold settings, as I did in some of my other Enfold websites (theire I usere Google fonts with the code above in functions.php).

    The font ‘Akkurat’ should be aplly to all the text elements.

    I’ve created an admina account for you. Please see private Content.

    #687436

    Hi,

    Please see – http://justcreative.com/2013/01/22/how-to-use-custom-fonts-with-font-face-on-wordpress/

    If you need further assistance, please post FTP logins here privately as well. In that case, if font is not a free one, please post it too (or you can upload it on your server)

    Best regards,
    Yigit

    #687880

    Hi Yigit,

    you can find the FTP logins as private content.

    You can find the font in the folder: /wp/wp-content/themes/child-theme/fonts/akkurat/akkurat.otf

    Hope you can find the reason why the font is not loaded.

    Thanks,
    Marcel

    #688828

    Hi,

    I added the font to your site. Please review your website now :)

    Best regards,
    Yigit

    #688972

    Hi Yigit,

    thank you very much :)

    What did you change? (just for my understanding)

    Thanks,
    Marcel

    #689132

    Hi,

    Please check the font files inside your-child-theme/fonts folder. I uploaded those and then adjusted custom CSS to target the correct path :)
    Let us know if you have any other questions or issues!

    Best regards,
    Yigit

    #689693

    Ok, thanks :)

    Do you still know from which website you’ve downloaded the other akkurat-font-files?

    Best,
    Marcel

    #689808

    Hi,

    I generated @font-face using this website – http://transfonter.org/. I used the same file you used but you forgot to create @font-face

    Best regards,
    Yigit

    #887368

    Hello

    I want to change the Font to Tahoma, but when I use the above instructions nothing happens. I don’t know, if Tahoma actually needs a @font-face, but when I created and added it to custom CSS, nothing happened.

    In a similar Topic on this forum (https://kriesi.at/support/topic/font-tahoma/) a moderator named BASILIS recommended to the user, to include * { font-family: Tahoma; } in CSS, but where exactly does he mean to include that code (which CSS file, which line)?

    Can you please help me and explain how to include tahoma, so I can choose the font in the Enfold general styling menu?

    Thank you very much

    #887729

    Hi knuppsli,

    You can try to add your CSS in Quick CSS under Enfold->General Styling to see if it works.

    Best regards,
    Rikard

    #887822

    ——————————————————————————————————————————————–
    UPDATE: 17.12.2017

    Thank you Yigit! It worked.
    ——————————————————————————————————————————————–
    Hello Rikard

    Quick CSS didnt help. first I tried this:

    * { font-family: Tahoma; }

    ———————————————-
    Because the first did not work, I tried this:

    @font-face {
    font-family: ‘Tahoma’;
    src: url(‘fonts/Tahoma-Bold.woff2’) format(‘woff2’),
    url(‘fonts/Tahoma-Bold.woff’) format(‘woff’),
    url(‘/fonts/Tahoma-Bold.ttf’) format(‘truetype’);
    font-weight: bold;
    font-style: normal;
    }

    @font-face {
    font-family: ‘Tahoma’;
    src: url(‘fonts/Tahoma.woff2’) format(‘woff2’),
    url(‘fonts/Tahoma.woff’) format(‘woff’),
    url(‘fonts/Tahoma.ttf’) format(‘truetype’);
    font-weight: normal;
    font-style: normal;

    ———————————

    Nothing.

    Can you please answer my question from yesterday, IF Tahoma actually needs a @fontface and what exactly I was doing wrong. Where do I have to add the @font-face in the CSS code (which line exactly and is it the base.css file or what)?

    I would really like to actually learn something and relieve you guys from support.

    Thanks for your help

    knuppsli

    • This reply was modified 2 years, 6 months ago by  knuppsli.
    #888186

    Hi,

    Following code should have worked

    body, body * { font-family: Tahoma !important; }

    Please flush browser cache and refresh your page a few times.

    If that does not help, please start a new thread under Enfold sub forum and attach temporary admin logins in private content field.

    Best regards,
    Yigit

Viewing 16 posts - 1 through 16 (of 16 total)

The topic ‘Adding new font to my website does not work’ is closed to new replies.