Isotope Gallery è un modulo Joomla per gallerie di immagini e video responsive, dotato di filtri, ridimensionamento opzionale delle immagini, layout e un visualizzatore a comparsa LightGallery.
1. Requisiti
- Joomla 3.6 o versioni successive, PHP 8+.
- Il modulo deve essere installato in
modules/mod_mx_isotopegallery. - Per il ridimensionamento delle immagini, si consiglia il supporto PHP GD e una directory della cache di Joomla scrivibile.
- Per i contenuti YouTube e Vimeo, il browser del visitatore deve essere in grado di caricare i file multimediali esterni.
2. Installazione e pubblicazione
- Nell’area di amministrazione di Joomla, apri Sistema > Installa > Estensioni.
- Carica
mod_mx_isotopegallery.zipe completare l’installazione. - Apri Estensioni > Moduli e crea o modifica un modulo Isotope Gallery.
- Scegli una posizione nel template, imposta il modulo su "Pubblicato" e configura l'assegnazione al menu.
- Salva il modulo e apri una pagina front-end assegnata.
Il pacchetto utilizza i file presenti nella sua assets, core, field, elementse tmpl . Conservare queste directory quando si sposta o si aggiorna il modulo.
3. Guida rapida
- Selezionare «Articoli», «Elementi personalizzati» o «Cartella» in «Origine».
- Configurare i campi visualizzati per quella fonte e aggiungere almeno un elemento o un articolo utilizzabile.
- Scegliere Galleria o Isotope in Layout, quindi selezionare il numero di colonne.
- Decidere se abilitare la galleria a comparsa e configurarne i controlli in "Impostazioni galleria".
- Pubblica il modulo in una posizione visualizzata dal template attivo.
4. Opzioni della fonte
Articoli
Gli articoli vengono caricati dal com_content e sono limitati agli articoli pubblicati e accessibili, nonché alla lingua attiva.
- "Seleziona categoria" consente di scegliere le categorie degli articoli.
- "Articoli delle sottocategorie" include le sottocategorie quando l'opzione è abilitata.
- "Profondità delle categorie" limita il numero di livelli secondari inclusi.
- "Articoli in primo piano" mostra tutti gli articoli, li nasconde o visualizza solo quelli in primo piano.
- "Campo articolo in base al quale ordinare" supporta l’ordine del gestore, l’ordine in evidenza, le visualizzazioni, il titolo, l’ID, l’alias e le date di pubblicazione.
- "Direzione di ordinamento" consente di scegliere l'ordine crescente o decrescente.
- "Count" imposta il numero massimo di articoli. Un valore pari a
0indica che non vi è alcun limite. - "Apri link" apre l’articolo nella stessa finestra, in una nuova finestra o in una finestra a comparsa.
Testo dell’articolo e metadati
- Titolo della categoria, Titolo dell’articolo, Descrizione, Data, Autore e «Leggi tutto» possono essere visualizzati o nascosti.
- "Lunghezza massima titolo" e "Lunghezza massima descrizione" troncano il testo visualizzato. Utilizzare
0per visualizzare tutto il testo. - Il "Formato data" accetta i formati di data PHP elencati, come
Y-m-del, d F Y. - "Leggi tutto" modifica l’etichetta utilizzata per il link all’articolo.
Elementi personalizzati
Gli elementi personalizzati vengono inseriti nel sottomodulo "Elementi". Aggiungere una riga per ogni elemento della galleria.
| Campo | Come utilizzarlo |
|---|---|
| Tipo | Selezionare image, youtube, oppure vimeo. |
| Immagine | Seleziona un'immagine multimediale di Joomla quando il tipo è image. |
| YouTube / Vimeo | Inserisci l'URL completo del video per il tipo di video selezionato. |
| Nome filtro | Inserisci uno o più nomi di classi di filtro separati da spazi, ad esempio nature featured. |
| Titolo, Autore, Informazioni | Testo facoltativo visualizzato con l’elemento. |
| Link "Leggi di più" | URL facoltativo associato al titolo dell'elemento. |
| Apri il link in una nuova finestra | Scegliere se aprire il link "Leggi tutto" nella finestra corrente o in una nuova finestra. |
| Altezza dell'elemento per lo stile Galleria | Scegliere "Normale" o "Doppio". Questa opzione si applica al layout "Galleria", non a quello "Isotope". |
Per utilizzare il filtraggio personalizzato, abilita "Usa filtraggio", crea i nomi dei filtri nel sottomodulo "Filtri" e utilizza gli stessi nomi nel campo "Nome filtro" di ciascun elemento.
Cartella
Seleziona una directory al di sotto della directory principale del sito images con l’opzione "Directory cartella". Il modulo esegue la scansione di quella directory e delle sue sottodirectory.
- L’ordine delle immagini supporta l’ordine alfabetico, “più recenti per primi” e l’ordine casuale.
- Le estensioni dei file multimediali locali supportate includono
jpg,jpeg,png,gif,bmp,webp,mp4,webm,ogg,ogv,mov, em4v. - "Titolo immagine" visualizza il nome del file senza l’estensione. I trattini bassi, i trattini e i numeri vengono convertiti in spazi.
- Quando l’opzione “Usa filtro” è abilitata, i nomi delle sottocartelle di primo livello diventano pulsanti di filtro.
images/gallery/landscape/sunrise.jpg
images/gallery/portrait/person.jpg
Se images/gallery selezionata, landscape e portrait possono essere utilizzati come filtri per le cartelle.
5. Filtraggio
Filtri degli articoli
Per gli articoli, abilitare i filtri per categoria e/o per tag. I pulsanti di filtro vengono generati dalle categorie e dai tag presenti nei risultati degli articoli caricati. Abilitare "Mostra etichette filtro" per visualizzare le etichette configurate e abilitare "Mostra pulsante Tutto" per visualizzare il pulsante "Tutti gli elementi" con il testo specificato in "Testo pulsante Tutto".
Filtri personalizzati per gli elementi
I nomi dei filtri personalizzati sono nomi di classi CSS. Utilizza nomi semplici e mantieni la stessa ortografia sia nella definizione del filtro che nelle righe degli elementi. Se un elemento contiene più nomi, apparirà in ogni filtro corrispondente.
Filtri per cartelle
I filtri per cartella utilizzano il primo livello di directory al di sotto della cartella selezionata. I file presenti direttamente all’interno della cartella selezionata non appartengono a un filtro per cartella con nome specifico, ma rimangono visibili tramite “Tutti”.
6. Immagini e ridimensionamento
Origini delle immagini degli articoli
Abilita le fonti immagine desiderate e definisci la loro priorità in “Ordine di recupero”. L’ordine predefinito è:
image_intro, image_fulltext, inline_introtext, inline_fulltext
- "Da immagine introduttiva" legge l’immagine introduttiva dell’articolo.
- "Da immagine nel testo completo" legge l’immagine presente nel testo completo dell’articolo.
- Da "Testo introduttivo in linea" cerca le immagini all'interno del testo introduttivo.
- Da "Testo completo in linea" individua le immagini all'interno del testo completo.
Viene utilizzata la prima immagine disponibile nell’ordine configurato. "Percorso segnaposto" fornisce l’immagine di riserva quando non è disponibile alcuna immagine dell’articolo.
Impostazioni di ridimensionamento
Impostare "Resize Mode" su un'opzione di ridimensionamento per creare versioni memorizzate nella cache delle immagini locali. "None" lascia l'immagine originale invariata.
- "Centra" ridimensiona centrando il risultato.
- "Fill" ridimensiona per riempire le dimensioni richieste e può ritagliare i bordi.
- "Adatta" mantiene l'immagine all'interno delle dimensioni richieste.
- "Allunga" impone la larghezza e l’altezza richieste e può modificare le proporzioni.
- La compressione "Qualità" accetta valori da 1 a 100.
- Il formato di output può mantenere il formato di origine o generare GIF, JPEG, PNG o WEBP.
- "Mantieni trasparenza" si applica all'output in formato GIF e PNG.
- Larghezza immagine e Altezza immagine definiscono le dimensioni di destinazione. I valori devono essere maggiori di zero quando il ridimensionamento è abilitato.
I file generati vengono memorizzati nella directory "resize" della cache di Joomla. Assicurarsi che PHP possa creare e scrivere in tale directory. Le immagini esterne e i file video non vengono elaborati dall’helper per il ridimensionamento delle immagini.
7. Layout e Aspetto
- Layout: "Galleria" utilizza la gestione degli elementi in stile galleria; "Isotope" utilizza la gestione a griglia in stile Isotope.
- Effetto parallasse: abilita le immagini con effetto parallasse per il layout Isotope.
- Colonne: consente di selezionare da una a sei colonne.
- Stile: sceglie il foglio di stile chiaro o scuro.
- Dettagli: mostra i dettagli al passaggio del mouse o li visualizza per impostazione predefinita.
- Colore: imposta il colore di risalto per sfondi, link e filtri attivi.
- Spazio tra gli elementi: seleziona la distanza tra gli elementi.
- Font Awesome: carica Font Awesome 4 o 5 solo quando necessario per la compatibilità delle icone.
- Correzioni SEO: abilitare questa opzione quando il template richiede l’aggiunta del percorso radice del sito alle miniature delle immagini della galleria.
- Carica jQuery: abilitare solo se il template non fornisce già jQuery.
- CSS personalizzato: aggiunge dichiarazioni CSS alla pagina. Limita i selettori al modulo per evitare di modificare altri componenti.
8. Impostazioni della galleria
Queste impostazioni configurano il popup di LightGallery. Hanno effetto solo quando è abilitata l’opzione “Usa galleria a popup”.
| Impostazione | Effetto |
|---|---|
| Tema bianco | Utilizza il tema bianco di LightGallery. |
| Tipo di transizione | Utilizza una transizione di dissolvenza o scorrimento. |
| Ripetizione | Consente la navigazione dall'ultimo elemento al primo. |
| Pulsante di download | Mostra o nasconde il controllo di download. |
| Miniatura | Mostra o nasconde le miniature. |
| Animazione delle miniature | Utilizza miniature animate o statiche. |
| Riproduzione automatica / Controlli di riproduzione automatica | Avvia la riproduzione automatica e determina se i controlli di riproduzione sono visibili. |
| Intervallo tra le transizioni | Imposta la pausa della riproduzione automatica in millisecondi. |
| Durata della transizione | Imposta la durata dell'animazione in millisecondi. |
| Schermo intero, Zoom, Rotellina del mouse, Condivisione | Abilita o disabilita la funzione corrispondente del visualizzatore. |
| Controlli di rotazione | Abilita gli strumenti di rotazione e capovolgimento, con interruttori separati per ciascun controllo. |
| Velocità di rotazione | Imposta la durata dell'animazione di rotazione in millisecondi. |
I video presenti nelle cartelle locali e i contenuti personalizzati di YouTube o Vimeo utilizzano il supporto video della galleria quando la finestra a comparsa è abilitata. Le politiche di riproduzione automatica del browser potrebbero richiedere la riproduzione con audio disattivato o l'interazione dell'utente.
9. Impostazioni avanzate
- Il suffisso della classe del modulo aggiunge un suffisso di classe al wrapper del modulo per lo styling specifico del template.
- Layout alternativo seleziona una sostituzione del layout del modulo disponibile.
- La memorizzazione nella cache può utilizzare l’impostazione globale di Joomla oppure disabilitare la cache del modulo.
- "Durata della cache" imposta la durata della cache quando la memorizzazione è abilitata.
10. Risoluzione dei problemi
Non vengono visualizzati elementi
- Verificare che il modulo sia pubblicato, assegnato alla voce di menu corrente e posizionato in una posizione del template in cui viene visualizzato.
- Per gli articoli, controllare lo stato di pubblicazione, il livello di accesso, la lingua, le categorie, le impostazioni in evidenza e il conteggio.
- Per gli elementi personalizzati, verificare che il sottomodulo contenga elementi e che gli URL delle immagini o dei video siano validi.
- Per le cartelle, verificare che il percorso selezionato esista al di sotto
imagese contenga file supportati.
Mancano i filtri
I filtri degli articoli vengono generati solo in base ai risultati degli articoli correnti. I filtri personalizzati richiedono nomi corrispondenti sia nell’elenco dei filtri che nelle righe degli elementi. I filtri delle cartelle richiedono sottodirectory di primo livello.
Le immagini non vengono ridimensionate
Scegli una modalità di ridimensionamento, inserisci dimensioni positive, verifica il supporto di PHP GD e assicurati che la directory della cache di Joomla sia scrivibile. L’elaborazione del ridimensionamento si applica alle immagini locali, non agli URL remoti o ai video.
Il popup non si apre
Abilita l’opzione “Usa galleria a comparsa”, verifica la presenza di errori JavaScript o conflitti tra librerie ed evita di caricare una seconda copia incompatibile di jQuery. Svuota le cache di Joomla e del browser dopo aver modificato script o stili.
Il video non viene riprodotto
Controlla l’URL del file multimediale, i permessi del file, il tipo MIME, il supporto del browser e le impostazioni di privacy o di incorporamento del provider esterno. La riproduzione automatica può essere bloccata dal browser finché il visitatore non interagisce con la pagina.
11. Aggiornamento
Eseguire il backup della configurazione del modulo e dei file del sito prima dell’aggiornamento. Installare il file ZIP più recente tramite il programma di installazione delle estensioni di Joomla. Il manifesto dell’estensione dichiara un server di aggiornamento, pertanto Joomla potrebbe proporre aggiornamenti anche quando il server è raggiungibile.
