Resource Preloaded With Link Preload Was Not Used

  • Resolved linux4me2

    (@linux4me2)


    2 years, 5 months ago

    I’ve noticed the following warning in Firefox and Chrome console:

    
The resource at “https://thedomain.com/wp-content/plugins/ti-woocommerce-wishlist/assets/fonts/tinvwl-webfont.woff2?ver=xu2uyi” preloaded with link preload was not used within a few seconds. Make sure all attributes of the preload tag are set correctly.

    I checked the preload tag attributes:

    
<link rel='preload' as='font' type='font/woff2' crossorigin='anonymous' id='tinvwl-webfont-font-css'  href='https://thedomain.com/wp-content/plugins/ti-woocommerce-wishlist/assets/fonts/tinvwl-webfont.woff2?ver=xu2uyi' media='all' />

    and they all appear to be correct, so I think the text of the warning is misleading.

    The real problem appears to be that tinvwl-webfont.woff2 preloads on every page, not just product and other pages where it is used. The warning only occurs on pages where Ti WooCommerce Wishlist elements don’t appear.

    I saw this post, but it really doesn’t address the issue.

    What would appear to fix the problem is to only add the preload link on pages where the webfont is needed.

    Is there a way, other than by adding another plugin, to prevent Ti WooCommerce Wishlist from loading the webfont on pages where it’s not needed?

    It seems like adding an option in Ti WooCommerce Wishlist to prevent loading the webfont on specific pages would be helpful, or even better, if preventing it from being added on pages where it’s unnecessary can be done by default?

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author templateinvaders

    (@templateinvaders)

    Hi @linux4me2

    We can’t make it conditionally only when buttons appear on pages because some setups use AJAX products listing and a lot of setups use header wishlist products counter also.

    You can get an idea of how to make it conditionally for your requirements to follow the next snippet:

    function tinvwl_wishlist_webfont() {
	if ( class_exists( 'TInvWL' ) && ! is_shop() && ! is_product() && ! apply_filters( 'wpml_object_id', tinv_get_option( 'page', 'wishlist' ), 'page', true ) ) {
		add_filter( 'tinvwl_load_webfont', '__return_false' );
	}
}

add_action( 'wp_enqueue_scripts', 'tinvwl_wishlist_webfont', 9 );

    It will disable loading webfont for any pages excluding shop, product, and whilst page.

    Thread Starter linux4me2

    (@linux4me2)

    Hi @templateinvaders

    I understand what you’re saying. The snippet is very helpful. Thanks for that! I will give it a try.

    By the way, I haven’t noticed anything other than the heart icon that is using a webfont, but I haven’t looked in depth. If that is all you’re using the webfont for, maybe you could use the heart HTML code, ♡ and not need the webfont?

    • This reply was modified 2 years, 5 months ago by linux4me2.
    Thread Starter linux4me2

    (@linux4me2)

    I had to make a small tweak to the snippet you provided to get it to work.

    The line:

    
apply_filters( 'wpml_object_id', tinv_get_option( 'page', 'wishlist' ), 'page', true )

    returned the ID of the Wishlist page, so it always evaluated as true and the filter didn’t fire.

    I changed the snippet so it compared the current page’s ID to the Wishlist page ID as follows, and it works:

    
add_action('wp_enqueue_scripts', 'tinvwl_wishlist_webfont', 9);

function tinvwl_wishlist_webfont() {
	if (class_exists('TInvWL') && !is_shop() && !is_product() 
            && apply_filters(
                'wpml_object_id', 
                 tinv_get_option('page', 'wishlist'), 'page', true) !== get_the_ID()
        ) {
            add_filter('tinvwl_load_webfont', '__return_false');
	}
}

    Thanks again! I wouldn’t have gotten there without the help.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Resource Preloaded With Link Preload Was Not Used’ is closed to new replies.