Devo semplicemente incollare il codice nel file modello principale o esiste un altro modo consigliato di collegare nuovi plug-in Jquery in Drupal 7?
Devo semplicemente incollare il codice nel file modello principale o esiste un altro modo consigliato di collegare nuovi plug-in Jquery in Drupal 7?
Risposte:
Il modo più semplice è semplicemente aggiungerlo sul file .info del tuo tema:
scripts[] = js/my_jquery_plugin.js
L'unica eccezione è se stai aggiungendo una risorsa esterna (CDN / script ospitato), nel qual caso dovresti usare drupal_add_js (), come spiegato da Jamie Hollern
Uncaught TypeError: undefined is not a function
drupal_add_library()
Drupal ha confezionato Jquery con esso.
Per aggiungere un file js puoi usare drupal_add_js nel modo descritto in altri post.
Funzionerà in casi semplici, ma se inizi ad avere plugin che dipendono da altri plugin. potresti voler guardare le librerie api . Mi aspetto che con il tempo i moduli verranno creati per supportare le librerie più diffuse, ce ne sono alcune per JQuery integrate in system_library () .
In questo esempio per includere il modulo jQuery ui.accordion puoi usare drupal_add_library ()
drupal_add_library('system', 'ui.accordion');
Questo assicurerà che js sia incluso insieme al CSS e alle eventuali librerie che dipendono da esso. Si assicurerà inoltre che le librerie siano incluse solo una volta.
Se dici quale libreria stai usando, posso fornire un codice di esempio per come definirlo
Quindi prima crea un modulo per definire la libreria (chiamalo qtip) e carica il modulo in una cartella js sotto la cartella del modulo
quindi implementare 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;
}
Quindi per aggiungere il file inserisci il tuo codice
drupal_add_library('qtip', 'qtip');
Questo può essere eccessivo per una semplice libreria, ma se devi gestire un gran numero di librerie su più siti e temi, semplifica la vita.
Se vuoi caricare lo script solo su alcune pagine (non tutte) puoi aggiungerlo tramite il tuo file template.php. Basta aggiungere un codice simile a questo:
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');
}
}
L'ho provato solo in Drupal 6.
Puoi aggiungere un file JavaScript al tema che usi nel sito Drupal, aggiungendo una script[] =
riga nel file .info del tema che stai usando. Considererei questo caso solo se si utilizza un tema personalizzato o una versione modificata di un tema esistente che è stato rinominato; Non consiglierei di farlo se si utilizza, ad esempio, Ghirlanda. Farlo in questi casi significherebbe perdere tutte le modifiche ogni volta che il tema viene aggiornato o copiare i file del tema aggiornati e quindi riapplicare le stesse modifiche applicate alla versione precedente dei file; se la modifica aggiunge solo una script[]
riga, la modifica è minima e potrebbe valerne la pena, ma significherebbe anche che i file JavaScript non vengono aggiunti nella directory contenente i file del tema, oppure è necessario aggiungere i file JavaScript ogni volta che il tema viene aggiornato.
In alternativa, è possibile creare un modulo personalizzato o aggiungere codice a un modulo personalizzato esistente che si sta già utilizzando per quel sito.
Il pro è che i file JavaScript sarebbero aggiunti a ogni tema impostato come predefinito, o tema di amministrazione, senza la necessità di cambiare tutti i temi che sono abilitati sul sito e che gli utenti possono selezionare da soli.
Come già riportato in un'altra risposta, hook_init()
è l'hook che dovresti implementare. Aggiungerò che hook_library()
è il nuovo hook aggiunto in Drupal 7 per i file Javascript come i plug-in jQuery.
Puoi usare il modulo Js Injector per aggiungere script direttamente nel pannello di amministrazione di Drupal. In alternativa puoi usare la funzione drupal_add_js () per aggiungere il tuo file js alla tua pagina.
È possibile creare un semplice modulo personalizzato e aggiungerlo in questo modo. Il codice sarebbe simile al seguente:
MYMODULE_init() {
drupal_add_js(drupal_get_path('module', 'MYMODULE') . '/FILE.js');
}
Puoi semplicemente usarlo YOURTHEME_preprocess_theme()
se vuoi applicare la condizione logica:
drupal_add_js(drupal_get_path('theme','your_theme').'/js/yourplugin.js');
e aggiungi anche nel tuo file yourtheme.info:
scripts[] = js/yourplugin.js
Se stai utilizzando il modulo Context, installa Context Aggiungi risorse. Imposta un contesto globale o un contesto specifico e aggiungi una nuova reazione per aggiungere l'asset JS per percorso o modulo.
Nessuna codifica richiesta.
Esistono molte librerie esterne che devono essere incluse al giorno d'oggi.
Metterli tutti nella directory js del tema non è sempre desiderabile poiché a volte quelle librerie sono composte da più file js e più file css.
Ho finito per usare la libraries_get_path
funzione del modulo libraries per prendere i loro percorsi dalla directory sites / all / libraries:
Ecco come ho aggiunto i file selezionati relativi a 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");
}
} ?>
Mi piacerebbe sapere se esiste un repository esterno in cui tutte quelle librerie sono predefinite, quindi non dovrò definirle manualmente.
Ti consiglio di caricare jQuery dal pupblic Google CDN. Controlla questo link per maggiori informazioni: http://code.google.com/apis/libraries/devguide.html#jquery. Devi solo assicurarti di non caricare lo stesso script più volte nel tuo sito.
questo è ciò che ha funzionato per me, non è necessario creare un modulo per un plugin jQuery o installarne uno - nel mio template.php ho aggiunto:
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',
);
}
un altro modo è quello di aggiungere il seguente codice al file
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/… ).