¿Debo pegar el código en el archivo de plantilla principal, o hay alguna otra forma recomendada de adjuntar nuevos complementos de Jquery en Drupal 7?
¿Debo pegar el código en el archivo de plantilla principal, o hay alguna otra forma recomendada de adjuntar nuevos complementos de Jquery en Drupal 7?
Respuestas:
La forma más fácil es agregarlo al archivo .info de su tema:
scripts[] = js/my_jquery_plugin.js
La única excepción es si está agregando un recurso externo (CDN / script alojado), en cuyo caso debe usar drupal_add_js (), como lo explicó Jamie Hollern
Uncaught TypeError: undefined is not a function
drupal_add_library()
Drupal tiene a Jquery empaquetado con él.
Para agregar un archivo js puede usar drupal_add_js de la manera descrita en otras publicaciones.
Esto funcionará en casos simples, pero si comienza a tener complementos que dependen de otros complementos. es posible que desee ver la API de las bibliotecas . Espero que a tiempo se creen módulos para admitir bibliotecas populares, hay algunos para JQuery ui integrados en see system_library () .
En este ejemplo, para incluir el módulo jQuery ui.accordion, puede usar drupal_add_library ()
drupal_add_library('system', 'ui.accordion');
Esto asegurará que el js se incluya junto con el CSS y las bibliotecas que dependen de él. También se asegurará de que las bibliotecas solo se incluyan una vez.
Si dice qué biblioteca está utilizando, puedo proporcionar un código de muestra para definirlo.
Primero cree un módulo para definir la biblioteca (llámelo qtip) y cargue el módulo en una carpeta js debajo de la carpeta del módulo
luego implemente 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;
}
Luego para agregar el archivo puesto en su código
drupal_add_library('qtip', 'qtip');
Esto puede ser excesivo para una biblioteca simple, pero si tiene que administrar una gran cantidad de bibliotecas en múltiples sitios y temas, hace la vida mucho más fácil.
Si desea cargar el script solo en algunas páginas (no en todas), puede agregarlo a través de su archivo template.php. Simplemente agregue un código similar a este:
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');
}
}
Solo probé esto en Drupal 6.
Puede agregar un archivo JavaScript al tema que usa en el sitio de Drupal, agregando una script[] =
línea en el archivo .info del tema que está usando. Consideraría este caso solo si está utilizando un tema personalizado o una versión modificada de un tema existente que ha cambiado de nombre; No sugeriría hacerlo si está utilizando, por ejemplo, Garland. Hacerlo en tales casos significaría perder todos los cambios cada vez que se actualiza el tema, o copiar los archivos de tema actualizados y luego volver a aplicar los mismos cambios aplicados a la versión anterior de los archivos; si el cambio solo agrega una script[]
línea, entonces el cambio es mínimo, y podría valer la pena hacerlo, pero también significaría que los archivos JavaScript no se agregan en el directorio que contiene los archivos de tema, o debe agregar los archivos JavaScript cada vez que se actualiza el tema.
Como alternativa, puede crear un módulo personalizado o agregar código a un módulo personalizado existente que ya está utilizando para ese sitio.
La ventaja es que los archivos JavaScript se agregarían a cada tema configurado como predeterminado, o el tema de administración, sin la necesidad de cambiar todos los temas que están habilitados en el sitio, y que los usuarios pueden seleccionar por sí mismos.
Como ya se informó en otra respuesta, hook_init()
es el gancho que debe implementar. Agregaré que hook_library()
es el nuevo gancho agregado en Drupal 7 para archivos Javascript como los complementos jQuery.
Puede usar el módulo Js Injector para agregar scripts directamente en el panel de administración de Drupal. Alternativamente, puede usar la función drupal_add_js () para agregar su archivo js a su página.
Puede crear un módulo personalizado simple y agregarlo de esa manera. El código sería similar al siguiente:
MYMODULE_init() {
drupal_add_js(drupal_get_path('module', 'MYMODULE') . '/FILE.js');
}
Simplemente puede usar in YOURTHEME_preprocess_theme()
si desea aplicar la condición lógica:
drupal_add_js(drupal_get_path('theme','your_theme').'/js/yourplugin.js');
y agregue también en el archivo yourtheme.info:
scripts[] = js/yourplugin.js
Si está utilizando el módulo Context, instale Context Add Assets. Configure un contexto global, o un contexto específico, y agregue una nueva reacción para agregar el activo JS por ruta o por módulo.
No se requiere codificación.
Hay muchas bibliotecas externas que deben incluirse hoy en día.
Ponerlos todos en el directorio js del tema no siempre es deseable ya que a veces esas bibliotecas están compuestas por múltiples archivos js y múltiples archivos css.
Terminé usando la libraries_get_path
función del módulo de bibliotecas para tomar sus rutas desde el directorio sites / all / library:
Así es como agregué los archivos seleccionados que se relacionan con 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");
}
} ?>
Me encantaría saber si hay un repositorio externo en el que todas esas bibliotecas están predefinidas, por lo que no tendré que definirlas manualmente.
Le recomiendo que cargue jQuery desde el CDN de Google pupblic. Consulte este enlace para obtener más información: http://code.google.com/apis/libraries/devguide.html#jquery. Solo asegúrese de no cargar el mismo script varias veces en su sitio.
esto es lo que funcionó para mí, no es necesario crear un módulo para un complemento jQuery o instalar uno; en mi template.php agregué:
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',
);
}
otra forma es agregar el siguiente código al archivo
page.tpl.php drupal_add_js (drupal_get_path ('theme', 'path / to / your / plugin'). '/plugin.js', 'file');
drupal_add_js
( api.drupal.org/api/drupal/includes--common.inc/function/… ).