Как я могу добавить Codpen JS и AJax на мою одну страницу WordPress - PullRequest
Новая
       7

Как я могу добавить Codpen JS и AJax на мою одну страницу WordPress

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

Я только что нашел хороший слайдер на codepen и хочу интегрироваться в мою домашнюю страницу wp (одна страница).

Я попытался экспортировать ползунок Codepen и вставить встроенные JS и CSS. в заголовок с помощью пользовательского плагина кода заголовка и кода HTML в body.but возник конфликт с другими кодами, которые у меня уже есть на сайте.

У меня вопрос: как сделать так, чтобы встроенный код JS влиял только на один DIV / ID.

Спасибо

1 Ответ

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

Не полагайтесь на встроенные скрипты. Сохраните их как отдельные файлы (hicham-slider.css / js) и сохраните их где-нибудь на вашем сайте (вероятно, /wp-content/themes/ACTIVETHEME/css/ и /wp-content/themes/ACTIVETHEME/js/, создайте эти каталоги, если они не существуют.

Затем вам нужно поставить в очередь их с вашим файлом functions.php: 

add_action( 'wp_enqueue_scripts', 'hicham_scripts' );
function hicham_scripts(){
    wp_enqueue_style( 'hicham-slider', get_stylesheet_directory_uri() .'/css/hicham-slider.css', [], '1.0' );
    wp_enqueue_script( 'hicham-slider', get_stylesheet_directory_uri() .'/js/hicham-slider.js', ['jquery'], '1.0', true );
}

Затем поместите HTML-код в пользовательский виджет HTML или в html / текстовый редактор страницы или сообщения.

Если ползунок не полагается на jQuery, вместо него превратите ['jquery'] в []. Узнайте больше о правильном постановке в очередь с wp_enqueue_style() и wp_enqueue_script()

...