Untuk
dapat menampilkan video YouTube ke dalam situs atau blog, anda harus
mengetahui ID dari video yang bersangkutan. Bagaimana cara mendapatkan
ID ini? Pertama, datang ke situs YouTube yang alamatnya di
http://www.youtube.com. Selanjutnya cari atau pilih video yang anda
sukai. Letakkan pointer mouse di atas gambar video tersebut, lalu klik
kanan. Kemudian pilih menu Salin Lokasi Tautan. Saya contohkan di sini,
saya ingin mengambil ID dari video Udin Sedunia. Lihat ilustrasi di
bawah ini.
Buka Notepad. Paste-kan lokasi tautan yang anda salin tadi ke dalam Notepad. Dalam contoh ini, di Notepad saya tertera:http://www.youtube.com/watch?v=rZ6rbbCOgNQ
Itu adalah link atau lokasi tautan dari video Udin Sedunia. Lantas di manakah ID-nya? Perhatikan link di atas. ID dari video tersebut adalah tulisan yang berada di sebelah kanan tanda sama dengan (=). Jadi, ID dari video Udin Sedunia adalah:
rZ6rbbCOgNQ
Catat baik-baik ID ini, karena inilah yang kita perlukan untuk dapat menampilkan video tersebut di situs atau blog kita.
Selanjutnya untuk meng-embed video tersebut ada beberapa alternatif kode HTML-nya.
Alternatif 1
Alternatif pertama adalah dengan menggunakan iframe. Cara penulisannya adalah sebagai berikut:
<iframe width="320" height="240" src="http://www.youtube.com/embed/..." frameborder="0" allowfullscreen></iframe>
Ganti ... dengan ID dari video yang ingin anda tampilkan. Dalam contoh Udin Sedunia tadi, penulisan lengkapnya seperti di bawah ini:
<iframe width="320" height="240" src="http://www.youtube.com/embed/rZ6rbbCOgNQ" frameborder="0" allowfullscreen></iframe>
Untuk nilai dari width dan height bisa anda ubah agar sesuai dengan kebutuhan anda masing-masing.
Alternatif 2
Alternatif kedua adalah dengan mempergunakan tag object. Cara menuliskannya seperti ini:
<object width="320" height="240"><param name="movie" value="http://www.youtube.com/v/...&hl=en&fs=1&border=1"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/...&hl=en&fs=1&border=1" allowscriptaccess="always" allowfullscreen="true" width="320" height="240"></embed></object>
Anda juga harus mengganti ... dengan ID dari video yang telah anda catat sebelumnya. Perhatikan, di sini ada dua ... yang harus anda isi. Demikian juga jika anda ingin mengganti nilai width dan height, masing-masing ada dua width dan dua height yang harus anda ubah.
Alternatif 3
Alternatif ketiga juga menggunakan tag object. Hanya saja hasil tampilannya agak berbeda. Sintaknya sebagai berikut:
<object width="320" height="240"><param name="movie" value="http://www.youtube.com/v/...&feature=player_embedded&version=3"></param><param name="allowFullScreen" value="true"></param><param name="allowScriptAccess" value="always"></param><embed src="http://www.youtube.com/v/...&feature=player_embedded&version=3" allowfullscreen="true" allowScriptAccess="always" width="320" height="240"></embed></object>
0 comments:
Post a Comment