যেকোনো ওয়েবসাইটে ভিডিও প্লেয়ার এমবেড করুন

সরাসরি ভিডিও ট্যাগ নয় কেন?

MP4 সহ সাধারণ HTML ভিডিও ট্যাগ দশ সেকেন্ডের লুপের জন্য চলে, তারপর আর চলে না। বড় ফাইল ধীর সংযোগে আটকে যায়, ব্রাউজারভেদে ফরম্যাট আলাদা, আর কেউ প্লে চাপলেই আপনার নিজের ওয়েব হোস্টকে ব্যান্ডউইথের খরচ দিতে হয়। এমবেড প্লেয়ার এটি উল্টে দেয়। ফাইল থাকে FileHost.net-এ, স্ট্রিম দর্শকের সংযোগ অনুযায়ী মানিয়ে নেয়, আর আপনার পেজে থাকে শুধু একটি ছোট iframe।

প্লেয়ারে আসলে কী কী আছে

প্লেব্যাক চলে Video.js ভিত্তিক প্লেয়ারে, যা HLS স্ট্রিম করে। দর্শকরা পান ফুলস্ক্রিন, প্লেব্যাক স্পিড মেনু, প্লে, সিক, ভলিউম, মিউট ও ফুলস্ক্রিনের কিবোর্ড শর্টকাট, পেজ আবছা করা সিনেমা মোড, এবং আপলোডের পর স্বয়ংক্রিয়ভাবে তৈরি টাইমলাইনের হোভার থাম্বনেইল। সাবটাইটেল SRT ফাইল হিসেবে 45টি ভাষা থেকে যোগ করা যায়, আর চাইলে প্লেয়ার সাবটাইটেল ট্র্যাক চালু রেখেই শুরু হতে পারে।

মালিকরা এমবেডের প্রস্থ ও উচ্চতা ঠিক করতে, নিজের লোগো যোগ করতে, স্প্ল্যাশ বা পোস্টার ছবি বাছতে এবং প্রিমিয়ামে সাইটের সাথে মিলিয়ে প্লেয়ারের রং বদলাতে পারেন। অ্যাডভান্সড ইউজাররা ড্যাশবোর্ড থেকে VAST বিজ্ঞাপন ট্যাগ বা পপ সেটিংস যুক্ত করতে পারেন।

পাঁচ ধাপে ভিডিও এমবেড করুন

1. 1ভিডিও আপলোড করুন এবং ভিডিও তালিকায় প্রস্তুত দেখানো পর্যন্ত অপেক্ষা করুন।
2. 2ভিডিও খুলে এমবেড ট্যাব বাছুন। ডিফল্ট কোড 600 বাই 480 পিক্সেলের একটি iframe, যার মাপ বদলানো যায়।
3. 3কোড কপি করে পেজের HTML ভিউতে বা এডিটরের কাস্টম HTML ব্লকে পেস্ট করুন।
4. 4iframe-কে 16 বাই 9 অনুপাতের কন্টেইনারে রেখে রেসপনসিভ করুন, যা বেশিরভাগ থিমে আগে থেকেই আছে।
5. 5প্রকাশের আগে ফোন ও ডেস্কটপে প্রাইভেট উইন্ডোতে পেজ খুলে প্লেব্যাক ও মাপ ঠিক আছে কি না দেখে নিন।

এমবেড কোড

সাধারণ iframe

ড্যাশবোর্ড এই কাঠামোই তৈরি করে। কোডে আপনার নিজের ভিডিওর পাবলিক ID বসান।

<iframe width="600" height="480" src="https://filehost.net/e/YOUR_CODE" scrolling="no" frameborder="0" allowfullscreen="true"></iframe>

রেসপনসিভ র‍্যাপার

একটি ছোট র‍্যাপার যেকোনো স্ক্রিন প্রস্থে 16 বাই 9 আকৃতি ধরে রাখে। এটি স্টাইলশিটে যোগ করুন এবং ভেতরে একই iframe ব্যবহার করুন।

<div style="position:relative;aspect-ratio:16/9;max-width:100%">
  <iframe src="https://filehost.net/e/YOUR_CODE"
    style="position:absolute;inset:0;width:100%;height:100%;border:0"
    allowfullscreen="true"></iframe>
</div>

পারফরম্যান্স ও SEO বিবেচনা

iframe আপনার নিজের স্ক্রিপ্ট থেকে আলাদা থাকে, তাই এটি লেআউট ধীর করে না বা থিমের সাথে সংঘাত করে না, তবে সার্চ ইঞ্জিন ভিডিওটিকে এমবেড করা ঠিকানার অংশ হিসেবে ধরে। কনটেন্ট যাতে র‍্যাংক করে, সেজন্য নিজের পেজে এমবেডের সাথে বর্ণনামূলক শিরোনাম, ছোট লিখিত সারসংক্ষেপ ও ট্রান্সক্রিপ্ট দিন। ভিডিও পেজের নিচের দিকে থাকলে iframe-এ loading অ্যাট্রিবিউট lazy দিন।

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

এমবেড করা ভিউ থেকে আয়

এমবেড প্লেয়ারের ভিউ ওয়াচ পেজের সমান হারে আয়ে গোনা হয়, তাই একটি জনপ্রিয় লেখা নিজের খরচ নিজেই তুলতে পারে। প্লেয়ারের ভেতরে নিজের VAST বিজ্ঞাপনও চালাতে পারেন; আপনার নিজের বিজ্ঞাপন চালু থাকাকালে ব্যবহৃত ট্রাফিক প্রিমিয়াম ব্যান্ডউইথ থেকে কাটা হয়, যার খরচ প্রতি টেরাবাইটে নির্দিষ্ট 2 ডলার। এর ওপর ব্যবসায়িক পরিকল্পনা করার আগে আয়ের নিয়ম পড়ুন।

সমস্যা সমাধান

প্লেয়ারে ফাঁকা বক্স দেখালে আপনার পেজ কনটেন্ট সিকিউরিটি পলিসি দিয়ে তৃতীয় পক্ষের ফ্রেম আটকাচ্ছে কি না দেখুন। সাবটাইটেল না এলে ট্র্যাকটি সঠিক ভিডিওতে যোগ হয়েছে এবং SRT ফরম্যাটে আছে কি না নিশ্চিত করুন। ফোনে পেজ ঠিক না দেখালে নির্দিষ্ট প্রস্থ ও উচ্চতার বদলে উপরের রেসপনসিভ র‍্যাপার ব্যবহার করুন।

FileHost.net-এর তুলনা

ড্রাইভ-ধরনের সার্ভিস থেকে এমবেড করলে প্রায়ই আনাড়ি প্রিভিউ ফ্রেম আসে। প্লেয়ারগুলোর পার্থক্য দেখুন।

সব তুলনা দেখুন

সম্পর্কিত টুলস ও গাইড