gnusmaS.de

Youtube Videos validiert einbetten

Vll. hattet ihr auch schon mal das Problem:
Ihr habt eure Seite komplett bereinigt, das beim validieren keine Fehler mehr vorhanden sind. Aber sobald ihr ein Video von Youtube einbettet, war alles umsonst und es treten mehrere Fehler auf.
Ich beschreibe hier wie man ein Video einbettet, ohne diese Fehler zu erzeugen…

Der Standard Einbettungscode von Youtube sieht so aus:

<object width="425" height="344">
<param name="movie" value="http://www.youtube.com/v/pWEjJfjNu44&color1=0xb1b1b1&color2=0xcfcfcf&feature=player_embedded&fs=1"></param>
<param name="allowFullScreen" value="true"></param>
<embed src="http://www.youtube.com/v/pWEjJfjNu44&color1=0xb1b1b1&color2=0xcfcfcf&feature=player_embedded&fs=1" type="application/x-shockwave-flash" allowfullscreen="true" width="425" height="344"></embed>
</object>

Weil es laut validierung nicht erlaubt ist, bei einem object-tag die attribute width und height zu benutzen muss man sich was anderes einfallen lassen. Man könnte z.b. ganz einfach die ganzen extra Attribute, die Fehler erzeugen einfach weg lassen…

<object type="application/x-shockwave-flash" data="http://www.youtube.com/v/pWEjJfjNu44&color1=0xb1b1b1&color2=0xcfcfcf&feature=player_embedded&fs=1">
<param name="movie" value="http://www.youtube.com/v/pWEjJfjNu44&color1=0xb1b1b1&color2=0xcfcfcf&feature=player_embedded&fs=1" />
</object>

Das Problem an der ganzen Geschichte ist es halt so nun die Grösse einzustellen. Das alles kann man aber ganz einfach machen. Man erstellt einfach in der CSS-Datei des Themes eine neue Klasse.

object.tubevideo {
	width: 100%;
	height:100%;
}

Natürlich kann man die Höhe und Breite auch in Pixel angeben.
Um die Klasse nun auch zu nutzen, müssen wir ins Objekt-tag ein Class-Attribut einfügen.

<object class="tubevideo" type="application/x-shockwave-flash" data="http://www.youtube.com/v/pWEjJfjNu44&color1=0xb1b1b1&color2=0xcfcfcf&feature=player_embedded&fs=1">
<param name="movie" value="http://www.youtube.com/v/pWEjJfjNu44&color1=0xb1b1b1&color2=0xcfcfcf&feature=player_embedded&fs=1" />
</object>

Die URL des Youtube Videos muss man natürlich immer für das jeweilige Video eingeben.
Wenn man nun seine Seite wieder validiert, dürften wir durch Youtube Videos keine Fehler mehr erhalten.

Ähnliche Artikel:

1. Links HTML-valide aufbauen