Как правильно включить WebFont Loader и Google Fonts в тему Wordpres? - PullRequest
Новая
       34

Как правильно включить WebFont Loader и Google Fonts в тему Wordpres?

0 голосов
/ 01 мая 2018

Я учусь разрабатывать WordPress и создаю свою тему с нуля. Я прочитал, что лучший способ включить Google Fonts в тему - это использовать загрузчик WebFont. Этот метод помогает улучшить оценку в тесте PageSpeed.

Я пытаюсь добавить загрузчик WebFont из файла function.php и wfloader.js. К сожалению, шрифт не загружается в мою тему. Что я делаю неправильно? Я не могу понять себя.

Вот мой код в файле function.ph p: 

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'
            ]
        }
    });
}

Спасибо за любой совет!

Ответы [ 2 ]

0 голосов
/ 03 мая 2018

Я исправил свой код, и он работает:) 

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 ); 
    }
0 голосов
/ 01 мая 2018

Всего 2 замечания, не затрагивающих основной вопрос. Я бы не стал запускать ваши функции с помощью wpb_, потому что это делает известный плагин компоновщика страниц, у вас могут возникнуть конфликты, если вы активируете этот плагин в своей теме. Вам не нужен esc_url для функции get_stylesheet_directory_uri (), вы можете доверять результату этой функции WordPress. Вы проверили, действительно ли загружен скрипт //ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js? Я имею в виду проверку элементов и поиск //ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js в HTML. Если так, проверьте, есть ли в консоли ошибки, я имею в виду F12 -> console

...