Как правильно подключать файлы(img, js) в wordpress?

Question

[Alex_87]

Всем привет!
При обращении к элементу возникает ошибка.

script.js?ver=1.0.0:13 Uncaught TypeError: Cannot set properties of null (setting 'onclick')

Сам скрипт подключается следующим образом

wp_enqueue_script('script', get_template_directory_uri() . '/assets/js/script.js', array(), _S_VERSION, true);

Может его нужно заставить работать только после полной загрузки DOM? Но как это сделать?
Также, хочу отметить, что возникает ошибка 404 при загрузке изображении
Подключаю так:

<img src="<?php echo get_template_directory(); ?>/assets/img/service-img-1.png" alt="" class="service-icon">

P.S. На всякий случай спрошу,
wp_head() в header.php и wp_footer() в footer.php
Этих функции достаточно?

Comments

[mahmudchon]

возникает ошибка 404 при загрузке

А в чем проблема посмотреть ошибочный URL и сформировать ассоциативный ряд в голове касаемо этой ошибки?

[Alex_87]

mahmudchon, путь правильный

[mahmudchon]

Alex_87, значит файл по этому пути отсутствует.

Answer 1

[lamer350]

get_template_directory - выводит путь от корневой папки, это для бека только используется
на фронте для подгрузки изображений/скриптов вам нужно get_template_directory_uri()

Comments

[Alex_87]

Помогло, спасибо большое!!! Скажите пожалуйста ещё кое-что. Скрипт в отдельном файле.
Обработчик события не срабатывает, не видит элемента? В чём может быть причина? Может быть подгружать скрипт после загрузки всего DOM, но как?

wp_enqueue_script('script', get_template_directory_uri() . '/assets/js/script.js', array(), _S_VERSION, true);

[lamer350]

Alex_87, не видя скрипт сложно сказать, но скорее всего проблема в том что вы не обернули код так:

$( document ).ready(function() {
    console.log( "ready!" );
});

Вот как раз тут будет обрабатываться код после генерации DOM, тоисть ваша функция onlick на месте console.log( "ready!" );

[Alex_87]

lamer350, нет. в functions.php

wp_enqueue_script('swiper-cdn', 'https://cdnjs.cloudflare.com/ajax/libs/Swiper/8.0.7/swiper-bundle.min.js');
	wp_enqueue_script('script', get_template_directory_uri() . '/assets/js/script.js', array(), _S_VERSION, true);
	wp_enqueue_script('swiper', get_template_directory_uri() . '/assets/js/swiper-js.js', array(), _S_VERSION, true);

[lamer350]

Alex_87, там смотрите, когда вы подключаете JS которым нужен jquery то тут как раз там где у вас array() - там можно прописать зависимость так array('jquery'), для swiper вам нужно обязательно добавить третий параметр array('jquery')