оригинальная версия версия для слабовидящих контрастная версия выключить изображения включить изображения RSS FEED K2 NEWS
Среда, 26 Август 2020 00:06

Установить сторонний JavaScript в WordPress

Вчера потратил пару часов на поиск ответа на вопрос, как добавить свои стили к теме WordPress, причём решений у вопроса, я насчитал, как минимум три и все три у меня поначалу не работали (о причинах после), но потом нашёл источник бед и всё встало на свои места.

Начну, пожалуй, сразу с проблемного момента, с которым я столкнулся, а именно, в моём случае Wordpress обрезал скрипты javascript, выражалось это в том, что при попытке подгрузить «рабочий скрипт», будь то javascript или, как ни странно, таблица стилей css (причём я всё делал «как надо») – система «удаляла» файл.

Я понял, что «что-то не так», когда увидел, что «неправильная ссылка на скрипт» - в код подгружалась (и пропадала исключительно после того, как становилась «правильной»), причина крылась в плагине autooptimize - https://wordpress.org/plugins/autoptimize/.

Отключив который, проблема решилась сама собой, мы ведь не всегда работаем со «своими» сайтами, где мы знаем все установленные плагины, нередко приходится работать после кого-то так и в моём случае. Отключил плагин – избавил себя от проблемы.

Теперь перейдём именно к вопросу установки сторонних скриптов, как я писал выше, у меня как минимум три варианта, вариант первый и самый «безобидный» - установка плагина, который позволит Вам вставить javascript или css, причём в случае (как у меня, например), если Вам необходим скрипт всего на одной странице – то это идеальное решение. В случае если на всех страницах сразу, то Вам скорее всего этот вариант не подойдёт, перейдём к следующим.

Второй способ нельзя назвать правильным, тем не менее он рабочий, а значит имеет право на существование, в каталоге темы (шаблона) Вашего WordPress’а прям в корне будет файлы header.php, пропишите туда в тег <head> интересующие Вас строки и вопрос будет решён.

На всякий случай напомню, шаблоны лежат в каталоге:

(domen)\wp-content\themes\(здесь имя Вашего шаблона)

И третий «правильный» способ, в том же корне каталога темы (шаблона) WordPress, помимо файла header.php, есть так же файл function.php, и именно в нём нам предстоит «официально объявить» наши скрипты, для этого, чтобы «никому не мешать» добавим новую функцию:

function new_scripts() {
wp_register_style ( 'name_style', get_template_directory_uri() . '/css/new_style.css' );
wp_enqueue_style( 'name_style' );

wp_register_script( 'name_script', get_template_directory_uri(). '/js/new_script.js', true );
wp_enqueue_script( 'name_script' );
}
add_action( 'wp_enqueue_scripts', 'new_scripts' );

Функция wp_register_style регистрирует стиль, wp_enqueue_style ставит его в очередь и так же wp_register_script регистрирует скрипт и wp_enqueue_script его ставит в очередь. После описания функции мы добавляем add_action, и здесь обратите внимание, что wp_enqueue_scripts обязательно буква s в конце и new_script – запуск прописанной функции.

Спонсоры: