Как подключить js файлы и css файлы в WordPress?

Пытаюсь подключить файлы js и css, которые заблаговременно были размещены в папке wp-includes/js (wp-includes/css). Подключаю в functions.php.

Подключение не работает, в инспекторе кода не вижу подключений. Подскажите, что не так? Подключаю файлы для работы swiperjs. Пробовал и без wp_register_script и wp_register_style.

function swiper_js() {

wp_register_script('swiper', get_template_directory_uri() . '/js/swiper.min.js', array(), false, true );
wp_enqueue_script( 'swiper' );
}
add_action('wp_enqueue_scripts', 'swiper_js');

function swiper_css() {
    wp_register_style( 'swiper_css', get_stylesheet_uri() . '/css/swiper.min.css');
    wp_enqueue_style('swiper_css');
}
add_action( 'wp_enqueue_scripts', 'swiper_css' );

Ответы (1 шт):

Автор решения: Seredniy

Нельзя размещать свои файлы в папке wp-includes. Это системная директория, поэтому любое обновление ядра может затереть ваши файлы.

Лучше всего расположить свои стили и скрипты в папке темы (дочерней) или плагина, который вы разрабатываете.


Для правильного подключения скриптов используйте wp_enqueue_script(), а для стилей wp_enqueue_style().

Если скрипт или стиль ранее уже зарегистрирован с помощью wp_register_script(), то для его подключения в этой функции нужно указать только идентификатор скрипта (в первом параметре).

Если же предварительное регистрации не было - функция сделает всё сама. Это удобно.


Обычно, внутри темы создают папку asssets, а в ней: css, js, images и т.д.

get_template_directory_uri() Возвращает ссылку к текущей теме оформления. А дальше уже можно дописать нужные пути.

Вот пример того, как я подключаю. Попробуйте так:

/* правильный способ подключить стили и скрипты */
function scf_theme_scripts() {

    // Подключаем стили
    wp_enqueue_style( 'main-style', get_template_directory_uri() . 'assets/css/main.css' );
    wp_enqueue_style( 'wp-style', get_stylesheet_uri() ); // Тут подключаем стандартный style.css в корне темы.

    // Подключаем скрипты
    wp_enqueue_script( 'main-scr', get_template_directory_uri() . 'assets/js/main.js', array( 'jquery' ), '1.0.0' );
}

add_action( 'wp_enqueue_scripts', 'scf_theme_scripts' );
→ Ссылка