X

X

X

HTML -এ YouTube ভিডিও উপস্থাপণ


ওয়েবপেজে ভিডিও উপস্থাপণ করার সবচেয়ে সহজ উপায় হলো YouTube থেকে ভিডিও প্লে করা।


কোন ভিডিও ফরম্যাট ব্যবহার করবেন, এটা নিয়ে চিন্তিত?

এই অধ্যায়ে আপনি জেনেছেন HTML এ সব ধরণের ভিডিও সরাসরি প্লে করা যায় না। কারণ এটি সব ফরম্যাটের ভিডিও সাপোর্ট করে না। এজন্যে নন-সাপোর্টেড ভিডিওগুলোকে সাপোর্টেড ফরম্যাটে কনভার্ট করার প্রয়োজন হয়েছে হয়তো। এই কাজটি অনেক সময় বেশি জটিল এবং সময় সাপেক্ষ।

এক্ষেত্রে সমাধান হচ্ছে YouTube ভিডিও ব্যবহার করা। আপনার যেকোনো ফরম্যাটের ভিডিও YouTube -এ আপলোড করে, সেগুলোকে যেকোনো ওয়েব পেজে ব্যবহার করতে পারবেন কোনো প্রকার সমস্যা ছাড়া।


YouTube Video Id

YouTube -এ ভিডিও আপলোড করার পর প্রতিট ভিডিও এর জন্য আলাদা আলাদা ভিডিও id পাবেনা। যেমন, XGSy3_Czz8k । এই ভিডিও id ব্যবহার করে আপনার HTML কোড এ ব্যবহার করে YouTube ভিডিও প্লে করতে পারবেন।


HTML এ YouTube ভিডিও প্লে করার পদ্ধতি

HTML এ YouTube ভিডিও প্লে করার জন্য নিচের পদ্ধতি অনুসরণ করুন:

  • YouTube-এ ভিডিওটি আপলোড করুন।
  • video id টি নোট বা সংরক্ষণ করুন।
  • ওয়েবপেজে একটি <iframe> ইলামেন্ট তৈরি করুন।
  • src attribute এ ভিডিও এর লিংকটি লিখুন।
  • width এবং height attribute দিয়ে প্লেয়ারের ডাইমেনশন সেট করুন।
  • অন্যান্য প্রয়োজনীয় প্রোপার্টিগুলো URL এ যুক্ত করুন।

Code Example

<iframe width="420" height="345" src="https://www.youtube.com/embed/tgbNymZ7vqY">
</iframe>

নিজে নিজে চেষ্টা করুন বাটনে ক্লিক করে দেখুন এটি কিভাবে কাজ করে।


YouTube Autoplay

পেজটি লোড হওয়ার সাথে সাথে স্বয়ংক্রিয়ভাবে ভিডিওটি প্লে করার জন্য নিচের পদ্ধতি অনুসরণ করুন।

বি:দ্র: স্বয়ংক্রিয়াবে ভিডিও প্লে করার পূর্বে গভীরভাবে চিন্তু করুন, সত্যিই আপনার এই ফিচারটি দরকার কি না। কেননা এতে ব্যবহারকারী বিরক্ত হতে পারে এবং আপনার ওয়েবসাইটের ভিজিটর কমে যেতে পারে।

Value 0 (default) হলে ভিডিওটি স্বয়ংক্রিয়ভাবে চালু হবে না।

Value 1: হলে ভিডিওটি স্বয়ংক্রিয়ভাবে চালু হবে।

Code Example

<iframe width="420" height="345" src="https://www.youtube.com/embed/tgbNymZ7vqY?autoplay=1">
</iframe>

নিজে নিজে চেষ্টা করুন বাটনে ক্লিক করে দেখুন এটি কিভাবে কাজ করে।


YouTube Playlist

একই সাথে অনেকগুলো ভিডিও প্লে করা যায়। এ জন্য কমা দিয়ে ভিডিও আইডিগুলোকে URL এর সাথে যুক্ত করতে হবে।


YouTube Loop

Value 0 (default) হলে ভিডিওটি শুধুমাত্র একবার প্লে হবে।

Value 1 হলে ভিডিওটি চলতেই থাকবে।

Code Example

<iframe width="420" height="345" src="https://www.youtube.com/embed/tgbNymZ7vqY?playlist=tgbNymZ7vqY&loop=1">
</iframe>

নিজে নিজে চেষ্টা করুন বাটনে ক্লিক করে দেখুন এটি কিভাবে কাজ করে।


YouTube Controls

Value 0 হলে প্লেয়ারে কন্ট্রোলগুলো প্রদর্শিত হবে না।

Value 1 (default) হলে প্লেয়ারে কন্ট্রোলগুলো প্রদর্শিত হবে।

Code Example

<iframe width="420" height="345" src="https://www.youtube.com/embed/tgbNymZ7vqY?controls=0">
</iframe>

নিজে নিজে চেষ্টা করুন বাটনে ক্লিক করে দেখুন এটি কিভাবে কাজ করে।


YouTube ভিডিও প্লে করার জন্য <object> অথবা <embed> ব্যবহার করা উচিৎ কি না

বি:দ্র: January 2015 থেকে YouTube ভিডিও প্লে করার জন্য <object> অথবা <embed> এর ব্যবহার ডিপ্রিকেট বা বাতিল করার ঘোষনা দেওয়া হয়েছে। কাজেই আপনার উচিৎ হবে <iframe> ইলামেন্ট ব্যবহার করা।

Code Example

<object width="420" height="315"
data="https://www.youtube.com/v/tgbNymZ7vqY">
</object>

নিজে নিজে চেষ্টা করুন বাটনে ক্লিক করে দেখুন এটি কিভাবে কাজ করে।


Code Example

<embed width="420" height="315"
src="https://www.youtube.com/v/tgbNymZ7vqY">

নিজে নিজে চেষ্টা করুন বাটনে ক্লিক করে দেখুন এটি কিভাবে কাজ করে।