Forgot Password ??

PHP , ASP , ASP.NET, VB.NET, C#, Java , jQuery , Android , iOS , Windows Phone

	Registered : 109,037

HOME > บทความจากสมาชิก > วิธีแทรก Youtube Videos ลงหน้าเว็บ HTML และ การใช้ BBCode เพื่อรับและแสดงผลหน้าเว็บ

วิธีแทรก Youtube Videos ลงหน้าเว็บ HTML และ การใช้ BBCode เพื่อรับและแสดงผลหน้าเว็บ

วิธีเอา Youtube Videos ลงหน้า HTML และ การใช้ BBCode เพื่อรับและแสดงผลหน้าเว็บ แม้ว่าบทความจะเป็นแค่พื้นฐานที่เราคุ้นเคยและอาจจะใช้กันเป็นอยู่แล้ว แต่เชื่อเลยว่าหลายๆ คนยังเอา Youtube Videos มาแปะลงในหน้าเว็บของตัวเองยังไม่เป็น หรือ ลงไม่ถูกวิธี และเราจะมาอัพเดดวิธีการเอาคลิป Youtube Videos มาแสดงในหน้าเว็บให้ถูกต้อง เนื่องจากยังเห็นหลายๆ เว็บยังใช้วิธีเก่าๆ ที่ถูกยกเลิกไปแล้ว ทำให้ไม่สามารถเล่นคลิปได้ รวมทั้งวิธีการสร้าง BBCode เพื่อรับค่า URL ของคลิป และ PHP อ่านค่า URL ใช้การแสดงผลเวลาเล่น

HTML YouTube Videos

เนื่องจากสมัยแรกๆ มีการใช้ <object> และ <embed> แต่ปัจจุบันได้มีการยกเลิก (deprecated) ไปแล้ว และอาจจะมีปัญหาในการเล่น หรือใช้พวก Control เช่น Full Screen ไม่ได้

ในปัจจุบัน ถ้าจะใช้ให้ถูกต้องจะต้องใช้เป็น iframe เข้ามาเล่นคลิปของ Youtube Videos

เช่นปกติเมื่อเราเปิด Youtube จะได้ URL นี้

HTML YouTube Videos

URL

https://www.youtube.com/watch?v=RgKAFK5djSk

ID ของคลิปที่เราจะใช้คือ RgKAFK5djSk

Ex 1 : วิธีการแรกคลิปง่ายๆ ด้วย iframe

<iframe width="500" height="500"
src="https://www.youtube.com/embed/RgKAFK5djSk">
</iframe>

Ex 2 : การให้คลิปเล่นอัตโนมัติหรือ Autoplay โดยกำหนดค่า autoplay=1

<iframe width="500" height="500"
src="https://www.youtube.com/embed/RgKAFK5djSk?autoplay=1">
</iframe>

Ex 3 : การให้คลิปเล่นแบบ Loop ให้เพื่ม playlist=RgKAFK5djSk&loop=1

<iframe width="500" height="500"
src="https://www.youtube.com/embed/RgKAFK5djSk?playlist=RgKAFK5djSk&autoplay=1&loop=1">
</iframe>

Ex 4 : การกำหนดเมนู Control ให้เพิ่ม?controls=0/1 (0=ปิด, 1=เปิด)

<iframe width="500" height="500"
src="https://www.youtube.com/embed/RgKAFK5djSk?controls=0">
</iframe>

การใช้ BBCode กับ PHP

ตัวอย่าง BBCode

[clip]https://www.youtube.com/embed/RgKAFK5djSk[/clip]

เวลาใช้กับ PHP

<?php
	$text = "[clip]https://www.youtube.com/embed/RgKAFK5djSk[/clip]";
	echo preg_replace("/\[clip\](.+?)\[\/clip\]/is",'<iframe width="500" height="500" src="\1"></iframe>', $text);
?>

แปลงได้เป็น

<iframe width="500" height="500" src="https://www.youtube.com/embed/RgKAFK5djSk"></iframe>

สุดท้ายฝากฟังเพลง See you again ด้วยครับ เพราะจริงๆ


	By :	TC Admin
	Article :	บทความเป็นการเขียนโดยสมาชิก หากมีปัญหาเรื่องลิขสิทธิ์ กรุณาแจ้งให้ทาง webmaster ทราบด้วยครับ
	Score Rating :
	Create Date :	2017-02-25
	Download :	No files

Sponsored Links

สอน Windows Phone การเขียนโปรแกรม Windows Phone 7 และ 8

สอน Java GUI การเขียนโปรแกรม ภาษา Java GUI

Free Tutorial

	สอน Google Maps Api
	สอน Windows Service
	สอน Entity Framework
	สอน Android
	สอน Java เขียน Java
	Java GUI Swing
	สอน JSP (Web App)
	iOS (iPhone,iPad)
	Windows Phone
	Windows Azure
	Windows Store
	Laravel Framework
	Yii PHP Framework
	สอน jQuery
	สอน jQuery กับ Ajax
	สอน PHP OOP (Vdo)
	Ajax Tutorials
	SQL Tutorials
	สอน SQL (Part 2)
	JavaScript Tutorial
	Javascript Tips
	VBScript Tutorial
	VBScript Validation
	Microsoft Access
	MySQL Tutorials
	-- Stored Procedure
	MariaDB Database
	SQL Server Tutorial
	SQL Server 2005
	SQL Server 2008
	SQL Server 2012
	-- Stored Procedure
	Oracle Database
	-- Stored Procedure
	SVN (Subversion)
	แนวทางการทำ SEO
	ปรับแต่งเว็บให้โหลดเร็ว