Shadowbox JS: una media gallery nel plugin per wordpress
Pubblicato da Davide, Aggiornato martedì 15 aprile 2008 13 Commenti »
Sto mettendo in ordine il portfolio (tra qualche settimana tutte le novità) e per l’occasione ho integrato su questo sito il famoso javascript Shadowbox. Si tratta del solito box elegante all’interno del quale far apparire immagini, ma non solo.. Si ispira infatti ai noti Lightbox (scritto per il framework prototype) e Slimbox (scritto per il framework mootools). Ma non è un semplice clone, perchè le funzioni di Shadowbox vanno al di là della semplice galleria per immagini. E’ infatti possibile inserire all’interno qualsiasi tipo di media: dal filmato youtube a una pagina web esterna, dalle immagini ai filmati flash. Il modo migliore per capirne le potenzialità è fare un giro sulle demo del sito ufficiale.
Ne ha parlato tom qualche giorno fa. Oltre ad essere cross-browser e compatibile agli standard, il vero punto di forza di questa galleria è il supporto a diversi framework javascript, questo permette di utilizzarla in tutti i contesti: supporta infatti YUI, Prototype + Scriptaculous, jQuery, Ext, Dojo e MooTools. Una meraviglia, visto che generalmente è proprio la difficile integrazione tra i diversi framework a impedire l’utilizzo di questi eleganti metodi di presentazione.
Ho cercato un plugin che integrasse su wordpress questa galleria, per utilizzarla nella presentazione del portfolio. Detto fatto: Shadowbox JS Plugin. Per onor di cronaca esiste pure un plugin italiano con lo stesso intento, ma non c’è la possibilità di scegliere quale framework javascript utilizzare. Questo è fortemente limitante, dato che l’arma vincente di shadowbox è proprio la possibilità di utilizzo sui diversi framework.
Ho fatto quindi una traduzione in italiano del suddetto plugin, nulla di travolgente: ho semplicemente modificato i commenti al file del plugin per impostare i parametri e cambiato le scritte “next” “prev” e “close”. Su un sito completamente italiano sta meglio la scritta “chiudi”.. ;)
Se volete provarlo, potete scaricare il plugin dal sito ufficiale e sovrascrivere questi files (tradotti in italiano):
Shadowbox – zip con files in italiano
Installazione
- Caricare la cartella `shadowbox-js` in `/wp-content/plugins/`
- Attivare il plugin dal ‘Plugins’ menu in WordPress
- Aprire il file shadowbox-js.php e modificare $jsLib e $lightCSS in base alle istruzioni presenti nel file.
Utilizzo
Per far apparire un media all’interno di shadowbox basta inserire un link in questa forma:
<a href="http://domain.tld/directory/to/image.jpg" rel="shadowbox[album]">Image</a>
Il link può puntare a immagini, siti web, file flash, video su youtube, contenuto in linea. Basta assicurarsi di inserire `rel=”shadowbox”` poichè questo codice attiva il plugin.
Inserendo il codice `rel=”shadowbox[album]“` si possono inoltre raggruppare più immagini all’interno dello stesso album.
Integrazione con lightbox: se state già utilizzando lightbox sul vostro sito, non dovrete modificare nulla. Il plugin legge in automatico il codice ‘rel=”lightbox”‘ e lo interpreta normalmente.
Varie info
Articolo pubblicato martedì 15 aprile 2008 alle 00:28
Segnala questo articolo.. e sentiti utile!
13 Commenti »
Puoi lasciare un tuo commento, oppure fare un trackback dal tuo sito.
Lascia il tuo commento
1
Lino - Pubblicato il 15 04 2008 alle 09:24
Grazie mille per la piccola traduzione. La utilizzerò subito.
2
Lino - Pubblicato il 15 04 2008 alle 09:59
Penso che ti sia confuso, shadowbox-js.php è un messaggio di errore.
3
Davide - Pubblicato il 15 04 2008 alle 11:26
Ciao Lino, hai ragione.. Avevo messo link diretto al file php, ora ho fatto lo zip, molto più comodo da scaricare. Un saluto!
4
darkubec - Pubblicato il 17 04 2008 alle 17:31
Bello anche questo ma in rete se ne trovano miriadi tutti con una caratteristica in più o una in meno… Questo forse è il più completo ma la grafica (so che è modificabile, però ci vuole un bel po’ di tempo) è più brutta di, esempio, moodalbox (sempre con mootools)… non so… sviluppando un sito web dove volevo usare uno di questi plugin, ho fatto una ricerca in rete e ne ho trovati una ventina come minimo…
5
Davide - Pubblicato il 17 04 2008 alle 17:54
Beh in quanto a personalizzazione non c’è dubbio che shadowbox sia il migliore.. Il fatto di girare con tutti i framework e di avere la grafica personalizzabile via CSS lo rende solido.
6
darkubec - Pubblicato il 19 04 2008 alle 16:58
Vero, anche se ormai quasi tutti hanno la grafica contenuta in un CSS. Naturalmente tutti hanno i loro pro ed i loro contro… esempio Shadowbox fa navigare l’utente nel web sempre dentro al box che da alcuni punti di vista è un bene, da altri no: sono riuscito ad aprire 20 box uno nell’altro :D. E in tutti i casi la grafica non è totalmente personalizzabile dal CSS poichè bisogna saperne anche un po’ di js per poter, chessò, modificare qualche effetto. Comunque non c’è dubbio che sia il più completo che gira in rete (ma chissà, con la miriade di box che ci sono in giro, magari c’è l’ultimo ritrovato cinese che ti fa pure il caffè ;) )
7
cirio - Pubblicato il 25 04 2008 alle 17:07
cavolo..su v. 2.2.1 non funzia :( fa per aprirsi con la schermata leggermente nera e poi si blocca li..azz..mi sa che dovrò muovermi ad aggiornare..
8
agriturismo - Pubblicato il 09 05 2008 alle 14:43
Ottimo plugin anche se il lightbox2 (che uso ormai da un po di tempo) svolge egregiamente le sue funzioni. :-)
9
angelo56 - Pubblicato il 03 09 2008 alle 13:41
ehi! ho trovato questa guida.. l unica in italiano per shadowbox…
ho dei problemi nell usarlo e spero tu mi possa aiutare
il fatto è che ho caricato la cartella come hai detto tu..
poi che devo fare?
cosa vuol dire
# Attivare il plugin dal ‘Plugins’ menu in WordPress
# Aprire il file shadowbox-js.php e modificare $jsLib e $lightCSS in base alle istruzioni presenti nel file. ??
poi io vorrei usare shadowbox solo per le immagini.. ovvero in una pagina l immagine si ingrandirebbe con questo box ma niente di più… nessun album ne video ne richerche o che… ti prego sii chiaro :s
grazie mille in anticipo
10
FX53 - Pubblicato il 25 03 2009 alle 20:56
Ragazzi o un problema con il plugin Shadowbox JS. Il plugin con il sito funziona a meraviglia!! pero i problemi arrivano con l’editor di WordPress!! praticamente non funziona più l’inserimento delle immagini,video ecc. A voi succede??? avete già provato ad inserire immagini con l’editor mentre avete il plugin attivo???? sapete una soluzione per non dover disattivare l’ottimo plugin?? grazie ;)
11
Davide - Pubblicato il 26 03 2009 alle 23:55
Probabilmente è un conflitto javascript.. Ho notato che con IE questi problemi non ci sono, bisognerebbe evitare il doppio caricamento editando il plugin..
12
Agri - Pubblicato il 25 06 2009 alle 14:40
Che plugin usi per segnalare (Varie info) grazie ;)
13
Davide - Pubblicato il 23 08 2009 alle 15:58
Ciao Agri.. scusa il ritardo: comunque non è un plugin, l’ho scritto io direttamente.. ;)