فیلم های یوتیوب در HTML

ساده ترین راه برای پخش ویدیوها در HTML، استفاده از YouTube است.

تقابل با فرمت های ویدیویی

پیش از این در این آموزش دیده ام که شما ممکن است مجبور شوید ویدیوهای خود را به فرمت های مختلف تبدیل کنید تا آنها را در تمام مرورگرها پخش کنید.

تبدیل فیلم ها به فرمت های مختلف می تواند دشوار و وقت گیر باشد.

یک راه حل ساده تر این است که YouTube بتواند فیلم ها را در صفحه وب شما پخش کند.

شناسه ویدیوی YouTube

هنگامی که یک ویدیو را ذخیره کنید (یا پخش کنید)، یوتیوب یک شناسه (مانند XGSy3_Czz8k) را نشان می دهد.

شما می توانید از این شناسه استفاده کنید و در کد HTML به ویدیوی خود مراجعه کنید.

پخش ویدئو یوتیوب در HTML

برای پخش ویدئو خود در یک صفحه وب، موارد زیر را انجام دهید:

• ویدیو را به YouTube آپلود کنید

• به شناسه ویدیو توجه داشته باشید

• عنصر <iframe> را در صفحه وب خود تعریف کنید

• اجازه دهید attribute src به URL ویدیو بپردازد

• برای مشخص کردن ابعاد پخش,از ویژگی های عرض و ارتفاع استفاده کنید

• پارامتر دیگر را به URL اضافه کنید (زیر را ببینید)

پخش خودکار یوتیوب

شما می توانید ویدیوی خود را به طور خودکار شروع کنید زمانی که یک کاربر به بازدید از این صفحه با اضافه کردن یک پارامتر ساده به آدرس YouTube شما دسترسی پیدا کند.

نکته: هنگام تصمیم گیری برای پخش خودکار فیلم ها، مراقب باشید. به طور خودکار شروع یک ویدیو می تواند بازدید کننده خود را آزار دهد و در نهایت باعث آسیب بیشتر ازمعمول است.

مقدار 0 (به طور پیش فرض): هنگامی که پخش بارگذاری می شود، فیلم به طور خودکار پخش نخواهد شد.

مقدار 1: هنگامی که پخش بارگذاری می شود، ویدئو بطور خودکار پخش خواهد شد.

پخش خودکار
 <iframe width="420" height="315"
src="https://www.youtube.com/embed/tgbNymZ7vqY?autoplay=1">
</iframe> 
مشاهده مثال

لیست پخش یوتیوب

لیست کاملی از ویدیوهایی که پخش می کنند را اضافه می کند (علاوه بر URL اولیه).

حلقه یوتیوب

مقدار 0 (به طور پیش فرض): ویدئو تنها یک بار پخش خواهد شد.

مقدار1 ویدیو حلقه خواهد شد(برای همیشه)

تکرار
 <iframe width="420" height="315"
src="https://www.youtube.com/embed/tgbNymZ7vqY?playlist=tgbNymZ7vqY&loop=1">
</iframe> 
مشاهده مثال

کنترل های یوتیوب

مقدار 0: کنترل های پخش نمایش داده نمی شود.

مقدار 1 (به طور پیش فرض): کنترل پخش کننده نمایش داده می شود.

کنترل در یوتیوب
 <iframe width="420" height="315"
src="https://www.youtube.com/embed/tgbNymZ7vqY?controls=0">
</iframe> 
مشاهده مثال

استفاده از< object> یا <embed>

توجه: YouTube <object> و <embed> از ژانویه 2015 منع شده بودند. شما باید برای فیلم های خود از<iframe>  استفاده کنید.

استفاده از object
<object width="420" height="315"
data="https://www.youtube.com/embed/tgbNymZ7vqY">
</object>
مشاهده مثال

استفاده از embed
<embed width="420" height="315"
src="https://www.youtube.com/embed/tgbNymZ7vqY">
مشاهده مثال

 

نظر شما

لطفا نام و نام خانوادگی خود را وارد کنید
لطفا ایمیل خود را وارد کنید لطفا ایمیل صحیح وارد کنید.
لطفا متن نظر خود را وارد کنید
>

مقالات و دروس

به خبرنامه مدرسه طراحی وب ایران (وب مهراز) بپیوندید.

لطفا شماره همراه صحیح وارد کنید.
لطفا ایمیل صحیح وارد کنید.

مقالات مرتبط