การฝังวิดีโอจาก YouTube ลงในหน้าเว็บเป็นเรื่องง่ายมาก โดยใช้การฝัง (embed) วิดีโอเข้าไปในโค้ด HTML
ขั้นตอนการดึง Video ID
ขั้นตอนที่ 1: ไปที่หน้าวิดีโอ YouTube ที่ต้องการ คลิกขวาที่วิดีโอ และเลือก "Stats for nerds" (สถิติสำหรับนักวิชาการ)
จะปรากฏกล่องโต้ตอบแสดงข้อมูลสถิติของวิดีโอ ซึ่งจะเห็น Video ID อยู่ในส่วนของ "Video ID" (ตัวอย่าง: F6m0ghjadlw)
การฝังวิดีโอด้วยแท็ก <iframe>
วิธีที่แนะนำและใช้กันอย่างแพร่หลายคือการใช้แท็ก <iframe> ดังตัวอย่างต่อไปนี้:
<!DOCTYPE html>
<html>
<head>
<title>ฝังวิดีโอ YouTube</title>
</head>
<body>
<h1>ตัวอย่างการฝังวิดีโอ</h1>
<p>วิดีโอสาธิตการติดตั้ง WordPress บน Localhost ด้วย XAMPP:</p>
<iframe height="350" width="600" src="https://www.youtube.com/embed/F6m0ghjadlw"></iframe>
</body>
</html>
การฝังวิดีโอด้วยแท็ก <embed>
อีกวิธีหนึ่งคือใช้แท็ก <embed> ซึ่งให้ผลลัพธ์คล้ายกัน:
<!DOCTYPE html>
<html>
<head>
<title>ฝังวิดีโอ YouTube ด้วย embed</title>
</head>
<body>
<h1>ตัวอย่างการฝังวิดีโอ</h1>
<p>วิดีโอสาธิต (ใช้แท็ก embed):</p>
<embed height="350" width="600" src="https://www.youtube.com/embed/F6m0ghjadlw">
</body>
</html>
คำแนะนำเพิ่มเติม
- ใช้
<iframe>แทน<embed>เพราะรองรับฟีเจอร์มากกว่า เช่น allowfullscreen - สามารถปรับขนาด width และ height ได้ตามต้องการ
- เพิ่มพารามิเตอร์ใน URL ได้ เช่น
?autoplay=1&mute=1สำหรับเล่นอัตโนมัติ
