Viewing 15 posts - 1 through 15 (of 15 total)
  • Author
    Posts
  • August 15, 2024 at 8:59 pm #1464721
    spokerstradingco

    Hi, I have a custom font that loads on Chrome for my headers and menu elements but does not load on Safari or Firefox. The font is loading from Adobe type kit. I cannot add the font via the font uploader seeing it is from adobe typekit. I added the code in my functions.php in private which works on chrome but not safari.

    August 16, 2024 at 5:37 am #1464747
    Ismael

    Hey spokerstradingco,

    Thank you for the inquiry.

    We adjusted the filters a bit. Please try it again:

    /* Adobe Typekit font */
add_action('init', 'enfold_customization_switch_fonts');
function enfold_customization_switch_fonts() {
    global $avia;
    $avia->style->print_extra_output = false;
}

add_filter('avf_google_heading_font', 'avia_add_heading_font');
function avia_add_heading_font($fonts) {
    $fonts['Espiritu Regular'] = 'espiritu';
    return $fonts;
}

add_filter('avf_google_content_font', 'avia_add_content_font');
function avia_add_content_font($fonts) {
    $fonts['Espiritu Regular'] = 'espiritu';
    return $fonts;
}

add_action('wp_head', 'enfold_customization_add_scripts');
function enfold_customization_add_scripts() {
    ?>
    <link rel="stylesheet" href="https://use.typekit.net/rww4dia.css">
    <?php
}

    Best regards,
    Ismael

    August 16, 2024 at 7:09 pm #1464793
    spokerstradingco

    Hi, The font is still not loading on Safari after adding the new code.

    August 19, 2024 at 6:01 am #1464872
    Ismael

    Hi,

    Thank you for the update.

    You may need to toggle or temporarily disable the Enfold > Performance > File Compression settings and purge the cache. Let us know the result.

    Best regards,
    Ismael

    August 19, 2024 at 7:32 am #1464882
    Guenni007

    Or perhaps your security settings (htacces file, etc.) prevent you from using URLs other than those of your own domain. So loading from https://use.typekit.net/rww4dia.css is not allowed.

    August 19, 2024 at 10:22 pm #1464936
    spokerstradingco

    Hi, I disabled the css and javascript and cleared the cache but the problem persists. It looks like the font is also not loading on chrome anymore… Perhaps the new code you provided?

    August 20, 2024 at 12:31 am #1464938
    Guenni007

    it is this snippet:

    add_action('wp_head', 'enfold_customization_add_scripts');
function enfold_customization_add_scripts() {
    ?>
    <link rel="stylesheet" href="https://use.typekit.net/rww4dia.css">
    <?php
}

    that my comment is for. On my htaccess file i do not allow loading from different sources than my own domain.
    If i would place such a snippet – it will not be loaded – allthough the snippet might be correct.

    if that is not the reason for not loading – try to enqueue that css file:

    function enqueue_external_css() {
   wp_enqueue_style( 'adobe_typekit', 'https://use.typekit.net/rww4dia.css' );
}
add_action( 'wp_enqueue_scripts', 'enqueue_external_css', 20 );

    _______________

    i do not know if your first snippet do run with newest enfold. This code snippet has been valid for half an eternity.
    For my installations i use now instead:

    function my_output_google_webfonts_script( $activate ){
  return false;
}
add_filter( 'avf_output_google_webfonts_script', 'my_output_google_webfonts_script', 10, 1 );
    August 20, 2024 at 5:13 am #1464945
    Ismael

    Hi,

    Have you tried reselecting the font? We may need to access the site to properly check the issue. Please provide the login details in the private field.

    Best regards,
    Ismael

    August 20, 2024 at 7:03 pm #1465002
    spokerstradingco

    Credentials attached in private

    August 21, 2024 at 4:51 am #1465016
    Ismael

    Hi,

    Thank you for the info.

    The custom font was not selected as the heading and body font in Enfold > General Styling > Fonts tag. We re-selected it as the default font. Please make sure to purge the cache before checking.

    Best regards,
    Ismael

    August 21, 2024 at 4:56 am #1465017
    Ismael

    Hi,

    UPDATE: Also, when checking on Safari, please make sure to clear the browser history, as Safari tends to cache older versions of websites.

    Best regards,
    Ismael

    August 21, 2024 at 3:36 pm #1465093
    Guenni007

    can you please give a feedback – how you solved it ;)

    August 21, 2024 at 7:26 pm #1465116
    spokerstradingco

    Thank you. It looks like the font is showing up now. It does look a little thicker than it was originally but that is ok. Because the font is thicker the lines between the menu items is off place. Can I get some code to fix the small lines between the menu items?I believe I was already given some code that is in the quick css. I included a screesnshot

    August 21, 2024 at 11:53 pm #1465130
    Guenni007

    Well – if you open your linked css:
    https://use.typekit.net/rww4dia.css

    you see what it does: there is the @import url rule – and : font-family:”espiritu”

    if you look deeper to that css – you see that you can download those files via those urls ( even as otf)

    @font-face {
font-family:"espiritu";
src:
url("https://use.typekit.net/af/cb2cbd/00000000000000007736dd40/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff2"),
url("https://use.typekit.net/af/cb2cbd/00000000000000007736dd40/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff"),
url("https://use.typekit.net/af/cb2cbd/00000000000000007736dd40/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("opentype");
font-display:auto;
font-style:normal;
font-weight:400;
font-stretch:normal;
}

    you only have to give the downloaded files a meaningfull name and the correct file extension ;)

    so maybe you host those fonts on your own server.

    August 22, 2024 at 5:02 am #1465143
    Ismael

    Hi,

    Can I get some code to fix the small lines between the menu items?

    To change the position of the lines, try to adjust the value of the top property in this css code.

    .av_seperator_small_border .av-main-nav > li > a > .avia-menu-text:before {
    content: '';
    width: 2px;
    height: 32px;
    background: #c4beb1;
    display: block;
    position: absolute;
    left: 0;
    top: 48%;
    transform: translateY(-50%);
}

    The previous value was 58%.

    Best regards,
    Ismael

  • Author
    Posts
Viewing 15 posts - 1 through 15 (of 15 total)
  • You must be logged in to reply to this topic.