如何将WebFont Loader和Google字体正确包含在Wordpres主题中？

我正在学习开发WordPress, 并从头开始构建主题。我读到, 将Google字体包含到主题中的最佳方法是使用WebFont Loader。此方法有助于提高PageSpeed测试中的得分。

我尝试从function.php和wfloader.js文件添加WebFont Loader。不幸的是, 字体没有加载到我的主题中。我究竟做错了什么？我无法弄清楚自己。

所以这是我在function.php文件中的代码：

add_action( 'wp_enqueue_scripts', 'wpb_scripts_styles' );

function wpb_scripts_styles() {
wp_register_script(
    'web-font-loader', '//ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js', array( '' ), ''
);

wp_enqueue_script(
    'fonts-to-load', esc_url( get_stylesheet_directory_uri() ) . '/assets/js/wfloader.js', array( 'web-font-loader' ), ''
); 
}

这是来自wfloader.js

function webfontload() {
    WebFont.load({
        google: {
            families: [
                'Playfair+Display:400, 700, 900&subset=latin-ext'
            ]
        }
    });
}

感谢你的任何建议！

#1

我修复了代码, 它起作用了:)

function custom_scripts_styles() {

    wp_register_script(
        'web-font-loader', '//ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js', array(), null );

    wp_enqueue_script(
        'fonts-to-load', get_template_directory_uri() . '/assets/js/wfloader.js', array( 'web-font-loader' ), null, true ); 
    }

#2

仅有2条评论不代表主要问题。我不会使用wpb_来启动你的功能, 因为著名的页面构建器插件可以执行此操作, 如果你以主题激活该插件, 则可能会发生冲突。你不需要esc_url作为函数get_stylesheet_directory_uri(), 你可以信任此WordPress函数的结果。你是否检查过脚本//ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js是否已真正加载？我的意思是检查元素并在HTML中搜索//ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js。如果是这样, 请检查控制台中是否有错误, 我的意思是F12->控制台