|
Immagini con effetto light box |
Una coppia di plugin ottima per creare e ingrandire miniature con effetto lightbox nelle nostre pagine su Joomla!
Talvolta vogliamo inserire delle immagini dentro i nostri articoli in modo che se vengono cliccate esse aumentino di dimensione, magari con un piacevole effetto in stile lightbox. Vedremo come farlo agevolmente installando due plugin che funzionano molto bene e che sono settabili molto facilmente.
Scaricate da qui il pacchetto contenente i due pluginper creare i lightbox. Una volta scaricato dovrete dezipparlo e quindi da estensioni, installa/disinstalla installerete entrambi i plugin che trovate dentro la cartella che sono:
- protos.lightbox.js.zip
- protos.lightbox.zip
Poi da gestione plugin attivateli entrambi. (Fate attenzione perchè il plugin Protos Lightbox JS si troverà nella seconda pagina -od oltre- dei plugin. Lo dico perchè a me è accaduto di non riuscire a far funzionare il lightbox proprio perchè non mi ero accorto che tale plugin era ancora inattivo).
Quindi aprite il plugin Protos Lightbox dove troverete tre parametri:
Larghezza -larghezza della miniatura dell’immagine;
Height -altezza della miniatura dell’immagine
Cartella - Qui metterete il nome della cartella (es.tuacartella) dove metterete le immagini. Dovrà essere messa dentro la cartella images/stories. Se la lasciate in bianco il plugin pescherà le immagini esattamente dentro la cartella images/stories.
A questo punto siamo pronti per inserire dentro un nostro articolo il codice che farà apparire le immagini: {limage}tuaimmagine.jpg{/limage}
Questi plugin funzionano davvero a meraviglia con qualsiasi dei principali browser ed hanno la particolarità che l'immagine in miniatura, al clic, sparisce proprio dalla pagina, dando l'impressione che si sia ingrandita la miniatura, e si adatta alle dimensioni del monitor. Se l'immagine originale è di 1200 pixel di larghezza, ma chi la clicca lo sta facendo da un monitor di 1024 pixel, l'immagine si fermerà a 1024 pixel evitando di apparire con le barre di scorrimento, lasciando all'utente la scelta di ingrandirla del tutto.
Questa coppia di plugin presenta anche un difetto. Una volta settate le dimensioni della miniatura, queste resteranno tali per tutte le miniature del sito. Quindi le immagini, se non si vuole che appaiano deformate nelle miniature, dovranno avere tutte le stesse proporzioni larghezza x altezza.
EDIT: è stato risolto questo problema eliminando l'height. Ho predisposto il Pacchetto_lightbox2 dove appunto le miniature delle immagini si adatteranno alle proporzioni delle foto originali inserendo nel plugin soltanto il parametro della larghezza. Ovviamente in questo modo le miniature avranno differenti dimensioni in altezza se le immagini originali hanno dimensioni diverse. Inoltre è adesso a disposizione anche il Pacchetto_lightbox3 che consente in aggiunta di stabilire al volo cartelle diverse dove prendere le immagini. Scrivendo questo codice per far apparire la miniatura in un articolo {limage}images/tuacartella/tuaimmagine.jpg{/limage}. Se si sceglie di mettere i percorsi in questo modo occorre lasciare in bianco la casella della cartella nei parametri del plugin.
I plugin si prestano bene anche alla creazione di una galleria fotografica, che può essere navigata con i tasti delle freccette della tastiera. Si possono anche aprire contemporaneamente diverse immagini e spostarle nel vostro monitor.
Qui una demo dei plugin lightbox.
Tonicopi
|
Commenti
Ho installato i due file in versione 3, installazione senza problemi. Attivati entrambi i plugin.
Creo un nuovo articolo e inserisco il codice {limage}tuaimmagine.jpg{/limage} ma ottengo questo errore nel sito:
Notice: Trying to get property of non-object in C:\Program Files\EasyPHP5.2.10\www\plugins\content\protos.lightbox.php on line 34
L'immagine ovviamente non si vede, ma c'è il punto in cui dovrebbe esserci e se faccio click lì si vede il movimento di espansione e la scritta loading, ma ovviamente non c'è l'immagine, solo un bordino vuoto.
L'errore è in testa a tutti gli articolo, anche inseriti precedentemente e non va via neanche disinstallando entrambi i plug-in. L'unica è rimuovere l'articolo dove avevo inseriro il tag speciale anche se il tag era stato rimosso e l'articolo era vuoto.
Idee?
Grazie
E' la prima volta che mi viene segnalato un errore di questo tipo.
Non posso farlo online perchè non ho un host in cui provare. Proverò magari con Xampp e ti faccio sapere.
Cmq facendo una ricerca con "protos.lightbox.php on line 34" in google vengono fuori un paio di siti tipo questo: http://www.oratoridicesate.it/component/jevents/icalrepeat.detail/2010/01/24/199/-/ODNkM2M3NDEyMGIwN2M2ZTI3ZDEwNzEwYmNlOGI yM2M=.html
E qui: http://forum.joomla.it/index.php?topic=88932.0 un utente ha lo stesso problema, ma nessuno ha risposto...
Boh...
Innanzitutto grazie per questo script!
Volevo chiederti solo 1 cosa: ho inserito il tag rel per collegare tra loro le foto e quindi poter scorrere, in pieno effetto lightbox, tra le varie foto.
L'unico problema è che il tasto con la freccia a destra si sovrappone al tasto di chiusura con la x!
Hai per caso idea di come potrei fixare la cosa?
Grazie mille!
è possibile fare in modo che questi o un altro plugin vengano applicati a tutte le immagini di un sito in joomla senza che ogni volta si debba inserire il codice nell'articolo?
devo consegnare un sito a un cliente che non è pratico e speravo in un codice da inserire nell'index o nel foglio di stile che mi applichi l'effetto litebox a tutte le immagini che vengono inserite....
grazie in anticipo..
grazie e buona domenica Frà
Grazie mille
Potresti spiegarmi perfavore il procedimento esatto da seguire? Con il codice per visualizzare l’immagine in posizione centrale non ho problemi, se invece cerco di farla visualizzare con un allineamento diverso il risultato ottenuto è come quello del tuo primo esempio con una sola riga ( alla fine della foto) di scrittura nello spazio libero. Grazieeee Frà
in explorer il popup funziona in firefox il popup si apre ma dice impossibile visualizzare la pagina.
che cosa sbaglio!?!?!?!?
grazie mille a tutti
Sito + strutture + laboratori
volevo chiederti se c'è un modo per far apparire la "pop-up" sempre al centro della pagina....
P.S.: Ho modificato $limage per gestire i path delle immagini direttamente dal tag {limage} , in modo da poter usare anche altri percorsi (anche contemporaneame nte, ed ho rimosso la stampa del parametro height così da eliminare problemi di storpiatura di immagini con altezze differenti...
Possono interessare queste modifiche, magari implementandole come opzioni, o pensi che siano troppo specifiche?
Grazie per l'ottimo lavoro, che ha risolto molti dei miei problemi!
Forse, però, sarebbe utile inserire anche la riga di codice che occorre per attivare il meccanismo ^__^