La musica nel sito web

Transcript

1 La musica nel sito web Alcuni webmaster sentono l esigenza di vivacizzare il proprio sito web attraverso l utilizzo di una musica di sottofondo o persino di una playlist. Navigando per la rete potete trovare moltissimi siti che vi permettono di creare delle playlist, personalmente vi consiglio i servizi offerti da che ora trovate a e che vi permette di creare una playlist con i brani presenti nel sito e poi di ottenere il codice da inserire nel vostro sito web, vediamo come: 1) Per prima cosa colleghiamoci a MyFlashFetish e creiamo un account gratuito 2) Selezioniamo MyPlaylist e da lì clicchiamo su New Playlist G u i d a c r e a t a d a m a r t e p e r h t t p : / / j i m d i n g 3. j i m d o. c o m Pagina 1

2 3) Scegliamo la grafica per il nostro lettore e selezioniamo i brani da riprodurre con Create a Playlist 4) Ora clicchiamo su Save Playlist e compiliamo il formulario e premiamo Save and get code G u i d a c r e a t a d a m a r t e p e r h t t p : / / j i m d i n g 3. j i m d o. c o m Pagina 2

3 5) Copiamo il codice embed code fornito nella categoria Other sites 6) Andiamo nel nostro sito, creiamo un nuovo modulo Widget/HTML ed incolliamoci il codice G u i d a c r e a t a d a m a r t e p e r h t t p : / / j i m d i n g 3. j i m d o. c o m Pagina 3

4 7) Una volta cliccato su Salvare avremo il nostro player nel sito Il problema di questo metodo è che la playlist viene salvata nella pagina a cui la applicate. Anche se la aggiungete alla sidebar (sotto la pubblicità di Jimdo) durante la navigazione cambiando sezione la musica verrà interrotta e inizierà da capo. La soluzione al problema è stata fornita nel forum di Jimdo da Symone Trimarchi ( e consiste nella creazione di una finestra di PopUp che viene aperta e consente la riproduzione anche mentre si cambioa pagina, il problema a cui si va incontro è che alcuni browser possono impedire l apertura dei PopUp. Il metodo comunque è questo: 1) Creiamo un nuovo modulo Widget/HTML e posizioniamolo nel nostro sito web. L ideale è metterlo nella sidebar, in questo modo infatti i visitatori potranno accedervi anche in pagine diverse G u i d a c r e a t a d a m a r t e p e r h t t p : / / j i m d i n g 3. j i m d o. c o m Pagina 4

5 2) Incolliamo questo codice nella casella dell HTML <script language="javascript" type="text/javascript"> //<![CDATA[ function expandingwindow(website) { var windowprops='width=80%,height=80%,scrollbars=yes,toolbar=no,status=no,location=no,menubar=no,fullscreen=no,resizable=yes' var heightspeed = 80; // vertical scrolling speed (higher = slower) var widthspeed = 60; // horizontal scrolling speed (higher = slower) var leftdist = 860; // distance to left edge of window var topdist = 500; // distance to top edge of window if (window.resizeto&&navigator.useragent.indexof("opera")==-1) { var winwidth = window.screen.availwidth - leftdist; var winheight = window.screen.availheight - topdist; var sizer = window.open("","","left=" + leftdist + ",top=" + topdist +","+ windowprops); for (sizeheight = 1; sizeheight < winheight; sizeheight += heightspeed) sizer.resizeto("0", sizeheight); for (sizewidth = 0; sizewidth < winwidth; sizewidth += widthspeed) sizer.resizeto(sizewidth, sizeheight); sizer.location = website; } else window.open(website,'mywindow'); } // End --> //]]> </script><!-- Step 2: Then, set up your corresponding links using the below HTML codes as examples: --> <!-- set up your links, either via text links or form buttons--> <form> <p align="center"><input type="button" value="testo del pulsante" onclick="expandingwindow('indirizzo playlist')" /></p> </form> <!-- END OF SCRIPT --> G u i d a c r e a t a d a m a r t e p e r h t t p : / / j i m d i n g 3. j i m d o. c o m Pagina 5

6 3) All interno del codice andiamo a modificare i campi Frase da far apparire nel pulsante con la frase che volete far visualizzare nel pulsante che aprirà la finestra di PopUp e Indirizzo tua playlist con l indirizzo diretto della playlist che potete vedere nell immagine da dove viene prelevato. Attenzione a non eliminare gli apostrofi che delimitano nel codice del lettore l indirizzo della playlist 4) Premendo Salvare possiamo vedere il risultato. Per testarlo andiamo in modalità Anteprima G u i d a c r e a t a d a m a r t e p e r h t t p : / / j i m d i n g 3. j i m d o. c o m Pagina 6

