HTML วิดีโอ YouTube
วิธีที่ง่ายที่สุดในการเล่นวิดีโอใน HTML คือการใช้ YouTube
ดิ้นรนกับรูปแบบวิดีโอ?
การแปลงวิดีโอเป็นรูปแบบต่างๆ อาจเป็นเรื่องยากและใช้เวลานาน
ทางออกที่ง่ายกว่าคือให้ YouTube เล่นวิดีโอในหน้าเว็บของคุณ
รหัสวิดีโอ YouTube
YouTube จะแสดงรหัส (เช่น tgbNymZ7vqY) เมื่อคุณบันทึก (หรือเล่น) วิดีโอ
คุณสามารถใช้รหัสนี้และอ้างอิงถึงวิดีโอของคุณในโค้ด HTML
การเล่นวิดีโอ YouTube ใน HTML
ในการเล่นวิดีโอของคุณบนเว็บเพจ ให้ทำดังต่อไปนี้:
- อัปโหลดวิดีโอไปยัง YouTube
- จดบันทึกรหัสวิดีโอ
- กำหนด
<iframe>
องค์ประกอบในหน้าเว็บของคุณ - ให้
src
แอตทริบิวต์ชี้ไปที่ URL ของวิดีโอ - ใช้ แอตทริบิวต์
width
และheight
เพื่อระบุขนาดของเครื่องเล่น - เพิ่มพารามิเตอร์อื่น ๆ ให้กับ URL (ดูด้านล่าง)
ตัวอย่าง
<iframe width="420" height="315"
src="https://www.youtube.com/embed/tgbNymZ7vqY">
</iframe>
เล่นอัตโนมัติของ YouTube + ปิดเสียง
คุณสามารถให้วิดีโอของคุณเริ่มเล่นโดยอัตโนมัติเมื่อผู้ใช้เข้าชมหน้า โดยเพิ่มautoplay=1
ไปยัง URL ของ YouTube อย่างไรก็ตาม การเริ่มวิดีโอโดยอัตโนมัตินั้นน่ารำคาญสำหรับผู้เยี่ยมชมของคุณ!
หมายเหตุ:เบราว์เซอร์ Chromium ไม่อนุญาตให้เล่นอัตโนมัติในกรณีส่วนใหญ่ อย่างไรก็ตาม อนุญาตให้เล่นอัตโนมัติแบบปิดเสียงเสมอ
เพิ่มmute=1
หลัง
autoplay=1
เพื่อให้วิดีโอของคุณเริ่มเล่นโดยอัตโนมัติ (แต่ปิดเสียงไว้)
YouTube - เล่นอัตโนมัติ + ปิดเสียง
<iframe width="420" height="315"
src="https://www.youtube.com/embed/tgbNymZ7vqY?autoplay=1&mute=1">
</iframe>
เพลย์ลิสต์ YouTube
รายการที่คั่นด้วยเครื่องหมายจุลภาคของวิดีโอที่จะเล่น (นอกเหนือจาก URL ดั้งเดิม)
YouTube Loop
เพิ่มloop=1
เพื่อให้วิดีโอของคุณวนซ้ำตลอดไป
ค่า 0 (ค่าเริ่มต้น): วิดีโอจะเล่นเพียงครั้งเดียว
ค่าที่ 1: วิดีโอจะวนซ้ำ (ตลอดไป)
YouTube - Loop
<iframe width="420" height="315"
src="https://www.youtube.com/embed/tgbNymZ7vqY?playlist=tgbNymZ7vqY&loop=1">
</iframe>
การควบคุมของ YouTube
เพิ่มcontrols=0
เพื่อไม่ให้แสดงการควบคุมในเครื่องเล่นวิดีโอ
ค่า 0: ตัวควบคุมผู้เล่นไม่แสดงขึ้น
ค่า 1 (ค่าเริ่มต้น): การแสดงส่วนควบคุมของผู้เล่น
YouTube - การควบคุม
<iframe width="420" height="315"
src="https://www.youtube.com/embed/tgbNymZ7vqY?controls=0">
</iframe>