Условная загрузка CSS и JavaScript файлов для отдельных страниц

Хорошей практикой при работе с WordPress является привычка организовывать загрузку файлов только тогда, когда нужно.  Данный принцип касается как клиентской части, так и инструментов администратора. Нет причин загружать CSS и JavaScript файлы для всей панели администратора, когда они нужны только на одной странице.  В WordPress имеется инструмент, который позволяет реализовать такой функционал с помощью только одной функции.

 

Функция WordPress для выборочной загрузки файлов

Почти все страницы панели администратора имеют уникальный адрес URL, поэтому достаточно просто определить момент загрузки конкретной страницы и включить JavaScript и CSS только для нее. Можно использовать переменные  $_SERVER['REQUEST_URI'] или $_GET['action']. Но есть более простой, элегантный и стандартизированный метод для решения таких задач - функция get_current_screen.

Несколько фактов о функции get_current_screen:

  • Она была введена в WordPress v3.1. Поэтому попытка использовать ее в более старых версиях приведет к ошибке. Используйте функцию function_exists для проверки и организации альтернативного метода.
  • Она недоступна в крюках admin_init или init, так как инициируется  после их вызова.
  • Функция возвращает объект WP_Screen с большим набором информации, но, как правило, основной интерес представляет свойство id.
  • Она не доступна в клиентской части (так как не предназначена для использования там).

 

Несколько строк кода создают полное отличие

Допустим ваш плагин имеет страницу опций в меню установок, которая создается с помощью следующего кода:

add_options_page('My Plugin', 'My Plugin', 'manage_options', 'my_plugin', 'my_plugin_options');

Для данной страницы нужно несколько дополнительный CSS и JavaScript файлов:

// Плохой код! Повторять не следует!
add_action('admin_enqueue_scripts', 'my_plugin_scripts');

function my_plugin_scripts() {
	wp_enqueue_style('farbtastic');
	wp_enqueue_script('farbtastic');
}

Так делать не следует! Выше приведенный код подключит CSS и JavaScipt для инструмента установки цвета Farbtastic к каждой странице панели администратора. Если другому плагину потребуется отключить ваши файлы, то ему придется использовать функцию wp_dequeue_*. Но мы можем написать другой код, более эффективный код.

add_action('admin_enqueue_scripts', 'my_plugin_scripts');

function my_plugin_scripts() {
	// Включаем JS/CSS только если находимся на странице нашего плагина
	if (is_my_plugin_screen()) {
		wp_enqueue_style('farbtastic');
		wp_enqueue_script('farbtastic');
	}
}

// Проверка, где мы находимся
function is_my_plugin_screen() {
	$screen = get_current_screen();
	if (is_object($screen) && $screen->id == 'settings_page_my_plugin') {
		return true;
	} else {
		return false;
	}
}

Мы добавили только одно выражение if и простую функцию is_my_plugin_screen, которая проверяет факт нахождения на нашей странице плагина. Переменная $screen содержит объект WP_Screen, в котором интерес представляет свойство id. Значение свойства id состоит из префикса “settings_page_“, который устанавливается для всех страниц установки, и строки “my_plugin”, которая уникальна для нашего плагина, так как определяется в 4 параметре при вызове функции add_options_pageы.

Код очень простой и легко адаптируется к любой странице администратора. Для определения значения свойства id можно воспользоваться просмотром содержания переменной $screen с помощью следующего кода:

echo '<pre>' . print_r(get_current_screen(), true) . '</pre>';

 

Заключение

  • Никогда не включайте CSS или JavaScript для всех страниц администратора - данное действие может вызвать конфликт с другими плагинами.
  • Используйте get_current_screen после init.
  • Список основных идентификаторов для панели администратора приведен в кодексе WordPress.
  • Никогда не используйте теги <script> или <style>, всегда используйте функцию wp_enqueue_*.
  • Проверьте кодекс WordPress, прежде чем добавлять функцию - она может быть уже включена в ядро.

Источник: http://feedproxy.google.com/~r/ruseller/CdHX/~3/OBbLPCL_HpU/lessons.php

Читать комменты и комментировать

Добавить комментарий / отзыв



Защитный код
Обновить

Условная загрузка CSS и JavaScript файлов для отдельных страниц | | 2012-06-19 11:57:54 | | Статьи Web-мастеру | | Хорошей практикой при работе с WordPress является привычка организовывать загрузку файлов только тогда, когда нужно.  Данный принцип касается как клиентской части, так и инструментов администратора. | РэдЛайн, создание сайта, заказать сайт, разработка сайтов, реклама в Интернете, продвижение, маркетинговые исследования, дизайн студия, веб дизайн, раскрутка сайта, создать сайт компании, сделать сайт, создание сайтов, изготовление сайта, обслуживание сайтов, изготовление сайтов, заказать интернет сайт, создать сайт, изготовить сайт, разработка сайта, web студия, создание веб сайта, поддержка сайта, сайт на заказ, сопровождение сайта, дизайн сайта, сайт под ключ, заказ сайта, реклама сайта, хостинг, регистрация доменов, хабаровск, краснодар, москва, комсомольск |
 
Поделиться с друзьями: