ভিডিও, ভিডিও, ভিডিও, ভিডিও

আপনি <devsite-video> কাস্টম উপাদান ব্যবহার করে সরাসরি DevSite পৃষ্ঠাগুলিতে YouTube ভিডিও এম্বেড করতে পারেন। সমস্ত ভিডিও প্রতিক্রিয়াশীল এবং ভিউপোর্ট প্রস্থ পরিবর্তনের সাথে সাথে একটি 16:9 অনুপাত বজায় রাখে।

একটি YouTube ভিডিও এম্বেড করতে, আপনার পৃষ্ঠায় একটি <devsite-video> কাস্টম উপাদান যোগ করুন এবং video-id বৈশিষ্ট্যটি ভিডিওর জন্য v URL প্যারামিটারের মান সেট করুন।

উদাহরণস্বরূপ, YouTube ভিডিও "আপনার প্রথম স্ক্রিপ্ট - অ্যাপস স্ক্রিপ্ট টিউটোরিয়াল" এম্বেড করতে যা আপনি https://www.youtube.com/watch?v=Pgfbl_o9WvM- এ খুঁজে পেতে পারেন, নিম্নলিখিত <devsite-video> কাস্টম উপাদান যোগ করুন DevSite পৃষ্ঠা:

<devsite-video video-id="Pgfbl_o9WvM"></devsite-video>

তারপর <devsite-video> কাস্টম উপাদানটিকে একটি <div> এলিমেন্টে মুড়ে দিন যার class অ্যাট্রিবিউট নিচের মানগুলির একটিতে সেট করা আছে:

<div class="video-wrapper-left">
  <devsite-video video-id="Pgfbl_o9WvM"></devsite-video>
</div>

ডিফল্ট

নিম্নলিখিত উদাহরণ দেখায় কিভাবে একটি এমবেডেড YouTube ভিডিও প্রদর্শিত হয় যখন <devsite-video> একটি <div> উপাদানে মোড়ানো হয় যার class বৈশিষ্ট্য video-wrapper সেট করা হয়।

বড় স্ক্রীনে, ভিডিওটি বিষয়বস্তু এলাকার প্রস্থের 50% এবং ভিডিওর আগের যেকোনো বিষয়বস্তুর ডানদিকে ভাসতে থাকে। ছোট পর্দায়, ভিডিওটি বিষয়বস্তুর এলাকার প্রস্থের 100%।

কোড 

<div class="video-wrapper">
  <devsite-video video-id="Pgfbl_o9WvM"></devsite-video>
</div>

<p>Lorem ipsum dolor...</p>

ডেমো

ভেসে গেল বামে

নিম্নলিখিত উদাহরণটি দেখায় কিভাবে একটি এমবেডেড YouTube ভিডিও প্রদর্শিত হয় যখন <devsite-video> একটি <div> উপাদানে মোড়ানো হয় যার ক্লাস অ্যাট্রিবিউট video-wrapper-left সেট করা থাকে।

বড় স্ক্রীনে, ভিডিওটি বিষয়বস্তু এলাকার প্রস্থের 50% এবং ভিডিওর পূর্ববর্তী যেকোনো বিষয়বস্তুর বাম দিকে ভাসতে থাকে। ছোট পর্দায়, ভিডিওটি বিষয়বস্তুর এলাকার প্রস্থের 100%।

কোড 

<div class="video-wrapper-left">
  <devsite-video video-id="Pgfbl_o9WvM"></devsite-video>
</div>

<p>Lorem ipsum dolor...</p>

ডেমো

পূর্ণ-প্রস্থ

নিম্নলিখিত উদাহরণ দেখায় কিভাবে একটি এমবেডেড YouTube ভিডিও প্রদর্শিত হয় যখন <devsite-video> একটি <div> উপাদানে মোড়ানো হয় যার class বৈশিষ্ট্য video-wrapper-full-width সেট করা হয়।

ভিডিওটি বিষয়বস্তু এলাকার প্রস্থের 100% এবং ভিডিওর পূর্ববর্তী কোনো সামগ্রীর বিন্যাসকে প্রভাবিত করে না৷

কোড 

<div class="video-wrapper-full-width">
  <devsite-video video-id="Pgfbl_o9WvM"></devsite-video>
</div>

<p>Lorem ipsum dolor...</p>

ডেমো

নোট

সমস্ত কোড উদাহরণ DevSite-এর এম্বেড YouTube উইজেট ব্যবহার করে, যা স্বয়ংক্রিয়ভাবে Google Analytics ডেটা ট্র্যাক করে৷ বিশেষ ক্ষেত্রে যেখানে আপনি একটি এমবেডেড ভিডিওর জন্য ব্যবহারের পরিসংখ্যান সংগ্রহ করতে চান না , এই উইজেটটি ব্যবহার করুন। এটি ছাড়া, আপনার ভিডিওর ব্যবহারের পরিসংখ্যান Analytics-এ পাঠানো হবে না।