Login
Nome utente:

Password:

Ricorda



Recupero password

Registrati!
Navigazione
Utenti Online
18 utente(i) online
(1 utente(i) in Tutorial)

Iscritti: 0
Ospiti: 18

altro...
Tutorial :: Sviluppo e Hack :: Hack Moduli

Myalbum con effetto lightbox!


Myalbum con effetto lightbox!
slyss
Modificate il vostro myalbum con il sistema di visualizzazione lightbox!
Profilo Autore: slyss
E' ormai più di un annetto che io uso lightbox con myalbum ma purtroppo non ho mai avuto tempo
di scrivere un bel tutorial.

Finalmente questo tempo l'ho trovato (grazie alle vacanze pasquali ) e quindi eccovi il
tutorial per trasformare il vostro myalbum in un myalbum-lightbox.

Per chi si chiedesse che cosa è lighbox può vedere una preview cliccando qui:

http://www.stefanosilvestrini.com/lab/


INIZIAMO!!!

Scaricatevi e scompattate il seguente pack:

http://www.huddletogether.com/project ... releases/lightbox2.04.zip



Andiamo via FTP ed apriamo la cartellina themes presente nella root del nostro sito Xoops.
Entriamo nella cartellina del nostro tema in uso ed editiamo il file theme.html:

prima della chiusura del tag
</head>

inserite questo codice:

<script type="text/javascript" src="<{$xoops_url}>/js/prototype.js"></script>
<script type="text/javascript" src="<{$xoops_url}>/js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="<{$xoops_url}>/js/lightbox.js"></script>
<link rel="stylesheet" href="<{$xoops_url}>/css/lightbox.css" type="text/css" media="screen" />


ora salvate e chiudete.

Ora fate upload delle direcotry css, js e images presenti nel pack lightbox 2.04 facendo attenzione
di non sovrascrivere la cartellina images (già presente nella vostra root), ma copiando i file della
lightbox/images/ ed incollandoli nella root/images/ del vostro sito Xoops.

A questo punto siamo pronti a modificare il codice.

ATTENZIONE: utilizzerò il nuovo sistema di TEMPLATE OVERRIDE usando come esempio la visualizzazione a TABELLA di myalbum.
(se vorrete potrete cambiare tipo di visualizzazione dalle preferenze di myalbum, ricordando di modificare il codice del template relativo)




Andiamo via ftp in:

root_del_sito/modules/myalbum/templates

e copiamo sul nostro desktop (o dove vorrete) il file myalbum_viewcat_table.html

A questo punto apriamo il file ed editiamolo in questo modo:

alla riga 65 troviamo la riga:

<a href='<{$mod_url}>/photo.php?lid=<{$photo.lid}>'><img src='<{$photo.imgsrc_thumb}>' <{$photo.width_spec}> alt='<{$photo.title}>' title='<{$photo.title}>' border='0' /></a>


e la modifichiamo in questo modo:

<a href='<{$photo.imgsrc_photo}>' rel='lightbox[]'><img src='<{$photo.imgsrc_thumb}>' <{$photo.width_spec}> alt='<{$photo.title}>' title='<{$photo.title}>' border='0' /></a>


Ora salviamo il file e chiudiamo.





Eseguiamo la stessa procedura con questo file: myalbum_photo_in_list.html ed

alla riga 11 troviamo questo codice:

<a href='<{$mod_url}>/photo.php?lid=<{$photo.lid}>'><img src='<{$photo.imgsrc_thumb}>' <{$photo.width_spec}> alt='<{$photo.title}>' title='<{$photo.title}>' /></a>


e la modifichiamo in questa maniera:

<a href='<{$photo.imgsrc_photo}>' rel='lightbox[]'><img src='<{$photo.imgsrc_thumb}>' <{$photo.width_spec}> alt='<{$photo.title}>' title='<{$photo.title}>' /></a>


ed alla riga 16 troviamo:

<a href='<{$photo.ahref_photo}>' target='_blank'><img src='<{$photo.imgsrc_thumb}>' <{$photo.width_spec}> alt='<{$photo.title}>' title='<{$photo.title}>' /></a>


e la modifichiamo:

<a href='<{$photo.imgsrc_photo}>' rel='lightbox[]'><img src='<{$photo.imgsrc_thumb}>' <{$photo.width_spec}> alt='<{$photo.title}>' title='<{$photo.title}>' /></a>


Ora salviamo il file e chiudiamo.





Eseguiamo la stessa procedura con questo file: myalbum_photo.html ed

