Как добавить плагин JQuery к Drupal?

Должен ли я просто вставить код в основной файл шаблона или есть ли другой рекомендуемый способ подключения новых JQuery-плагинов в Drupal 7?

19 голосов | спросил Vonder 13 J000000Wednesday11 2011, 15:12:06

12 ответов


15

Самый простой способ - просто добавить его в файл .info:

.
scripts[] = js/my_jquery_plugin.js

Единственное исключение - если вы добавляете внешний ресурс (CDN /размещенный скрипт), и в этом случае вы должны использовать drupal_add_js (), как объяснил Джейми Холнерн

ответил Alex Weber 13 J000000Wednesday11 2011, 16:01:29
12

Drupal имеет Jquery, упакованный вместе с ним.

Чтобы добавить файл js, вы можете использовать drupal_add_js, как описано в других сообщениях.

Это будет работать в простых случаях, но если у вас появятся плагины, которые зависят от других плагинов. вы можете захотеть посмотреть библиотеки api . Я ожидаю, что во времени будут созданы модули для поддержки популярных библиотек, некоторые из них для встроенного JQuery uc видят system_library () .

В этом примере для включения модуля jQuery ui.accordion вы можете использовать drupal_add_library ()

drupal_add_library('system', 'ui.accordion');

Это обеспечит включение js вместе с CSS и любыми библиотеками, которые зависят от него. Он также гарантирует, что библиотеки будут включены только один раз.

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

Итак, сначала создайте модуль для определения библиотеки (вызовите его qtip) и загрузите модуль в папку js под папкой модуля

затем выполните hook_library ()

function qtip_library() (
 $libraries['qTip'] = array(
    'title' => 'qTip', 
    'website' => 'http://craigsworks.com/projects/qtip/docs/', 
    'version' => '1.0.0-rc3', 
    'js' => array(
      drupal_get_path('module', 'qtip') . '/js/jquery.qtip-1.0.0.min.js' => array(),
    ),
    'dependencies' => array(
      array('system', 'jquery'),
    ),
  );
  return $libraries;
}

Затем добавьте файл, помещенный в ваш код

drupal_add_library('qtip', 'qtip');

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

ответил Jeremy French 19 J000000Tuesday11 2011, 17:08:51
5

Если вы хотите загрузить скрипт только на некоторые страницы (не все), вы можете добавить его через ваш файл template.php. Просто добавьте код, похожий на этот:

function YourTheme_preprocess_node(&$variables) {

 $node = $variables['node'];
if (!empty($node) && ($node->nid == 983)
 // here you can esily add more pages
) {

drupal_add_js('sites/all/libraries/jquery.ui/ui/ui.core.js');
drupal_add_js('sites/all/libraries/jquery.ui/ui/jquery-ui-1.7.3.custom.js');
drupal_add_js('sites/all/libraries/jquery.ui/ui/ui.progressbar.js');

drupal_add_css('sites/all/libraries/jquery.ui/themes/redmond/ui.progressbar.css');
drupal_add_css('sites/all/libraries/jquery.ui/themes/redmond/ui.core.css');
drupal_add_css('sites/all/libraries/jquery.ui/themes/redmond/ui.theme.css');
 }
}

Я тестировал это только в Drupal 6.

ответил Nebojsa 13 J000000Wednesday11 2011, 18:09:12
3

Вы можете добавить файл JavaScript в тему, которую вы используете на сайте Drupal, добавив строку script[] = в .info-файл темы, которую вы используете. Я бы рассмотрел этот случай, только если вы используете настраиваемую тему или модифицированную версию существующей темы, которая была переименована; Я бы не предложил сделать это, если вы используете, например, Гарленд. Выполнение этого в таких случаях означало бы потерять все изменения во все времена, когда тема будет обновлена, или скопировать обновленные файлы тем, а затем повторно применить те же изменения, которые применяются к предыдущей версии файлов; если изменение только добавляет строку script[], то это изменение минимально, и это может стоить сделать это, но это также означает, что файлы JavaScript не добавляются в каталог, содержащий тему файлы, или вы должны добавлять файлы JavaScript каждый раз, когда тема обновляется.

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

Как уже сообщалось в другом ответе, hook_init() - это то, что вы должны реализовать. Я добавлю, что hook_library() - это новый крючок, добавленный в Drupal 7 для файлов Javascript, таких как плагины jQuery.

ответил kiamlaluno 13 J000000Wednesday11 2011, 16:07:23
3

Вы можете использовать Js Injector для добавления скриптов непосредственно в панель администратора Drupal. В качестве альтернативы вы можете использовать drupal_add_js () функцию добавьте файл js на свою страницу.

ответил Shabir A. 3 ThuEurope/Moscow2015-12-03T16:00:37+03:00Europe/Moscow12bEurope/MoscowThu, 03 Dec 2015 16:00:37 +0300 2015, 16:00:37
1

Вы можете создать простой настраиваемый модуль и добавить его таким образом. Код будет похож на следующий:

MYMODULE_init() {
  drupal_add_js(drupal_get_path('module', 'MYMODULE') . '/FILE.js');
}
ответил Jamie Hollern 13 J000000Wednesday11 2011, 15:42:42
1