7 In questo modo il lettore sarà attivabile in ogni pagina e solo da chi vuole ascoltare la musica. Analizziamo ora altri due metodi per inserire la musica, anche in questo caso i lettori vengono interrotti durante la navigazione, ma sono l ideale per chi vuole caricare dei suoi brani senza farli scaricare da altri utenti, utile ad esempio per musicisti, DJ, ecc... Il primo player è il diffuso Yahoo Player, non necessita di alcun tipo di registrazione o costo, però dobbiamo affidarci ad un sito di file-hosting, personalmente vi consiglio che è in francese però offre spazio gratuito dopo una iscrizione, sarà proprio questo che userò per la guida 1) Colleghiamoci a e creiamo un account gratuito attraverso la voce Iscription 2) Una volta iscritti colleghiamoci al pannello di controllo attraverso Connexion au Panel G u i d a c r e a t a d a m a r t e p e r h t t p : / / j i m d i n g 3. j i m d o. c o m Pagina 7

8 3) Grazie a questo archivio possiamo caricare on-line qualsiasi tipo di file. Nel caso specifico ci interessa la musica, clicchiamo quindi su Mes Musiques e attendiamo il caricamento della nuova pagina 4) Per caricare il file desiderato selezioniamo Ajouter des fichies G u i d a c r e a t a d a m a r t e p e r h t t p : / / j i m d i n g 3. j i m d o. c o m Pagina 8

9 5) Nella finestra successiva ci viene chiesto di selezionare un metodo di caricamento, clicchiamo su Version de base 6) La pagina verrà modificata, selezioniamo il file da caricare e clicchiamo sul pulsante Ajouter G u i d a c r e a t a d a m a r t e p e r h t t p : / / j i m d i n g 3. j i m d o. c o m Pagina 9

10 7) Una volta terminato clicchiamo su Mes Musiques 8) Clicchiamo sul file desiderato e si aprirà una pagina piena di codici, per il momento lasciamola aperta in una scheda ed andiamo nel nostro sito web G u i d a c r e a t a d a m a r t e p e r h t t p : / / j i m d i n g 3. j i m d o. c o m Pagina 10

11 9) Creiamo un nuovo modulo Widget/HTML ed inseriamoci questo codice <script type="text/javascript" src=" /><a href="indirizzo tua canzone">titolo della canzone 10) Andiamo nella scheda con i codici del file e selezioniamo il link chiamato Principal 11) Incolliamo il link al posto della voce Indirizzo tua canzone e al posto della voce Titolo della canzone inseriamo il nome del brano G u i d a c r e a t a d a m a r t e p e r h t t p : / / j i m d i n g 3. j i m d o. c o m Pagina 11

12 12) Fatto questo una volta premuto Salvare andiamo in modalità Anteprima per visualizzare il risultato Con questo metodo la canzone viene riprodotta solamente quando ci si clicca. Passiamo ora a vedere una versione complementare, i primi passaggi sono identici ai precedenti perchè consistono nel caricare il file all interno di ArchiveHost, quindi passo subito alla parte del codice 1) Andiamo ad inserire in un modulo widget/html questo codice <embed wmode="transparent" src="indirizzo tua canzone" width="140" height="40" autostart="true" loop="false" /> G u i d a c r e a t a d a m a r t e p e r h t t p : / / j i m d i n g 3. j i m d o. c o m Pagina 12

13 2) Al posto di Indirizzo della canzone inseriamo l indirizzo fornito da ArchiveHost e premiamo su Salvare Con questa soluzione possiamo inserire il player e modificarne le dimensioni attraverso i campi Width ed Height, inoltre possiamo impostare l avvio automatico attraverso la voce Autostart impostando autostart=on e la funzione di loop impostando loop=on Questi sono alcuni dei metodi più utilizzati per riprodurre musica nel proprio sito web, ovviamente volendo potete anche combinare le soluzioni, infatti il codice fornito da Symone Trimarchi funziona con qualsiasi sito web G u i d a c r e a t a d a m a r t e p e r h t t p : / / j i m d i n g 3. j i m d o. c o m Pagina 13