Лучший метод добавления JavaScript кода в плагины WordPress

add

Эта статья представлена вам в качестве руководства о том, как добавить код JavaScript к своим плагинам для Вордпресса.

Практический пример из WP Wall плагина.

Начните с подцепки(hook) вашей функции к wp_print_action:

add_action('wp_print_scripts', 'WPWall_ScriptsAction');

Затем добавьте скрипт, который хотите использовать:

function WPWall_ScriptsAction()
{
 $wp_wall_plugin_url = trailingslashit( get_bloginfo('wpurl') )
.PLUGINDIR.'/'. dirname( plugin_basename(__FILE__) );

 if (!is_admin())
	{
	  wp_enqueue_script('jquery');
	  wp_enqueue_script('jquery-form');
	  wp_enqueue_script('wp_wall_script', $wp_wall_plugin_url.'/wp-wall.js',
array('jquery', 'jquery-form'));
	  wp_localize_script( 'wp_wall_script', 'WPWallSettings', array(
	  	'refreshtime' => 5,
                'mode' => "auto"
		));
	}
}

Этот код проверяет, не является ли открытая страница администраторской, поскольку туда мы не хотим загружать скрипты. Далее воспользуемся wp_enqueue_script функцией, которая может добавить предопределенные сценарии (например, JQuery, Thickbox и т.д.) или ваши собственные скрипты. Это гарантирует, что все скрипты будут загружены только один раз, даже при нескольких запросах с различных плагинов.

Передача параметров JavaScript используя wp_localize_script

Вордпресс предоставляет элегантный способ по передачи параметров вашему JavaScript коду, используя wp_localize_script функцию.

Вордпресс автоматически добавит параметры до вызова вашего скрипта, даже с использованием CDATA для проверки.

В предыдущем примере refreshtime и mode параметры были приняты и могут быть легко доступны в JavaScript:

refresh = parseInt( WPWallSettings.refreshtime );

mode = WPWallSettings.mode;

Загружайте скрипты только в случае необходимости

В примере у нас была простая проверка, чтобы убедиться, что скрипты не загружаются на страницах админа.

На админ странице вы можете точно указать какие скрипты и на каких страницах они должны загружаться.

add_action( "admin_print_scripts-options.php", 'my_admin_scripts' );

function my_admin_scripts() {
  // wp_enqueue_script...
}

Может также быть использовано admin_print_scripts действие, вам просто нужно будет добавить название страницы. В предыдущих примерах, скрипты загружались бы только на / wp-admin/options.php странице.

Заключение

Использование этого способа добавления JavaScript к вашему коду рекомендуется для всех плагинов, не только по причине элегантности и эффективности, но также быстроты, нежели печатание ваших скриптов и параметров вручную.

Высоких конверсий!

11-03-2016