Allora vediamo insieme come fare!
Cosa vi serve
Innanzitutto dovete scaricare lo script Nivo Slider dal sito ufficiale.
Scaricato il file zip, non vi resta che estrarre i file che andranno poi caricati online per essere utilizzati nel blog.
I file da usare nel blog
Per inserire uno slideshow nel blog, caricate online i seguenti file:
- jquery-1.4.3.min.js
- jquery.nivo.slider.pack.js
- nivo-slider.css
- style.css: questo file va prima modificato secondo le vostre esigenze (colori, dimensioni, immagini, ecc)
Una volta caricati online, andate in Blogger - Design - Modifica HTML e incollate dopo la riga <head> il seguente codice:
<link rel="stylesheet" href="url nivo-slider.css" type="text/css" media="screen" />
<link rel="stylesheet" href="url style.css" type="text/css" media="screen" />
<script type="text/javascript" src="url jquery-1.4.3.min.js"></script>
<script type="text/javascript" src="url jquery.nivo.slider.pack.js"></script>
<link rel="stylesheet" href="url style.css" type="text/css" media="screen" />
<script type="text/javascript" src="url jquery-1.4.3.min.js"></script>
<script type="text/javascript" src="url jquery.nivo.slider.pack.js"></script>
Come funziona
Lo script è caratterizzato da una grande semplicità d'uso e presenta molteplici opzioni di personalizzazione. Per maggiori informazioni vi rimando alla pagina di utilizzo e quella dei demo.
Resto a disposizione per ogni dubbio o chiarimento.
Copyright © Iole - Non è consentito ripubblicare, anche solo in parte, i post di questo blog senza l'esplicito consenso dell'autrice.
Copyright 2008- 
Design by 
Interessantissimo, il tuo slide è stupendo!!!
RispondiEliminaInteressante ... che tu sappia si possono inserire le foto personali?
RispondiEliminaQueste poi vengono adattate automaticamente alla grandezza della slide o la ingrandisce?
Grazie
@AbcHobby.it: wow sei sempre la prima a commentare ^_^
RispondiElimina@marissa: nello slideshow puoi inserire qualsiasi foto basta che hanno tutte le stesse dimensioni. Poi, in base alle dimensioni delle foto, devi personalizzare il file style.css
Bellissimo!!!
RispondiEliminaStavo proprio cercando qualcosa del genere da inserire nel mio blog!
Grazie!!!
Ciao
ciao Iole, so che la cosa che ti richiedo è moooooooooooooolto impegnativa: secondo me dovresti fare un creatore di widget ( quelli nuovi ) per le letterine, così ognuno si sceglie colore, scrittura, testo, "bollino ", immagini ( forse è un pò troppo... )
RispondiEliminase questo ti richiede più lavoro che realizzare tantissime letterine lascia stare, comunque 6 mitica!
ps: per favore mi rispondi nel prossimo post che scrivi???? lo sò che pretendo troppo da te, prendi la mia idea come un consiglio, non una cosa da fare subito!!!!
sei the best!
ely
@CSJ: questo slideshow è perfetto in un blog di fotografia come il tuo.
RispondiElimina@ely.ghera.99: ti ringrazio per il consiglio. Sinceramente quando ho pubblicato il post dei widget non pensavo che la letterina avesse avuto così tanto successo e che avessi ricevuto tante richieste.
Ci stavo pensando anch'io a realizzare dei widget personalizzabili ma non è semplice. Ma non mi arrendo facilmente, quindi chissà molto presto vedrai nuovi widget personalizzabili.
come sempre belle idee... brava!!
RispondiEliminaScusa ma non ho capito come devo caricare on line quei file.Potresti spiegare meglio, per favore , non ho capito molto bene il procedimento .
RispondiEliminaGrazie stsai
Erika
@Alessandra: grazie!
RispondiElimina@Erika: per funzionare lo slideshow ha bisogno dei due file javascript (js) e dei due fogli di stili (css). Tali file vanno caricati online su un qualsiasi hosting (io utilizzo digiland).
Una volta caricati online, possiamo aggiungere i link nel nostro blog con il codice presente nel mio post.
Ciao, i tuoi lavori sono semplicemente meravigliosi!
RispondiEliminaIeri ho aggiunto la tua carinissima letterina nel mio blog, sono molto contenta!
E ti ringrazio di cuore per essere passata a trovarmi :)
Ti auguro un buon week end pieno di creatività.
Un abbraccio e a presto.
Bello Iole cara ma come al solito, sarò limitata non ho capito un accidente.
RispondiEliminaA parte il teorico di scarica file ecc.ecc. ma poi preparare quello che hai messo tu....pasqua, calendaria, benvenuta primavera...ecc. sono già predisposte nel tuo codice????
Abbia pazienza mia cara e grazie sei fortissima e...dove lo trovi il tempo????
Un abbraccio
Edvige
Ciao Iole, ti volevo solo dire che ti ho linkato nel post "ringraziamenti" ciao ale
RispondiElimina@Edvige: ti posso assicurare che è più facile a farsi che a dirsi.
RispondiEliminaCome al solito, se vuoi che te ne realizzi uno personalizzato (con i tuoi post più popolari o con i tuoi post preferiti o con i tuoi blog amici) basta chiedere.
Il mio slideshow l'ho realizzato creando le immagini per ognuno dei post più popolari pubblicati di recente e personalizzando poi il file style.css
@Alessandra: sono io che devo dire grazie a te!
Ciao Iole! Come al solito sei sempre unica e originale nel tuo genere!!! Ho letto cosa devo fare,ma non so dove posso cambiare le immagini! Inoltre,come fai a mettere il link alle foto,e quando ci clicchi sopra ti portano al link inserito??? Grazie mille per questo widget!!! =)
RispondiEliminaFantastica Iole....sempre unica nel suo genere!!! =) Ho letto come si dovrebbe procedere,ma da dove posso scegliere le immagini??? Inoltre come faccio ad allegare ad un immagine un link,in modo tale che quando ci si clicca sopra,si raggiunge il link prima indicato???
RispondiEliminaGrazie mille per lo splendido widget!!! Sei grande =) !!!
@Simone: trovi tutte le istruzioni dettagliate sulla pagina di utilizzo dello slideshow.
RispondiEliminaTi riassumo comunque cosa bisogna fare:
- creare le immagini e caricarle online
- personalizzare il foglio di stile style.css
- creare lo slideshow con il seguente codice:
<div id="slider">
<a href="indirizzo pagina 1"><img src="indirizzo immagine 1" alt="" /></a>
<a href="indirizzo pagina 2"><img src="indirizzo immagine 2" alt="" /></a>
<a href="indirizzo pagina 3"><img src="indirizzo immagine 3" alt="" /></a>
...
</div>
Sulla pagina di utilizzo dello slideshow trovi altre opzioni per personalizzare lo slideshow (ad esempio come impostare gli effetti, le descrizioni delle immagini, ecc).
Ciao Iole,io non ho molta esperienza con queste cose xD ma per caricare quei file online come faccio?
RispondiEliminaGrazie dell'aiuto :)
@Valeria: puoi caricare i file su digiland o su qualche altro servizio di hosting.
RispondiEliminaEhm, ma come faccio?
RispondiEliminaScusami se ti infastidisco.
@Valeria: non so come aiutarti. Digiland è molto semplice ed intuitivo, quali problemi hai?
RispondiEliminaInoltre sulla pagina di utilizzo dello slideshow trovi tutti i dettagli per realizzare lo slideshow.
ciauu, mi sento un po' imbranata perchè non ho capito nadaaaa.
RispondiEliminacome si fa??? xD
@missfeliciti99 e tutti: sulla pagina di utilizzo dello slideshow è spiegato tutto in modo chiaro e semplice che ho pensato non servisse una spiegazione dettagliata.
RispondiEliminaViste le numerose richieste, in futuro pubblicherò un post con tutte le istruzioni per realizzare il proprio slideshow.
Al momento ho diverse richieste in sospeso, quindi dovrete attendere.
ciao volevo mettere lo slideshow nel blog ma non ho capito come caricare i file on line...quale programma devo usare? mi puoi spiegare meglio grazie ale
RispondiElimina@Alessandra: come ho già detto in precedenza in futuro pubblicherò un post con una spiegazione dettagliata visto che in tanti non avete capito come fare. Eppure è semplicissimo e la spiegazione sulla pagina di utilizzo è molto chiara.
RispondiElimina@tutti/e: Al momento ho diverse richieste d'aiuto che aspettano una risposta, alcune delle quali da parte di lettori che sono stati generosi con me con donazioni e regali. Purtroppo il tempo a disposizione per aiutare tutti è davvero poco perché sono molto impegnata a lavoro. Vi chiedo di avere pazienza.
Ciao Iole ,con sincera ammirazione i più
RispondiEliminaentusiastici complimenti per il
tuo bellissimo lavoro,6 UNICA !
Una stretta di mano, una pacca sulla spalla, un sorriso smagliante e poche ma sincere parole per dirti: Complimenti !!!
Ti ho messa nel mio blog (LINK)http://www.merylu.fan-club.it/Baci e BUONA DOMENICA DELLE PALME !
@Merily: grazie per avermi linkata. Ho aggiunto il tuo link nell'elenco dei blog che mi linkano e nella sidebar.
RispondiEliminascusami sono un' imbranata nn so cm fare non è che me lo spieghi???
RispondiEliminavorrei mettere le letterine e il calendario sul mio blog ma non ci riesco!!! dimmi in poche parole come devo fare!!!
@MISSMISSNOME: inserire uno slideshow come il mio nel proprio blog non è complicato, basta seguire le semplici istruzioni riportate nel sito ufficiale.
RispondiEliminaPer le letterine, il calendario e qualsiasi altro mio widget basta copiare il codice che compare sotto ciascun widget ed incollarlo in un gadget di tipo html/javascript della sidebar.
Spero di essere stata chiara. Se hai difficoltà ad aggiungere al tuo blog qualcuno dei miei widget, lascia un commento nel post dal quale stai prelevando il codice così posso essere più precisa ed aiutarti a risolvere il "problema".
Ciao =) ho caricato i file solo una cosa non ho capito: come si fa a personalizzare il foglio di style.css ?? Perchè me lo apre con blocco note .... e un'altra cosa non trovo il file jquery-1.4.3.min.js al suo posto ho estratto il file jquery.nivo.slider fa lo stesso ??
RispondiElimina@Marty@Angel@Devil: per personalizzare il foglio di style.css puoi utilizzare il blocco note o qualsiasi altro editor di testo.
RispondiEliminaPer il file jquery-1.4.3.min.js, ho provato ora a scaricare il pacchetto dal sito ufficiale e nel file .zip del download trovi il file nella cartella nivo-slider\demo\scripts. Il file ora si chiama jquery-1.6.1.min.js
Il file l'ho trovato ^^ volevo sapere una cosa per modificare il file css, lo apro con il blocco note ma i link delle immagini che carico sui siti di hosting dove li devo incollare ?? Non vorrei fare un disastro ^^ e per mettere i testi e fare in modo che quando si clicca su un immagine ti si apra una pagina web ?? Ho letto i commenti precedenti ma non ho capito molto con i codici sono un pò imbranata.
RispondiEliminaUn'ultima domanda: non è possibile vedere un'anteprima di come verrà lo slideshow prima di metterlo sul blog e scegliere la grandezza giusta ??
@Marty@Angel@Devil: in effetti nel post sono stata molto sintetica, non ho scritto in dettaglio come fare per modificare il css o inserire le immagini nel blog.
RispondiEliminaPensavo che le istruzioni riportate nel sito ufficiale fossero abbastanza chiare.
Comunque apprezzo tantissimo il tuo impegno (a differenza di molti che si arrendono subito alla prima difficoltà), quindi ti aiuto volentieri a realizzare il tuo slideshow.
Mandami via email i link dei file che hai caricato online (.js e .css), i link delle immagini e i link delle pagine che vuoi aprire cliccando su ciascuna immagine. Così ti invio un file .html che sarà l'anteprima del tuo slideshow.
Poi ti spiegherò passo passo come inserirlo nel blog.
Ciao Iole scusami se disturbo volevo chiederti se potevi farmelo un pò personalizzato perchè visto che io ho un sito di ricette e ne vorrei mettere uno che girando escono le ricette e vorrei fare che le ricette cambiasseo ogni giorno se si deve aggiornare ogni volta che devono cambiare le ricette me lo potresti fare tu e poi le altre volte lo faccio io? grazie 1000 in anticipo e scusami del disturbo :-(
RispondiEliminaFammi sapere se si può fare e se puoi scusami ancora!!! =) a presto!
@vinchef: se hai già caricato online i vari file necessari, mandami via email i link dei file e delle immagini come ha fatto Marty@Angel@Devil. Ti manderò appena possibile il codice per il tuo slideshow personalizzato. Dando un'occhiata al codice vedrai che non è così complicato modificarlo.
RispondiEliminaIn questi giorni sono impegnata con la realizzazione di due siti web e di un template per un blog, se non ricevi subito una risposta abbi pazienza.
Ciao Iole scusa se ti disturbo,
RispondiEliminacome ti ho spiegato nell'email se metto il widget nella sidebar si vede però l'animazione è "disturbata" e le immagini non sono "cliccabili", mentre se lo metto nell'html sotto l'head mi da questo errore: The reference to entity "st" must end with the ';' delimiter. Ho cercato questo "st" nel codice ma non lo trovo. Ho provato anche a modificare qualche cosa ma niente. Che faccio ??
@Marty@Angel@Devil: di preciso dove hai incollato il codice che ti ho inviato? In un gadget di tipo html/javascript o nel template del blog?
RispondiEliminaAllora prima nel gadget di tipo html/javascript ma dovo aver trovato i problemo l'ho tolto dal gadget e l'ho messo nle template del blog ma non si salva
RispondiElimina@Marty@Angel@Devil: ho provato ad inserire nel template del mio blog di prova il codice che ti ho inviato via email e come mi hai segnalato compare l'errore ... "st" must end with the ';' delimiter ....
RispondiEliminaIn pratrica l'errore che ti compare inserendo quel codice nel template (mentre non compare incollandolo in un gadget di tipo html/javascript) è dovuto alla presenza del carattere & presente nel link dei lettori.
Trova quindi &st e sostituiscilo con &st e poi dimmi se lo slideshow continua a vedersi "disturbato".
Ciao ^^
RispondiEliminaMi sono letta tutto il codice lettera per lettera ma questo &st prprio non lo trovo ....
@Marty@Angel@Devil: compare nell'indirizzo relativo all'immagine "Diventa lettore fisso".
RispondiEliminaTi incollo parte del link:
www.google.com/friendconnect/settings/edit?smpl=true&st= ...
Ok sono riuscita a modificarlo ^^ ho provato a metterlo prima su modifica html, dopo l'ho tolto da li e l'ho messo su un gadget html/javascript ma riscontro sempre gli stessi problemi di prima =(
RispondiElimina@Marty@Angel@Devil: allora significa che lo script dello slideshow va in conflitto con qualche altro script presente nel blog. Nel mio blog di prova funziona perfettamente e non è disturbato come da te.
RispondiEliminaIl problema è che non ho idea di quale sia lo script che va in conflitto con lo slideshow ....
RispondiElimina@Marty@Angel@Devil: se vuoi possiamo fare un ultimo tentativo.
RispondiEliminaCarico i file degli script sul mio dominio a pagamento, ti creo il file per lo slideshow e ti mando il codice da inserire in un gadget di tipo html/javascript (nel mio blog ho fatto così).
Ci lavorerò questa sera.
Va bene grazie mille ^^
RispondiEliminaUtilissimissimo il tuo blog..davvero ricco
RispondiEliminaora vediamo se riesco a metterti in difficoltà :)
avrei l'esigenza di inserire nel mio blog una serie di poche foto in slideshow, ma le voglio accompagnare con del testo che cambia al mutare delle singole foto...un pò come alcuni templates di wordpress...
dici che si può fare o chiedo troppo???
grazie per tutto quello che fai
andrea
@Marty@Angel@Devil: ti ho inviato il codice via email. Provalo e fammi sapere!
RispondiElimina@Il Peperoncino Sportivo: quello che mi chiedi si può fare!
Nella pagina di utilizzo è spiegato abbastanza bene come far apparire sopra l'immagine una descrizione (in inglese caption).
E' possibile aggiungere una descrizione semplice oppure una in html aggiungendo la proprietà title.
Ti riporto parte della spiegazione presa dal sito ufficiale:
"To add a caption to an image you simply need to add a title attribute to the image. To add an HTML Caption simply set the title attribute to the ID of a element that contains your caption (prefixed with a hash). Note that the HTML element that contains your caption must have the CSS class nivo-html-caption applied and must be outside of the slider div."
Ciao IoLe ^^
RispondiEliminaSeguo il tuo blog da poco ma già mi sono innamorata dei tuoi gawget ^^
Non ho capito come si caricano i file su Blogger...
Me lo potresti spiegare perfavore?
@.Alice.Bellixima.: inserire i miei widget nel blog è facilissimo, ti spiego volentieri come fare.
RispondiEliminaIn ogni post contenente un widget, non devi fare altro che scegliere ad esempio l'immagine di sfondo che più ti piace, il testo da visualizzare, il colore del testo, la posizione del widget nel blog, ecc. Infine non dovrai fare altro che selezionare il codice che ti compare in un box di testo e incollarlo in un gadget di tipo html/javascript della sidebar del tuo blog.
Provaci e fammi sapere.
Ciao Iole!Questo sito è semplicemente fantastico!Volevo saper se questo slideshop si può inserire anche nei fan club,se sì potresti spiegarlmelo passo passo perchè non sono un genio della tecnologia...non ci ho capito niente!!!Grazie mille!!
RispondiEliminaCiao Iole!Questo blog è semplicemente fantastico!Tante idee utilissime e grandiose!!!Volevo sapere se questo slideshop si potrebbe inserire anche in un fan club!Se si per favore potresti spiagarmi passo passo,più precisamente ciò che devo fare perchè non ho capito molto -.-'??
RispondiEliminaGrazie!!
@Elmastar: penso che il codice per lo slideshow possa essere inserito anche in un fan club.
RispondiEliminaPer le istruzioni passo passo ti consiglio di leggere il sito ufficiale, i passi da fare sono molto semplici e le istruzioni sono molto chiare.
Hey Iole.....non ho capito molo bene come si pubblicano quei programmi su internet ma soprattutto come cambiare i codici html in modo che venga fuori l'immagine che decido io....O.o
RispondiEliminahihihi nn ho capito molto benexD
@MysticGiuly: eppure sul sito ufficiale le istruzioni sono così chiare.
RispondiEliminaComunque se proprio non hai capito come si realizza uno slideshow, non metterlo nel blog ma trova qualche altro widget.
Ciao, io sono nuovo e leggendo il tuo post e anche i commenti, devo dire che per me è arabo... comunque ho scaricato tutto quello che hai consigliato, ora mi metto a lavoro.
RispondiEliminaSpero di contattarti per dire che è andato tutto a posto.
Grazie e a presto.
Salvatore
Siccome non ci riesco ... se ti do le dimensioni e le immagini che devi mettere , me lo faresti ? Grazie di tutto e se ti va visita il blog in cui lo devo inserire : wwwfantasticworldofstardoll.blogspot.com
RispondiElimina@nicepop95: al momento ho tante richieste in sospeso e poco tempo a disposizione quindi, oltre ai widget e gli script che realizzo e che metto gratuitamente a disposizione di tutti, mi occupo solo delle richieste di chi mi ha già fatto una donazione spontanea, anche piccola. Le loro richieste hanno la precedenza assoluta.
RispondiEliminaSalve Iole , avrei bisogno di un aiuto. . . Vorrei inserire uno slideshow nel blog ma non ho capito niente del post xD Mi potresti aiutare,magari se ti metto come amministratrice . Avrei bisogno anche di un template. . Spero che tu mi possa aiutare :* Baci Jasmine
RispondiElimina@JaZzzMine: come ho già scritto ai tanti che prima di te mi hanno chiesto maggiori spiegazioni... penso che nella pagina di utilizzo dello script ci siano delle istruzioni ben dettagliate. Basta solo un po' di impegno e si riesce facilmente a creare il proprio slideshow.
RispondiEliminaRiguardo al template, ho già tantissime richieste in sospeso. In questo momento non posso proprio aiutarti.
buona sera iole
RispondiEliminagrazie dei tuoi consigli ma per favore facci vedere gli esempi visivi passo passo su come modificare,salvare,iserire,il nivo slider nel sito
ho rpovato a leggere un po nel sito ufficiale ma sinceramente
non lo vedo spiegae bene
grazie iole
ciao marco
buona sera iole grazie dei consigli
RispondiEliminache ci dai online sono utili e interessanti
sono interessato come gli altri a questo nivo slider ma purtroppo anche nel sito ufficiale non ci si riesce a capire piu di tanto
dovrebbe essere spiegato bene passo passo ogni fase
per es ci dovrebbe essere un esempio visivo su come modificare e il css scaricato dove mettere url delle foto ecc..
poi una volta salvato dove va inserito?all'interno di una pagina del sito e se si dove?oppure va solamente fatto leggere nel mio caso uso file zilla
e kompozer per creare le mie pag del sito
nel mio sito ho inserito uno slide
creato con un programma inrete gratuitamente ma ne vorrei creare uno per conto mio con nivo o altro programma che potresti consigliare
scaricato il file apriamo il css lo modifichiamo(ci puoi inserire un es nel tuo blog?)poi 2 salviamo e?dobbiamo copiare e incollare in un punto preciso nella pag che vogliamo?dentro una tabella opp
grazie iole
marco
@marco: mi dispiace ma in questo momento ho tante richieste in sospeso e poco tempo a disposizione quindi mi risulta difficile pubblicare un post con le istruzioni passo passo per inserire questo slideshow nel blog.
RispondiEliminaIn rete comunque si trovano tanti script per slideshow; secondo me Nivo Slider è il più semplice da utilizzare e dagli effetti spettacolari.
Prova a cercarne qualcuno più semplice di questo.
Ciao Iole,
RispondiEliminama le immagini vanno nel file style.css o in un gadget html/java?! Per favore rispondimi! Grazie!!
@Markus: le immagini da visualizzare nello slideshow vanno in un gadget di tipo html/javascript mentre le immagini per la navigazione (per intenderci le freccette che compaiono a destra e a sinistra e i pallini che compaiono sotto allo slideshow) vanno nel file css.
RispondiEliminaCiao Iole.....ecco, questo è molto carino. Lo cercavo con un effetto scorrimento diapositiva tra le immagini cosa che purtroppo Nevo non ha). Inoltre ultimamente gli effetti di transizione di Nevo mi danno problemi in chrome.....bah..... ^_^ grazie di tutto!
RispondiElimina@LeChatNoir: quando ho pubblicato il post avevo trovato nella documentazione Nivo quali erano tutti gli effetti di transizione disponibili ma ora non li trovo più. Quelli che vedi nel mio post sono effetti casuali.
RispondiElimina@ Iole sisi, ti ringrazio iole, ho recuperato la documentazione ma non c'è l' effetto di cui ti parlavo :(
RispondiEliminaL' ho trovata una slide carina su un sito. te l' ho già linkato via mail, magari tu che ci capisci un botto in più riesci a trovare una valida alternativa a nivo che purtroppo sta dando i numeri
Uffi non riesco proprio a farlo :( accidenti sono un'incapace
RispondiElimina@LeChatNoir: spero di riuscire a realizzare presto per te lo slideshow che mi hai richiesto.
RispondiElimina@Miriam Rizzo: quando ho scritto questo post, lo script per lo slideshow era molto più semplice da personalizzare ed intuitivo. Ora le cose sono cambiate un po'.
Se vuoi posso aiutarti io a realizzare uno slideshow personalizzato, contattami via email.