Come inserire un video di youtube sul tuo sito
Scritto il November 11th, 2009 in Risorse. 3 Commenti
Anche quando l’incorporamento è disattivato su richiesta dell’utente. Ingredienti: Jquery, Jquery Superbox. Requisiti: un editor di testo e 2 minuti di tempo.
1) Scarica Jquery Superbox e modifica una cosetta
- Scarica Jquery Superbox, formato zip 21k circa
- Scompatta in una cartella
- Apri il file jquery.superbox-min.js e con un editor di testo cerca la parola “scrolling“
- Cambia scrolling=”auto” in scrolling=”no”
- Salva
2) Installa Jquery e il Plugin Jquery superbox sula tua pagina
E’ sufficiente collegare i file nella sezione <head> del tuo sito ed aggiungere un piccolo snippet Js in questa maniera
<!-- link alla libreria jquery. puoi scaricarla da jquery.com e linkare da locale, se vuoi !-->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<!-- link al file che ti ho detto di modificare !-->
<script type="text/javascript" src="http://paulmoll.com/wp-content/themes/starkers/style/js/jquery.superbox-min.js"></script>
<!-- snippet javascript in cui puoi personalizzare jquery superbox !-->
<script type="text/javascript">
$(function(){
$.superbox.settings = {
closeTxt: "Close",
loadTxt: "Loading...",
nextTxt: "Next",
prevTxt: "Previous"
};
$.superbox();
});
</script>
<!-- css di superbox, puoi modificarlo ed adattarlo alle tue esigenze !-->
<link rel="stylesheet" type="text/css" href="http://paulmoll.com/wp-content/themes/starkers/style/css/jquery.superbox.css" />
3) Prendi un video di youtube non embeddabile
- Ad esempio: http://www.youtube.com/watch?v=pqU9Mu3JSm8
- Trasformalo in
http://www.youtube.com/watch?v=pqU9Mu3JSm8#watch-player-div
4) Crea il tuo link
- L’attributo rel è fondamentale, non toccarlo
<a href="http://www.youtube.com/watch?v=pqU9Mu3JSm8#watch-player-div" rel="superbox[iframe][640x390]">Test</a>
Incorporamento disattivato su richiesta dell’utente. Come no!
Care Major, vi abbiamo fregato!
Domande e risposte
- Cos’è Jquery?
- Cos’è Jquery Superbox?
- Perchè mi hai fatto editare il file jquery.superbox-min.js?
Perchè così facendo elimini le barre di scorrimento dell’iframe generato da Superbox quando viene cliccato il link. Non è affatto elegante, ma avevamo due minuti di tempo.
In realtà si potrebbe modificare ulteriormente il js di superbox e rendere dinamica la funzione di scrolling.
Se proprio vuoi, fallo tu
. - Perchè mi hai fatto mettere #watch-player-div in fondo al link di Youtube?
Perchè è il punto esatto in cui inizia un video, in tutte le pagine di youtube. - Cosa significa superbox[iframe][640x390]?
Stiamo dicendo a superbox di aprire un iframe largo 640px e alto 390px. Il contenuto di quell’iframe è il valore dell’href del link. - Quindi è un trucco! Tu fai vedere un pezzo della pagina di youtube, giusto?
Got it
.