Come creare uno slideshow con NivoSlivder

tramite: O2O
Difficoltà: media
15

Introduzione

Se avete bisogno di utilizzare uno slideshow che sia semplice sia nell'installazione, sia nella configurazione che nell'utilizzo, allora il NivoSlivder è uno dei migliori attualmente consigliati ed anche utilizzati.
Indicato per tutti i siti web, appoggia al framework JQuery ed offre numerosi vantaggi nell'utilizzo tra cui, ad esempio, una vasta gamma di effetti grafici di transizione sulle immagini.
Vediamo insieme con questa breve e semplice guida come installarlo e come creare uno slideshow con il nuovissimo NivoSlider.

25

Occorrente

  • Computer
  • Connessione internet
  • Editor codice HTML
35

Il primo passo è scaricare il plugin in maniera semplice e veloce dal sito http://nivo.dev7studios.com che è aggiornato all'ultima versione disponibile ossia la 3.1.
Ciò significa che il nome del file sarà il seguente "nivo-slider3.1. Zip".
Il download è gratuito se usate NivoSlider come plugin di JQuery, pagherete, invece, se lo si vorrà integrare nel proprio blog wordpress.
Appena avrete terminato il download passerete a scompattarlo trovando così una serie di file, una cartella demo e una cartella Themes. La libreria JQuery - fondamentale per il funzionamento di nivoslider - è già presente nel pacchetto scarito, all'interno della cartella Scripts, nel caso non la troviate state tranquilli perché potrete ottenerla con un altro semplice download dal sito di jQuery.

45

Continuiamo ora con il lavoro per nivoslider aprendo il file demo.html, dalla casella demo, utilizzando un editor html ed osservate le parti salienti del codice.
Ecco i principali:
Nei tag head viene importato il file css con il tema di default (link rel="stylesheet" href="../themes/default/default. Css" type="text/css" media="screen") e il file css generale del plugin (link rel="stylesheet" href="../nivo-slider. Css" type="text/css" media="screen"). All'interno del tag body invece è posizionato il contenitore (div id="slider" class="nivoSlider") che rappresenta lo slideshow. All'interno del tag DIV con id="slider", potrete aggiungere i riferimenti alle vostre immagini (che vanno posizionate fisicamente dentro la cartella images): ricordatevi che per ottenere un maggior effetto visivo, le immagini devono essere tutte delle stesse dimensioni in larghezza ed altezza.
Prima della chiusura del tag BODY infine viene importato lo script di jquery (script type="text/javascript" src="scripts/jquery-1.7.1. Min. Js"), quello di nivo slider (script type="text/javascript" src="../jquery. Nivo. Slider. Js") e viene inizializzato lo slider sull'evento load della pagina, ovvero dopo che tutta la pagina è stata caricata ($(window). Load (function () { $('#slider'). NivoSlider (); };;)
Già fatto tutto!

Continua la lettura
55

Naturalmente potrete personalizzare tutto, anche il tema grafico usato dallo slideshow, gli effetti tra una foto e l'altra, la scelta se utilizzare o meno le thumbnail e perfino rendere lo slide automatico o manuale.
Insomma, avrete un mondo da scoprire!

Potrebbe interessarti anche

Segnala contenuti non appropriati

Tipo di contenuto
Devi scegliere almeno una delle opzioni
Descrivi il problema
Devi inserire una descrizione del problema
Si è verificato un errore nel sistema. Riprova più tardi.
Verifica la tua identità
Devi verificare la tua identità
chiudi
Grazie per averci aiutato a migliorare la qualità dei nostri contenuti

Guide simili

Internet

Come creare una presentazione degli album di Facebook

Facebook è senza dubbio il social network più utilizzato nel mondo. Facilità di uso e alcune features originali hanno permesso al colosso americano di spopolare nel mondo e conquistare il cuore (e lo smartphone) praticamente di tutti. Quasi ogni persona...
Internet

Come inserire una gallery di foto sul blog

Se sei una persona alla quale piace scrivere e condividere i proprio pensieri con gli altri, il modo più creativo per farlo è sicuramente un blog; averne uno, ti permettere di esprimerti in tutta libertà, e puoi modificare i tuoi contenuti come meglio...
Internet

Come creare un pannello con i colori con jQuery

Gli indirizzi internet devono rispettare delle norme di estetica inequivocabili e che debbano essere sensibili ad un giudizio positivo dei lettori. Per crearli si devono usare dei plu gin che servono per inserire differenti funzionalità con presentazioni...
Internet

Come inserire una galleria di immagini su un blog wordpress

Negli ultimi anni, si sono diffusi a macchia d'olio i blog. Molte persone, decidono di aprire un proprio blog per svariati motivi che possono essere personali o di lavoro. Su un blog, solitamente, vengono archiviati interventi, notizie, link di diverso...
Internet

PowerPoint: 10 trucchi per una presentazione efficace

In questi ultimi anni si sta assistendo ad un uso sempre più massiccio di applicativo dedicato alla realizzazione di slideshow, tra questi spicca sicuramente PowerPoint.Questo programma è sicuramente tra i più utilizzati grazie alla vasta scala di...
Internet

Come togliere oggetti indesiderati da una foto scattata

Ti sarà capitato spesso di scattare una foto perfetta e di ritrovarci purtroppo in mezzo un elemento indesiderato, come ad esempio un turista o un oggetto. Con questa guida semplice e pratica, imparerai ad eliminare gratuitamente questi elementi indesiderati...
Internet

Come promuovere una canzone

L'evoluzione del Web da 1.0 a 2.0 e l'uso delle reti peer-to-peer hanno profondamente modificato il mercato della musica nazionale e internazionale, costringendo numerosi artisti ad aprire una vetrina personale sui più frequentati Social Network della...
Internet

Le migliori alternative ad Instagram

Tutti amano scattare fotografia, che sia dal cellulare o da una macchina fotografica.Selfie che passione! Quanti di voi non fanno altro che fare autoscatti a ripetizione? E quanti di voi, a pochi secondi dal click, li postano immediatamente su Instagram?...
I presenti contributi sono stati redatti dagli autori ivi menzionati a solo scopo informativo tramite l’utilizzo della piattaforma www.o2o.it e possono essere modificati dagli stessi in qualsiasi momento. Il sito web, www.o2o.it e Arnoldo Mondadori Editore S.p.A. (già Banzai Media S.r.l. fusa per incorporazione in Arnoldo Mondadori Editore S.p.A.), non garantiscono la veridicità, correttezza e completezza di tali contributi e, pertanto, non si assumono alcuna responsabilità in merito all’utilizzo delle informazioni ivi riportate. Per maggiori informazioni leggi il “Disclaimer »”.