ওয়ার্ডপ্রেস: আপনার ব্লগ পোস্টে একটি এমপি 3 প্লেয়ার এম্বেড করুন

ওয়ার্ডপ্রেস সহ ব্লগ পোস্ট এমপি 3 প্লেয়ার

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

সাম্প্রতিক একটি সাক্ষাত্কারের জন্য কোনও প্লেয়ার প্রদর্শন করা দুর্দান্ত, আসল অডিও ফাইলটি হোস্টিং করা ঠিক হবে না। ওয়ার্ডপ্রেস সাইটগুলির জন্য বেশিরভাগ ওয়েব হোস্টগুলি স্ট্রিমিং মিডিয়াটির জন্য অনুকূলিত হয় না - তাই আপনি যদি এমন কিছু সমস্যা শুরু করতে শুরু করেন তবে অবাক হবেন না যেখানে আপনি ব্যান্ডউইথের ব্যবহার বা আপনার অডিও স্টলগুলি একসাথে সীমাবদ্ধ করে ফেলেছেন hit আমি কোনও অডিও স্ট্রিমিং পরিষেবা বা পডকাস্ট হোস্টিং ইঞ্জিনে আসল অডিও ফাইলটি হোস্ট করার পরামর্শ দেব। এবং ... আপনার হোস্টটি এসএসএল (একটি https: // পাথ) সমর্থন করে তা নিশ্চিত করুন… নিরাপদে হোস্ট করা একটি ব্লগ অন্য কোথাও নিরাপদে হোস্ট করা হয়নি এমন একটি অডিও ফাইল বাজবে না।

এটি বলেছিল, আপনি নিজের ফাইলের অবস্থান জানেন এটি একটি ব্লগ পোস্টে এম্বেড করা বেশ সহজ। ওয়ার্ডপ্রেসের নিজস্ব HTML5 অডিও প্লেয়ার রয়েছে যার মধ্যে এটি সরাসরি নির্মিত হয় যাতে আপনি প্লেয়ারটি প্রদর্শনের জন্য একটি শর্টকোড ব্যবহার করতে পারেন।

সাম্প্রতিক পডকাস্ট পর্বের একটি উদাহরণ এখানে দিয়েছি:

ওয়ার্ডপ্রেসে গুটেনবার্গ সম্পাদকের সর্বশেষ পুনরাবৃত্তি সহ আমি কেবল অডিও ফাইলের পথটি পেস্ট করেছি এবং সম্পাদকটি আসলে শর্টকোড তৈরি করেছে। আসল শর্টকোডটি অনুসরণ করে, যেখানে আপনি প্লে করতে চান এমন ফাইলের পুরো URL টির সাথে src প্রতিস্থাপন করবে।

[audio src="audio-source.mp3"]

ওয়ার্ডপ্রেস এমপি 3, এম 4 এ, ওজিজি, ওয়েভ এবং ডাব্লুএমএ ফাইল টাইপ সমর্থন করে। এমনকি আপনার কাছে এমন একটি শর্টকোড থাকতে পারে যা আপনার ব্রাউজারগুলি ব্যবহার করে এমন একটি বা অন্যটিকে সমর্থন করে না এমন ইভেন্টগুলিতে ফ্যালব্যাক সরবরাহ করে:

[audio mp3="source.mp3" ogg="source.ogg" wav="source.wav"]

আপনি শর্টকোডের পাশাপাশি অন্যান্য বিকল্পগুলির সাথে উন্নত করতে পারেন:

  • লুপ - অডিও লুপ করার জন্য একটি বিকল্প।
  • অটোপ্লে - ফাইলটি লোড হওয়ার সাথে সাথেই স্বয়ংক্রিয়ভাবে প্লে করার জন্য একটি বিকল্প।
  • প্রিলোড - পৃষ্ঠা সহ অডিও ফাইলটি প্রিললোড করার একটি বিকল্প।

সব কিছু এক সাথে রাখুন এবং আপনি যা পান তা এখানে:

[audio mp3="source.mp3" ogg="source.ogg" wav="source.wav" loop="yes" autoplay="on" preload="auto"]

ওয়ার্ডপ্রেসে অডিও প্লেলিস্ট

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

[playlist ids="123,456,789"]

সেখানে কিছু সমাধান সেখানে আপনার চাইল্ড থিম যুক্ত করতে পারেন যা বাহ্যিক অডিও ফাইল লোডিং সক্ষম করবে।

আপনার পডকাস্ট আরএসএস ফিডটি আপনার সাইডবারে যুক্ত করুন

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

ওয়ার্ডপ্রেস অডিও প্লেয়ারের কাস্টমাইজেশন

আপনি আমার নিজের সাইটে দেখতে পাচ্ছেন, এমপি 3 প্লেয়ারটি ওয়ার্ডপ্রেসে বেশ বেসিক। তবে এটি HTML5 হওয়ায় আপনি এটি CSS ব্যবহার করে বেশ কিছুটা সাজাতে পারেন। CSSIgniter একটি দুর্দান্ত টিউটোরিয়াল লিখেছেন অডিও প্লেয়ার কাস্টমাইজ করা সুতরাং আমি এগুলি এখানে পুনরাবৃত্তি করব না ... তবে আপনি কাস্টমাইজ করতে পারেন বিকল্পগুলি এখানে:

/* Player background */
.mytheme-mejs-container.mejs-container,
.mytheme-mejs-container .mejs-controls,
.mytheme-mejs-container .mejs-embed,
.mytheme-mejs-container .mejs-embed body {
  background-color: #efefef;
}

/* Player controls */
.mytheme-mejs-container .mejs-button > button {
  background-image: url("images/mejs-controls-dark.svg");
}

.mytheme-mejs-container .mejs-time {
  color: #888888;
}

/* Progress and audio bars */

/* Progress and audio bar background */
.mytheme-mejs-container .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-total,
.mytheme-mejs-container .mejs-controls .mejs-time-rail .mejs-time-total {
  background-color: #fff;
}

/* Track progress bar background (amount of track fully loaded)
  We prefer to style these with the main accent color of our theme */
.mytheme-mejs-container .mejs-controls .mejs-time-rail .mejs-time-loaded {
  background-color: rgba(219, 78, 136, 0.075);
}

/* Current track progress and active audio volume level bar */
.mytheme-mejs-container .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current,
.mytheme-mejs-container .mejs-controls .mejs-time-rail .mejs-time-current {
  background: #db4e88;
}

/* Reduce height of the progress and audio bars */
.mytheme-mejs-container .mejs-time-buffering,
.mytheme-mejs-container .mejs-time-current,
.mytheme-mejs-container .mejs-time-float,
.mytheme-mejs-container .mejs-time-float-corner,
.mytheme-mejs-container .mejs-time-float-current,
.mytheme-mejs-container .mejs-time-hovered,
.mytheme-mejs-container .mejs-time-loaded,
.mytheme-mejs-container .mejs-time-marker,
.mytheme-mejs-container .mejs-time-total,
.mytheme-mejs-container .mejs-horizontal-volume-total,
.mytheme-mejs-container .mejs-time-handle-content {
  height: 3px;
}

.mytheme-mejs-container .mejs-time-handle-content {
  top: -6px;
}

.mytheme-mejs-container .mejs-time-total {
  margin-top: 8px;
}

.mytheme-mejs-container .mejs-horizontal-volume-total {
  top: 19px;
}

আপনার ওয়ার্ডপ্রেস এমপি 3 প্লেয়ার বৃদ্ধি

কিছু সম্পূর্ণ অত্যাশ্চর্য অডিও প্লেয়ারগুলিতে আপনার এমপি 3 অডিও প্রদর্শনের জন্য কিছু অর্থ প্রদত্ত প্লাগইন রয়েছে:

প্রকাশ: আমি উপরের প্লাগইনগুলির মাধ্যমে আমার অনুমোদিত লিঙ্কগুলি ব্যবহার করছি Codecanyon, একটি দুর্দান্ত প্লাগইন সাইট যা ভালভাবে সমর্থিত প্লাগইন এবং অসামান্য পরিষেবা এবং সমর্থন।

আপনি কি মনে করেন?

এই সাইট স্প্যাম কমাতে Akismet ব্যবহার করে। আপনার ডেটা প্রক্রিয়া করা হয় তা জানুন.