Joomla - Come risolvere i conflitti jQuery

google-plus Scritto da . Postato in Joomla!

Cosa sono le jQuery

Per citare le parole di Wikipedia, jQuery è una libreria JavaScript per applicazioni web. Nasce con l'obiettivo di semplificare la selezione, la manipolazione, la gestione degli eventi e l'animazione di elementi DOM in pagine HTML, nonché semplificare l'uso di funzionalità AJAX, la gestione degli eventi e la manipolazione dei CSS.

jQuery e Joomla!

Usando Joomla, è facile imbattersi in malfunzionamenti generati dalle librerie jQuery caricate da plugin, moduli e componenti. I sintomi più frequenti, sono views e pagine che non si caricano o vengono visualizzate solo in parte, una slideshow che non funziona, il mancato caricamento di un modulo e dei suoi contenuti, un menu dinamico o un pannello che non appaiono e/o altro ancora.

I conflitti tra librerie javascript JQuery caricate più volte e nelle varie versioni da più estensioni e/o dal template stesso, generano questo tipo di defiance.

Che siate neofiti o utenti esperti, non è facile gestire il problema e venirne a capo. Vediamo alcune possibili soluzioni:

Disabilitare il caricamento delle librerie nelle estensioni

Sopratutto se si usano template e estensioni a pagamento (in molti casi anche i pacchetti free), prevedono la possibilità di disabilitare il caricamento delle jquery.

Disabilitarne il caricamento, non sempre risolve il problema, visto che i richiami ad esse, possono essere fatti da più estensioni contemporaneamente e possono anche doversi a versioni incompatibili delle stesse librerie.

In Joomla 2.5, visto che il richiamo non viene fatto da Joomla stesso, non si può disabilitarle indiscriminatamente. In genere è bene lasciare che venga caricata la versione più recente o compatibile del framework javascript, magari dal template in uso.

In Joomla! 3 le cose sono notevolmente cambiate. Infatti, Joomla provvede da solo a richiamare le librerie javascript necessarie senza l'uso di plugin o estensioni di terze parti.

In ogni caso, se ci trovassimo a combattere contro un conflitto di questo tipo, la prima cosa da fare è sempre impedire ai plugin ed estensioni di terze parti di caricare da soli le librerie. Esempio tipico è quello del componente per la gestione dei contenuti K2. Ecco come configurarlo:

  • Aprite il pannello di gestione di K2 e cliccare su Parametri K2 (in alto a destra).

  • Nella scheda Impaginazione, dal menu a tendina riportante l'etichetta gestione librerie jQuery scegliere Non caricare la libreria jQuery .

  • Cliccate su Salva (in altro a sinistra)

Uso della direttiva noConflict()

Un'altra soluzione (più avanzata), come riportato nella documentazione jQuery a proposito dei conflitti è controllare e all'occorrenza modificare gli script in modo tale da richiamare la direttiva $.noConflict() all'interno dei nostri script che generano conflitti.

Un esempio di codice:

<script type="text/javascript">
    $.noConflict();
    jQuery(document).ready(function($) {
        // Codice javascript
    });
</script>

Oltre all'inserimento della riga $.noConflict() è buona abitudine sostituire l'alias $ con la chiave etesa jQuery, per evitare conflitti se più librerie fanno uso del carattere $ ( es. Mootools, Bootstrap). Ciò riduce le probabilità di conflitto e crea una sorta di separazione fra i vari script.

Per sapere di più sui vari metodi di utilizzo, è necessario leggere la documentazione API di jQuery:

jQuery.noConflict()

Uso di plugin System per risolvere i conflitti

Una terza possibilità, deriva dall'uso di plugin studiati appositamente per la risoluzione di questi conflitti. Un esempio:

JQuery Easy

Si tratta di un plugin di tipo System che richiama le librerie javascript (JQuery, JQuery UI, Mootools, Bootstrap...) unificandone le versioni e impedendo a codice specifico e/o alle estensioni di caricarne altre, aggiungendo all'occorrenza la direttiva $.noConflict().

Esistono diversi plugin free che svolgono questa funzione.

E' bene far notare comunque, che vanno configurati in modo da funzionare al meglio con la vostra installazione di Joomla! e che l'equilibrio potrebbe alterarsi nuovamente se installate un'altra estensione che fa uso di librerie javascript.

