Как загрузить Javascript в плагин Wordpress - PullRequest
Новая
       6

Как загрузить Javascript в плагин Wordpress

14 голосов
/ 04 февраля 2012

Может кто-нибудь показать мне, как включить этот файл JavaScript в мой плагин WordPress.Я перепробовал все методы wp_enqeue_script (), но ничего не происходит.

хорошо, вот мой пример кода плагина с комментариями, объясняющими, что я хотел бы. 

<?php
/*
Plugin Name: Ava Test
Plugin URI: http://#.com
Description: A plugin that is used for my javascript tests
Author: Ronny Kibet
Author URI: http://ronnykibet.com
version: 1.001
*/

include(popup.js); 
/*when I include it this way, it works fine, but gives an error when I activate the plugin
'plugin generated 453 characters ...'
*/

function popup() {
$src = plugins_url('popup.js', __FILE__);
wp_register_script( 'popup', $src );
wp_enqueue_script( 'popup' );
}
/*
when I included it this way, plugin is activated but nothing happens.
*/
?>

это popup.js 

<script type="text/javascript">

function popup(){


alert('hello there this is a test popup')

}
</script>
<body onload="popup()">
</body>

Так кто-нибудь знает, как правильно запустить этот скрипт в плагине WordPress?

Ответы [ 4 ]

32 голосов
/ 04 февраля 2012

Вам нужно указать, когда должна произойти загрузка, попробуйте это. 

<?php
/*
Plugin Name: Ava Test
Plugin URI: http://#.com
Description: A plugin that is used for my javascript tests
Author: Ronny Kibet
Author URI: http://ronnykibet.com
version: 1.001
*/

add_action('wp_enqueue_scripts','ava_test_init');

function ava_test_init() {
    wp_enqueue_script( 'ava-test-js', plugins_url( '/js/ava_test_.js', __FILE__ ));
}

Кроме того, в вашем JS есть ошибки, но я видел правильную версию в некоторых ответах, надеюсь, это поможет

Обновление: есть ловушка, называемая wp_enqueue_scripts, как упомянуто @brasofilo, которая должна использоваться вместо init для загрузки скриптов.

2 голосов
/ 05 февраля 2012

Обучение работе в структуре WP может быть расстраивающим.

И обучение внедрению javascript может быть еще более расстраивающим.

Итак, все здесь внесли что-то ценное, как вам нужнособрать все это вместе.Итак:

Первый:
Удалите строку включения.Вам это не нужно.

Секунда:
Убедитесь, что переменная $ src в вашем коде действительно является правильным путем.Я бы добавил: 

echo $src;

К ТЕСТУ, если местоположение правильное.

Третье: Aghoshx верен - вы ДОЛЖНЫ иметь ссылку на крючок: 

add_action('init','popup');

(Поскольку вы назвали функцию popup, это то, что я вставил - ОДНАКО, чтобы предотвратить коллизии имен функций с другими функциями WP и плагинами, я рекомендую вам изменить его на что-то более уникальное, например, предложенное aghoshx)

Четвертый: Проверьте, что ваш скрипт загружается.После того, как вы выполните шаги 1-3 выше, затем обновите страницу WP и выполните «просмотр источника».Ищите свой файл сценария.Если вы находитесь в Firefox, вы можете щелкнуть по URL-адресу, и он загрузит его - если вы находитесь в IE, скопируйте и вставьте URL-адрес в строку URL-адреса и посмотрите, действительно ли ваш файл ТАМ (если это так, этозагрузка. Если НЕТ, то это НЕ загрузка файла должным образом, и вам нужно исправить путь, который вы устанавливаете в переменную th $ src).

Пятый: Как только вы получите вышеупомянутый прибитый, cillosis прав - вынужно удалить все, НО функцию javascript (вы даже удаляете теги) из файла javascript.

Наконец: посмотрите на ответ Марти Лейнса - вам нужно связать событие, используя предложенный им window.addEventListener, ИЛИ ELSEизмените тег в вашем php-шаблоне так, чтобы он содержал onload = "popup" (как вы это сделали в файле скрипта).

Один последний совет:

jQuery делает НАМНОГО проще.Внедрить jQuery в плагин WP очень просто.Просто добавьте это в всплывающую функцию php: 

enqueue_script('jquery');

Удачи!

0 голосов
/ 04 февраля 2012

popup.js должен содержать только JavaScript-код, без HTML. Попробуйте это (в popup.js) 

function popup(){
   alert('hello there this is a test popup');
}
window.addEventListener('load',function(event){popup();},false);

Или просто так: 

window.addEventListener('load',function(event){
   alert('hello there this is a test popup');
},false);
0 голосов
/ 04 февраля 2012

Вы включили HTML в свой файл .js и никогда не добавляли точку с запятой в конец оповещения ().Может быть, попробуйте добавить это в ваш popup.js: 

function popup(){

   alert('hello there this is a test popup');

}

А затем в своем HTML добавьте onload="popup()" к тегу body.

...