Вы можете просто использовать в YOURTHEME_preprocess_theme(), если вы хотите применить логическое условие:

drupal_add_js(drupal_get_path('theme','your_theme').'/js/yourplugin.js');

и добавьте также файл yourtheme.info:

scripts[] = js/yourplugin.js

ответил Jamie Hollern 13 J000000Wednesday11 2011, 15:42:42
1

Если вы используете модуль Context, установите Context Add Assets. Настройте глобальный контекст или конкретный контекст и добавьте новую реакцию для добавления ресурса JS по пути или по модулю.

Не требуется кодирование.

ответил ebeyrent 22 Maypm13 2013, 19:13:42
1

В настоящее время существует множество внешних библиотек.

Поместить их все под каталог js темы не всегда желательно, так как иногда эти библиотеки состоят из нескольких js-файлов и нескольких файлов css.

Я закончил использование функции libraries_get_path модуля библиотеки, чтобы взять их пути из каталога /all /libraries dir:

Вот как я добавил выбранные файлы, относящиеся к textext.js:

<?php 
function MYMODULE_init() {

  // Add jQuery library to a specific page.
  if (arg(0) == 'messages' && arg(1) == 'new') {
    // Add the jQuery TextExt library ( http://textextjs.com/ )
    $libdir = libraries_get_path('jquery-textext');
    drupal_add_js("$libdir/src/js/textext.core.js");
    drupal_add_js("$libdir/src/js/textext.core.js");
    drupal_add_js("$libdir/src/js/textext.plugin.tags.js");
    drupal_add_js("$libdir/src/js/textext.plugin.autocomplete.js");
    drupal_add_js("$libdir/src/js/textext.plugin.suggestions.js");
    drupal_add_js("$libdir/src/js/textext.plugin.filter.js");
    drupal_add_js("$libdir/src/js/textext.plugin.focus.js");
    drupal_add_js("$libdir/src/js/textext.plugin.prompt.js");
    drupal_add_js("$libdir/src/js/textext.plugin.ajax.js");
    drupal_add_js("$libdir/src/js/textext.plugin.arrow.js");

    drupal_add_css("$libdir/src/css/textext.core.css");
    drupal_add_css("$libdir/src/css/textext.plugin.tags.css");
    drupal_add_css("$libdir/src/css/textext.plugin.autocomplete.css");
    drupal_add_css("$libdir/src/css/textext.plugin.focus.css");
    drupal_add_css("$libdir/src/css/textext.plugin.prompt.css");
    drupal_add_css("$libdir/src/css/textext.plugin.arrow.css");
  }

} ?>

Мне бы хотелось услышать, есть ли внешний репозиторий, в котором все эти библиотеки предопределены, поэтому я не буду их определять вручную.

ответил Druvision 21 42013vEurope/Moscow11bEurope/MoscowThu, 21 Nov 2013 10:23:06 +0400 2013, 10:23:06
0

Я рекомендую вам загрузить jQuery из куклового Google CDN. Проверьте эту ссылку для получения дополнительной информации: http://code.google.com/apis/libraries/devguide.html#jquery . Убедитесь, что вы не загружаете один и тот же сценарий несколько раз на своем сайте.

ответил ANDiTKO 19 J000000Tuesday11 2011, 15:14:19
0

это то, что сработало для меня, нет необходимости создавать модуль для плагина jQuery или устанавливать его - в моем template.php я добавил:

function YOURTHEME_js_alter(&$javascript){
    // overwriting for newer jQuery version
    $javascript['misc/jquery.js']['data'] = path_to_theme() . '/assets/js/jquery-1.9.0.js';
    // also the min...
    $javascript['misc/ui/jquery.ui.core.min.js']['data'] = path_to_theme() . '/assets/js/jquery-ui-1.10.0.custom.min.js';
    // here I add the library (jQuery plugin) to resolve an error -> $.browser.msie undefined
    $javascript[path_to_theme() . '/assets/js/jquery-migrate-1.1.0.min.js'] = array(   
        "group" => -100,
        "weight" => -18.990,
        "version" => "1.1.0",
        "every_page" => true,
        "type" =>   "file",
        "scope" => "header",
        "cache" => true,
        "defer" => false,
        "preprocess" => true,
        "data" =>  path_to_theme() . '/assets/js/jquery-migrate-1.1.0.min.js',
    );

}
ответил David Moldenhauer 13 FebruaryEurope/MoscowbWed, 13 Feb 2013 00:41:10 +0400000000amWed, 13 Feb 2013 00:41:10 +040013 2013, 00:41:10
-4

Другой способ - добавить следующий код в файл page.tpl.php
drupal_add_js (drupal_get_path ('theme', 'path /to /your /plugin'). '/plugin.js', 'file');

ответил houmem 11 WedEurope/Moscow2013-12-11T01:07:53+04:00Europe/Moscow12bEurope/MoscowWed, 11 Dec 2013 01:07:53 +0400 2013, 01:07:53

Похожие вопросы

Популярные теги

security × 330linux × 316macos × 2827 × 268performance × 244command-line × 241sql-server × 235joomla-3.x × 222java × 189c++ × 186windows × 180cisco × 168bash × 158c# × 142gmail × 139arduino-uno × 139javascript × 134ssh × 133seo × 132mysql × 132