alla riga 28 troviamo questo codice:

<a href="<{$photo.ahref_photo}>" target="_blank" onClick="window.open('<{$photo.ahref_photo}>','','width=<{$photo.window_x}>,height=<{$photo.window_y}>');return(false);"><img src="<{$photo.imgsrc_photo}>" border="0" align="center" vspace="3" hspace="7" alt="<{$photo.title}>" title="<{$photo.title}>" <{$photo.width_height}> /></a>


e la modifichiamo in questa maniera:

<a href='<{$photo.imgsrc_photo}>' rel='lightbox[]'><img src="<{$photo.imgsrc_photo}>" border="0" align="center" vspace="3" hspace="7" alt="<{$photo.title}>" title="<{$photo.title}>" <{$photo.width_height}> /></a>


Ora salviamo il file e chiudiamo.






A questo punto usiamo il template override e quindi andiamo via ftp in:

root_del_sito/themes/il_tema_in_uso/ creiamo una cartellina modules (se non è già presente)
ed al suo interno creiamo una cartellina myalbum. All'interno di questa cartellina myalbum inseriamo i file appena creati.

Ora per sicurezza andiamo via ftp a svuotare la cartellina template_c presente nella root del nostro sito.



Ora aprite il file js/lightbox.js e modificate le righe 49 e 50 in questo modo:

fileLoadingImage:        'http://www.stefanosilvestrini.com/lab/images/loading.gif',     
fileBottomNavCloseImage'http://www.stefanosilvestrini.com/lab/images/closelabel.gif',


inserendo quindi il path completo relativo al vostro sito.



IL TUTORIAL E' FINITO. Ora avrete il vostro myalbum con la visualizzazione lightbox!

Vi ricordo che con il sistema lightbox non avrete il conteggio dei click e delle visualizzazioni delle vostre foto,
ma avrete un effetto visivo veramente eccellente.

Happy Xoops! :xi

ciao Stefano
<< Realizzazione di un sito multilingua contenente idiomi. Installare TinyMCE al posto di XoopsEditor >>
API: RSS | RDF | ATOM
Copyright© slyss & Xoops Italia
I commenti sono di proprietà degli autori. Si declina ogni responsibilità sul loro contenuto.

Autore Contenuto
timgno
Data di invio: 11/4/2010 15:41  Aggiornato: 11/4/2010 15:41
Guru
Iscritto: 16/5/2007
Da: Cosenza
Inviati: 1520
 Re: Myalbum con effetto lightbox!
L'immagine 'Chiudi' non la preleva, come mai?

Autore Contenuto
carlog
Data di invio: 22/12/2011 1:02  Aggiornato: 22/12/2011 1:02
Matricola
Iscritto: 27/9/2007
Da:
Inviati: 1
 Re: Myalbum con effetto lightbox!
ma dov'è questo tutorial?
Grazie

Autore Contenuto
Anonymous
Data di invio: 17/7/2012 3:04  Aggiornato: 17/7/2012 3:04
 Re: Myalbum con effetto lightbox!
Visualizza immagine originale ceremony photography deals can vary from as small as 0 and up to, 000 and at times a lot more (is dependent should you strategy to get the day captured in video clip at the same time). cheap evening dresses cheap evening dresses cocktail dress cheap cocktail dress cheap mother of the bride wedding dresses mother of the bride wedding dresses Based to the variety of prints prom dress sales prom dress sales , reprints, model (B&W, distinct effects) and other items included in the package deal get ready to established aside at least 30% of the entire spending budget for photographs alone black tie maternity dress black tie maternity dress . When you really feel you cannot stretch your funds, don't stress yet. formal evening dresses formal evening dresses You can request whenever they can propose a fantastic photographer who can work within your price range. Most professionals can have a list handy in cases such as these. When you have a marriage ceremony coordinator, they too can allow you to look for a photographer to fit within your price range. Really should I go for negatives or digital prints? In this short evening dress short evening dress

Autore Contenuto
huff01
Data di invio: 5/9/2012 11:52  Aggiornato: 5/9/2012 11:52
Senior
Iscritto: 5/9/2012
Da:
Inviati: 164
 fake watches