Può anche essere utile nella risoluzione dei conflitti, analizzare il sorgente della pagina. A tal proposito, potrebbe interessarti questa lettura:

How to resolve jQuery conflicts

Alcuni suggerimenti e soluzioni

Un consiglio che do, è di testare il funzionamento del sito ogni volta che installate una nuova estensione, in special modo plugin e moduli, per verificare se questi in qualche maniera alterano il funzionamento di certe pagine e/o componenti nel vostro website.

A volte, il semplice sostituire il plugin o estensione con una equivalente, risolve il problema senza battere la testa per risolvere conflitti di questo tipo che come è ovvio, richiedono conoscenze specifiche e una certa esperienza.

Altra cosa da dire, è che se avete effettuato l'aggiornamento a Joomla 3 da Joomla 2.5 o utilizzate un'estensione compatibile con entrambe le versioni, non è detto che se non crea conflitti nell'una, non lo faccia nell'altra e viceversa. Infatti, la gestione delle librerie javascript è diversa tra le due versioni di Joomla.

Basti pensare che in Joomla 3, il richiamo alle jQuery, viene effettuato facendo riferimento direttamente a delle funzioni del core di Joomla e che le Mootools una volta native in Joomla ora sono deprecated, ovvero considerate prossime all'essere accantonate definitivamente. In molte occasioni, possono addirittura essere incompatibili con il contesto.

JB Library plugin

E' un plugin di tipo system creato da Joomla Bamboo per controllare e manipolare il caricamento delle varie librerie. Viene usato in parallelo con le estensioni di Joomla Bamboo. Tuttavia, se usato in maniera scorretta, o in un ambito sbagliato, può creare dei conflitti.

E' scaricabile dal seguente link: JB Library Plugin

Se il plugin è caricato, facendo tasto destro (sulla pagina) > Visualizza sorgente pagina tra i vari richiami alle librerie tra i tag <head></head>, troverete anche qualcosa di simile:

<script src="/media/zen/js/jquery/jquery-1.8.3.min.js" type="text/javascript"></script>
<script src="/media/zen/js/jquery/jquery-noconflict.js" type="text/javascript"></script>

La libreria jquery può essere richiamata anche da Google:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript"></script>

Se vi rendete conto di avere queste righe nel sorgente della vostra pagina, provate a disabilitare il plugin JB Library:

  • Andate nel backend (lato amministrativo) del vostro sito
  • Navigate fino a Estensioni > Gestione plugin, Filtro - Tipo - system
  • Individuate il plugin JB Library e dopo averlo selezionato, disabilitate il plugin.

Se hai gradito l'articolo, condividilo, basta un click:

Aggiungi commento

I commenti lasciati dagli utenti del blog sono sempre soggetti a controllo prima di eventuale pubblicazione. I commenti non considerati adatti per contenuti, spam o forma saranno eliminati e non pubblicati. Leggi i Termini e Condizioni di utilizzo per maggiori informazioni.


Codice di sicurezza
Aggiorna

  • logo teoca
  • materexcel collabora
  • logo flash pulizie
  • revolution srl
  • logo arcotraslochi
  • montaggio mobili trento
  • logo elevatori sito
  • logo prontopro

Prima di andartene...

Perché non rimanere in contatto?

Clicca sul pulsante "Mi piace" qui sotto per rimanere aggiornato su tutti i nuovi contenuti e ricevere notifica degli articoli interessanti che condivido giornalmente sulla Pagina Facebook dedicata al blog.

Puoi anche iscriverti alla newsletter e al nuovo canale YouTube di blog.dangerx82 così da rimanere sempre aggiornato sui nuovi contenuti...

x

Per essere più facile ed intuitivo, il blog fa uso dei cookie, piccole porzioni di dati che consentono di capire come gli utenti navighino e ne visualizzino le pagine. I cookie non registrano alcuna informazione personale sull'utente ed eventuali dati identificabili non verranno memorizzati. Ti invitiamo a prendere visione della nostra Informativa sulla Privacy (aggiornata il 25/05/2020). Oppure visiona la nostra Cookie Policy (aggiornata il 17/10/2019):