Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • October 15, 2015 at 1:02 pm #519255
    Freek

    Hi,

    I have a very strange problem. I installed a new font (DK Yellow Lemon Sun) and it looks good on Safari, burt when i start Firefox or Chrome the font is reset to a standard font.
    I added the following code to my functions.php

    add_filter( 'avf_google_heading_font',  'avia_add_heading_font');
function avia_add_heading_font($fonts)
{
$fonts['lemon'] = 'lemon:400,600,800';
return $fonts;
}

add_filter( 'avf_google_content_font',  'avia_add_content_font');
function avia_add_content_font($fonts)
{
$fonts['lemon'] = 'lemon:400,600,800';
return $fonts;
}

    I uploaded the lemon.otf file to my website and added the following css code in custom.css

    @font-face {
	font-family: lemon;
	src: url('http://debottelarij.com/wp-content/uploads/lemon/lemon.otf');
font-weight:400 :600 :800;
}
@font-face {
	font-family: lemon;
	src: url('http://debottelarij.com/wp-content/uploads/lemon/lemon.ttf');
font-weight:400 :600 :800;
}

    Where did it go wrong?
    Any ideas?
    THX Freek

    • This topic was modified 9 years, 2 months ago by Freek.
    October 15, 2015 at 6:03 pm #519465
    Elliott

    Hey Freek!

    Try uploading the font here, http://www.fontsquirrel.com/tools/webfont-generator, it will give you the CSS necessary for cross browser support.

    Cheers!
    Elliott

    October 19, 2015 at 10:48 am #520802
    Freek

    i tried that. Placed the webfoot files in my the fonts folder. In custom.css i point to the folder. see next code:

    @font-face {
    font-family: 'dk_lemon_yellow_sunregular';
    src: url(' http://wesaca.com/bottelarij/wp-content/uploads/lemon/dk_lemon_yellow_sun-webfont.eot');
    src: url(' http://wesaca.com/bottelarij/wp-content/uploads/lemon/dk_lemon_yellow_sun-webfont.eot?#iefix') format('embedded-opentype'),
         url(' http://wesaca.com/bottelarij/wp-content/uploads/lemon/dk_lemon_yellow_sun-webfont.woff2') format('woff2'),
         url(' http://wesaca.com/bottelarij/wp-content/uploads/lemon/dk_lemon_yellow_sun-webfont.woff') format('woff'),
         url(' http://wesaca.com/bottelarij/wp-content/uploads/lemon/dk_lemon_yellow_sun-webfont.ttf') format('truetype'),
         url(' http://wesaca.com/bottelarij/wp-content/uploads/lemon/dk_lemon_yellow_sun-webfont.svg#dk_lemon_yellow_sunregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

    And i added the following code to functions.php

    add_filter( 'avf_google_heading_font', 'avia_add_heading_font');
function avia_add_heading_font($fonts)
{
$fonts['lemon'] = 'dk_lemon_yellow_sun-webfont:400,700,800';
return $fonts;
}

add_filter( 'avf_google_content_font', 'avia_add_content_font');
function avia_add_content_font($fonts)
{

$fonts['lemon'] = 'dk_lemon_yellow_sun-webfont:400,700,800,400italic,700italic';
return $fonts;
}

    And tried this last code also with the dk_lemon_yellow_sunregular variable.
    No luck. Any ideas?
    THX Freek

    October 19, 2015 at 7:48 pm #521157
    Elliott

    Hey!

    If your trying to make it selectable in the theme options then make sure to add this to your child theme functions.php file as well.

    add_action( 'init', 'enfold_customization_swtich_fonts' );
function enfold_customization_swtich_fonts() {
    global $avia;
    $avia->style->print_extra_output = false;
}

    So it does not try to load it from the Google Fonts CDN.

    See here for more info, https://kriesi.at/support/topic/installing-own-fonts/#post-421325.

    Regards,
    Elliott

    • This reply was modified 9 years, 2 months ago by Elliott.
    October 19, 2015 at 8:36 pm #521179
    Freek

    I managed to finally make it happen.
    in the css code i removed the full URL
    url(' http://wesaca.com/bottelarij/wp-content/uploads/lemon/dk_lemon_yellow_sun-webfont.woff2') format('woff2'),

    and changed it in:

    url('/wp-content/uploads/lemon/dk_lemon_yellow_sun-webfont.woff2') format('woff2'),

    Now it works in all browsers. I made a small “How-to” instruction on this topic. If someone is interested….
    THX for the great support. Freek

    • This reply was modified 9 years, 2 months ago by Freek.
    October 19, 2015 at 10:32 pm #521212
    Basilis

    Hey!

    Thanks a lot for the howto – we do appreciate that!
    Let us know if we can help you, with any other way! :-)

    Regards,
    Basilis

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • The topic ‘problem with showing added font in Firefox/Chrome’ is closed to new replies.