Visualizza immagine originale tended financial condition, the innovation proves just like the most stunning respond to with the Swiss clock and observe makers. Gauges house", mechanisms of intelligent postings and breathtaking swirls replica watches Audemars Piguet replica watches Audemars Piguet , geared up in metals as noble as pink or grey gold Audemars Piguet Swiss Watches Audemars Piguet Swiss Watches , content high-tech alloys, or finely labored variants ceramics held the high-speed motorboat in Baselworld. swiss emporio armani replica watch swiss emporio armani replica watch Emporio Armani Womens watches Emporio Armani Womens watches If your spherical kind preserves its favour close to the Swiss clock and enjoy makers, the watches of type sq., quadratique fake watches for sale fake watches for sale , barrel, Breitling Colt GMT watches Breitling Colt GMT watches rhombus also flowered on their stands replica watches for sale replica watches for sale. The packing containers of quite modest dimension mark their wonderful return to the girl iwc replica iwc replica , although one particular oscillates involving oversize dimensions and diameters marginally reduce as opposed to types of such very last a long time for your Sirs Fake Breitling Watches Fake Breitling Watches . Photos with 2009 Wyler Geneve Code S Chronograph A

Autore Contenuto
huff01
Data di invio: 12/9/2012 3:12  Aggiornato: 12/9/2012 3:12
Senior
Iscritto: 5/9/2012
Da:
Inviati: 164
 replica girard perregaux watches
skin. To bring back your bright complexion, begin from the among out. Guarantee you're eating several vegetables. Leafy greens are the foremost effective, Replica Rolex Swiss Watch Replica Rolex Swiss Watch and therefore are citrus fruits. Vitamins A, fake watches for sale fake watches for sale C and B are extraordinarily necessary for glowing skin hermes replica hermes replica replica ebel watches replica ebel watches . There are also special vitamins you will take that are formulated to help encourage healthy skin graham replica watches graham replica watches . Olive oil: This is often an incredible natural moisturizer! Strive it as long as you don't have oily skin jacob co replica jacob co replica Visualizza immagine originale . You don't wish to risk breaking out. There are lots of overthecounter moisturizers that mare created to eliminate free radicals and provides you a bright complexion that creates your skin look younger and newer. While these skin treatments can assist you in your efforts to induce glowing skin, I can't encourage a healthy lifestyle enough u boat replica u boat replica . That not

Autore Contenuto
huff01
Data di invio: 12/9/2012 4:02  Aggiornato: 12/9/2012 4:02
Senior
Iscritto: 5/9/2012
Da:
Inviati: 164
 porsche design replica
both hands, cover their hair. The tail with a hair stick knob and adapt the volume level because the natural u boat replica u boat replica . 4: finishing rupture to explode is also exposed in a sack replica rolex watches for men replica rolex watches for men . Finally, spray on hair spray, hair and hands free to grab the confusion, looks more natural and dynamic replica hermes watches replica hermes watches . Not like different financial markets, the Forex market has no physical location, no important exchange. Also ebel replica ebel replica , the Lazy Day Trader can reinforce your dealing replica zenith watches replica zenith watches . It operates through an electronic community of banks replica rolex replica rolex , companies plus people dealing one forex for another. Visualizza immagine originale Currency exchange marketplace operates 24/5. You could industry any time you want from the Monday to Friday. Forex is in all probability the biggest marketplace from the sector about $ 1, 9 trillion plus with the large choice of other people dealing foreign exchange graham replica graham replica

Autore Contenuto
huff01
Data di invio: 12/9/2012 5:35  Aggiornato: 12/9/2012 5:35
Senior
Iscritto: 5/9/2012
Da:
Inviati: 164
 replica iwc watches
thenboyfriend Chris Brown in 2009, replica bell ross watches replica bell ross watches communicated to her fans over several Twitter messages that the message of the video was woman safety and awareness. panerai replica watches panerai replica watches However replica watches, representatives from the Parents Television Council and Industry Ears have reportedly petitioned to have BET and parent company Viacom stop winding the video. Paul Porter fake breitling alange sohne replica watches alange sohne replica watches , sarcar replica sarcar replica cofounder of Industry Ears, which movements opposition negative images in the medium argued replica ferrari replica ferrari , "If Chris Brown shot a female in his fashionable movie and BET premiered it, Visualizza immagine originale the earth would stop zenith replica zenith replica . Rihanna should no get a pass replica omega replica omega . " Porter narrated the video's violent scene as "a cold, calculated execution of assassinate in premier period. " Melissa Henson of the Parents Television Council said, "Instead of narrating martyrs they should quest help,
Sostieni XoopsItalia!
Ultimi Tutorial
Ultime Traduzioni
XOOPS ITALIA © 2002-2012 - Powered by XOOPS