Vor einer gewissen Zeit hat YouTube eine Änderung vorgenommen, sodass das Einbinden von Musikvideos per iframe nicht mehr möglich ist. Die Einbindung von Musik per iframe auf die Knuddels-Homepage war die meistgewählte Variante der Nutzer, die ihre Homepage mit Musik versehen wollten. Der folgende Generator sowie die Anleitung machen es wieder möglich, Musik auf die Homepage einzubinden.

Der folgende Generator generiert den HTML-Code automatisch, sofern man eine URL angegeben hat.

Hinweis:
  1. Die URL muss das Format http://www.youtube.com/watch?v=32Jk-JcVeRg haben.


Generator entfernt, da nicht mehr funkionstüchtig.



Sollte der Generator nicht funktionieren, so bitte einen Moderator informieren. Für diesen Fall findet ihr im Anschluss eine Anleitung, mit der man selbst das YouTube-Video bearbeiten kann und eine Einbindung der Musik auf die Homepage möglich ist.

Schritt für Schritt zur Musik auf der eigenen Homepage

Warnung! Spoiler! (Achtung, langer Text.)
Schritt 1:
Bei der Wahl der Musik hat der Nutzer freie Wahl. Es empfiehlt sich natürlich, Musik ohne Hintergrundgeräusche zu nehmen, da jegliche Nebengeräusche einen unschönen Effekt haben. Wichtig ist, dass das Musikvideo von YouTube kommt. Sollte das nicht der Fall sein, so funktioniert der nachfolgende Code nicht.

Sobald das Wunschvideo mit der passenden Musik gefunden ist, findet man unter dem Video die Funktion "Teilen".

[img]http://dl.dropbox.com/u/48456211/forum_kn/hufzkhp/s1_hg_m.png[/img]



Schritt 2:
Nach dem Klick auf "Teilen" sollte ein weiteres Menü aufklappen, in dem neben anderen Funktionen die Funktion "Einbetten" zu finden ist.

[img]http://dl.dropbox.com/u/48456211/forum_kn/hufzkhp/s2_hg_m.png[/img]

Dort muss raufgeklickt werden, um zum nächsten Schritt zu gelangen.



Schritt 3:
Nachdem auf "Einbetten" geklickt wurde, erweitert sich Menü erneut. Dort sind die auf dem folgenden Screen zu sehenden Einstellungen wichtig. Es ist wichtig, dass genau diese Optionen angeklickt sind, da der Code sonst nicht funktioniert.

[img]http://dl.dropbox.com/u/48456211/forum_kn/hufzkhp/s3_hg_m.png[/img]

Wurde alles so befolgt, kann der Code aus der Box rauskopiert werden und mit Schritt 4 weitergemacht werden.



Schritt 4:
Im 4. Schritt der Anleitung wird der Code so geändert, dass die Musik automatisch abgespielt wird.

HTML-Code:
<object width="560" height="340"><param name="movie" value="http://www.youtube-nocookie.com/v/32Jk-JcVeRg?fs=1&hl=de_DE&rel=0"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube-nocookie.com/v/32Jk-JcVeRg?fs=1&hl=de_DE&rel=0" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="560" height="340"></embed></object>

Leider kann man den Code nicht einfach so benutzen, wie er dort steht. Um es einem etwas leichter zu machen, verkürzt man den Code zuerst, indem man die oben im Code rot markierten Stellen sucht und rauslöscht. Wir haben dann folgenden Code:

HTML-Code:
<object width="560" height="340"><param name="movie" value="http://www.youtube-nocookie.com/v/32Jk-JcVeRg?fs=1&hl=de_DE&rel=0"></param><embed src="http://www.youtube-nocookie.com/v/32Jk-JcVeRg?fs=1&hl=de_DE&rel=0" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="560" height="340"></embed></object>

Zur besseren Übersicht sind in diesem Code nun die Links blau markiert. Sie stehen nach dem Code-Attribut src in Anführunszeichen und beginnen, sofern ihr die richtigen Einstellungen vorgenommen habt (siehe 2. auf dem Screen) mit http:// und hören mit &rel=0 auf. Ihr fügt dann direkt nach den beiden Links vor dem Anführungszeichen jeweils ein &autoplay=1 ein. Der Code sieht nun so aus:

HTML-Code:
<object width="560" height="340"><param name="movie" value="http://www.youtube-nocookie.com/v/32Jk-JcVeRg?fs=1&hl=de_DE&rel=0&autoplay=1"></param><embed src="http://www.youtube-nocookie.com/v/32Jk-JcVeRg?fs=1&hl=de_DE&rel=0&autoplay=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="560" height="340"></embed></object>

Wer diesen Code probeweise auf seiner HP einfügt stellt fest, dass er das gesuchte Video einbindet und beim Starten der Homepage automatisch abspielt. Da wir aber nur die Musik hören wollen, verstecken wir das Video, indem wir es in einen 1x1 Pixel großen Kasten packen und den nach links aus dem Bildschirm schieben. Ihr fügt also die orange gefärbten Codepassagen jeweils vor und nach dem obigen Code ein:

HTML-Code:
<div style="width:1px;height:1px;margin-left:-999999em;overflow:hidden;"><object width="560" height="340"><param name="movie" value="http://www.youtube-nocookie.com/v/32Jk-JcVeRg?fs=1&hl=de_DE&rel=0&autoplay=1"></param><embed src="http://www.youtube-nocookie.com/v/32Jk-JcVeRg?fs=1&hl=de_DE&rel=0&autoplay=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="560" height="340"></embed></object></div>

Den fertigen Code könnt ihr dann in eines der großen Textfelder auf eurer HP einfügen. Ihr solltet dann kurz nach dem Laden der HP die Musik beginnen hören. Diese Technik sollte momentan einwandfrei in den aktuellen Versionen von den Browsern Opera, Google Chrome, Firefox, Internet Explorer und Safari funktionieren.


Bearbeitet von fresh-squeezed (03.12.2012, 21:15:26)