Qualche lettore mi ha chiesto come creare l’effetto peel sul proprio sito/blog, l’arricciatura della pagina che vedete in alto a destra per intenderci. Si tratta di un semplice script. Siccome è un argomento che può interessare ad altri ho deciso di scrivere un piccolo tutorial a riguardo :

 

1. La prima cosa da fare è ovviamente scaricare il pacchetto completo contenente i files necessari da inserire nel vostro blog. Io lo scaricai più di sei mesi fa e non ricordo più il link, quindi ho messo il mio file peel.zip che potete scaricare qui

2. A questo punto estraete tutti i files contenenti in peel.zip
3. All’interno della cartella estratta troverete tre files : esel.js , esel_b.swf , esel_s.swf ed una cartella “image” in cui vi sono altri due files, large.jpg e beispiel_s.swf
4. Aprite il file esel.js con un editor di testo ( textedit se usate un mac, blocco note se usate windows )
5. Cercate questa stringa (dovrebbe essere la seconda riga ) : esel.ad_url = escape(’http://allnews.netsons.org/contattami‘) ed al posto di “http://allnews.netsons.org/contattami” inserite il link che volete venga aperto ogni qual volta qualcuno clicchi sul peel.
6. Chiudete il file e salvate le modifiche.

Se intendete sostituire l’immagine large.jpg le dimensioni sono 500×500 pixel. E’ necessario ovviamente che l’immagine che andrete a sostituire sia rinominata allo stesso modo, altrimenti dovreste modificare il percorso nel file esel.js ( ma non ne vale la pena )

• A questo punto caricate l’intera cartella “peel” sul vostro sito/blog tramite un client ftp o in qualunque altro spazio web abbiate a disposizione.

• Ora non vi resta far altro che richiamare lo script. Inserite il seguente codice sopra il tag Head : <script src=”http://www.allnews.netsons.org/peel/esel.js” type=”text/javascript”></script> indicando al posto di http://www.allnews.netsons.org/peel/esel.js il percorso in cui avete caricato file esel.js

• Salvate tutto e godetevi il nuovo effetto.

 

L’effetto visualizzato quando il peel è chiuso sarà quello presente anche su questo blog , ma potrete sostituirlo semplicemente cambiando il file beispiel_s.swf . Qui riporto una alternativa decisamente più pacchiana ( magari a qualcuno di voi può piacere ) Ovviamente anche in questo caso dovrete rinominare il file come beispiel_s.swf .
Infine va detto che quando il peel è chiuso, è possibile visualizzare anche una immagine statica anzichè l’effetto in flash, ma occorre modificare leggermente il file esel.js. Nei prossimi giorni pubblicherò lo script modificato di modo che venga visualizzata una miniatura anzichè l’effetto in flash. Spero di essere stato chiaro in questo mini tutorial, se ci fossero problemi fatevi avanti e chiedete pure nei commenti.