İhtiyacımız olan şeyler arasında ilk olarak photoshop yada benzeri bir grafik işleme programına gereksinim duyuyoruz. Konuyu anlatırken örneklendirmenin şart olduğunu düşündüğümden, ihtiyacımız olan öğeleri kendi belirlediğim boyutlara göre hazırlayacağım. Videomuzun eni 425px, boyu ise 366px olacak. aşağıdaki kod örnek bir youtube embed kodu.(Benim istediğim ölçülerde)
Uyarı : Kodun içerisindeki soru işaretleri ise eklemek istediğimiz görüntünün "id" si. Siz bu işlemi yaptığınızda "?" işaretlerini değiştirmeyi unutmayın.
<object height="366" width="425"><param name="movie" value="http://www.youtube.com/v/??????"><param name="wmode" value="transparent"><embed src="http://www.youtube.com/v/??????" type="application/x-shockwave-flash" wmode="transparent" height="366" width="425"></object>
Az önce photoshop yada benzeri bir programa ihtiyaç duyduğumuzu söylemiştim. Bu programda görüntümüzle aynı genişliğe sahip fakat yaklaşık 50px daha kısa olan ve arkaplanı saydam bir grafik hazırlıyoruz, sağ alt köşesine bizim belirlediğimiz ve youtube logosunu kapatacak ölçülerde kendi logomuzu ekleyerek back.gif ismi ile grafiğimizi kayıt ediyoruz.
Grafiğimizi hazırladıktan sonra yapmamız gereken işlem tamamı ile yazılımsal. Aşağıya uygulanmış bir kodu veriyorum. Zaten örneği yukarıda görüyorsunuz.
<div align="left" style="height: 366px; width: 425px;">
<div style="position: absolute;"><object height="366" width="425"><param name="movie" value="http://www.youtube.com/v/??????"><param name="wmode" value="transparent"><embed src="http://www.youtube.com/v/??????" type="application/x-shockwave-flash" wmode="transparent" height="366" width="425"></object></div>
<div align="left" style="position: relative;"><img width="425" height="316" border="0" src="back.gif" alt="back" /></div>
</div>
anlız burada belirtmem gereken önemli bir husus var. Eğer kodları bu şekilde yerleştirirseniz sitenizin tasarımında sıkıntı yaratabilir. Eğer bu kodu bir table içine yerleştiriyorsanız <td> tagının içinde şu kodu eklemeniz faydalı olacaktır.
style="height:366px;vertical-align:top;"
Yani <td style="height:366px;vertical-align:top;"> şeklinde olmalı. Yada <div> tagının içinde kullanmışsanız o zamanda son kodumuz
<div style="height:366px;vertical-align:top;"> şeklinde olmalı. Style parametresi içinde belirttiğimiz height parametresi sitemizin tasarımını değiştirmeyecek olan ideal değer. Buradaki ölçüyüde kendi embed kodunuzun içindeki height parametresine uyarlamayı unutmamalısınız.
Alıntıdır..