3.1.1 HTTPS Fonts and Blocking Fonts

Tagged: 

  • 3.1.1 HTTPS Fonts and Blocking Fonts
    Viewing 15 posts - 31 through 45 (of 45 total)

  • karelleninc
    Participant
    #10226

    @bassam,

    The script always ends up in “wf-loading”-> “wf-inactive” instead of “wf-loading” -> “wf-active”. The reason for this, I suspect, is that the main.css declares the same fonts as are loaded dynamically by the WebFontLoader and are used instead of WF ones.

    Revolution slider plugin is essential for me as I’m going to have a splash. I need it. Any status update on this?
    Rev Slider also seems to come in conflict with “Enlighter – Customizable Syntax Highlighter”, so it may be the same issue.


    Mohamed Nabil
    Moderator
    #10282

    Hello @karelleninc

    I’ve checked the fonts imported in our main.css like Raleway and Opensans, and it was working normally, check the attached image below. Also if it’s possible could you send me a link to the page that you see wf-inactive class ?
    webfont-body-classes

    Regarding the revolution slider, we are still investigating the issue and will get back to you.


    karelleninc
    Participant
    #10283

    @mohamed-nabil, Thanks, I’ll reactivate the font loading and will let you know.


    karelleninc
    Participant
    #10284

    @mohamed-nabil, You know, you’re right, it might have been an artifact of Autoptimize critical CSS optimization, resulting in wf-inactive happening. Doesn’t appear to be an issue right now without Critical CSS inlining.


    karelleninc
    Participant
    #10285

    @mohamed-nabil, @bassam,

    I know what’s wrong. The google fonts script is, somehow, included and executed twice. I’m investigating if it’s autoptimize or something else.


    karelleninc
    Participant
    #10287
    This reply has been marked as private.

    karelleninc
    Participant
    #10288

    Autoptimize is NOT the cause of script duplication.


    karelleninc
    Participant
    #10289
    This reply has been marked as private.

    karelleninc
    Participant
    #10290
    This reply has been marked as private.

    Mohamed Nabil
    Moderator
    #10297

    Yes i can see it.
    Could you try replacing this line in the code sent earlier by @bassam

    
    add_action( 'wp_footer', 'circleflip_get_google_fonts' );
    

    by this

    
    add_action( 'wp_enqueue_scripts', 'circleflip_get_google_fonts' );
    

    And if the issue still exist, provide me with ftp access in a private reply, so that i can investigate it further.


    karelleninc
    Participant
    #10299

    One sec, will do.


    karelleninc
    Participant
    #10301

    @bassam, @mohamed-nabil,

    FOAP problem is solved:
    1) This script content

    <style>
    .wf-loading {
    visibility: hidden;
    }

    .wf-active, .wf-inactive {
    visibility: visible;
    }
    </style>
    <script type=”text/javascript”>
    /* autoptimize_exclude */

    document.documentElement.className += ‘ wf-loading’;
    WebFontConfig = {
    google: { families: [ <?php echo $googleFonts;?> ] }
    };
    (function() {
    var wf = document.createElement(‘script’);
    wf.src = ‘https://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js’;
    wf.type = ‘text/javascript’;
    wf.async = ‘true’;
    var s = document.getElementsByTagName(‘script’)[0];
    s.parentNode.insertBefore(wf, s);
    })();
    </script>
    2) Add exclusion for “autoptimize”.

    FOAP (flickering, re-render) is gone. Page renders only one time in full.


    Mohamed Nabil
    Moderator
    #10302

    Nice, and I’ve rechecked your website network and the duplicate files issue seems to be fixed, right ?


    karelleninc
    Participant
    #10305

    @mohamed-nabil, yep, correct! And I don’t even need to play with visibility anymore as there is only one refresh during rendering!

    There is another issue for which I’m filing a separate bug.


    Mohamed Nabil
    Moderator
    #10312

    Alright, we will close this issue, and will follow up with you there once you create the new topic.

    Cheers

Viewing 15 posts - 31 through 45 (of 45 total)

The topic ‘3.1.1 HTTPS Fonts and Blocking Fonts’ is closed to new replies.