برای پخش یک آهنگ در صفحات وب در مجموع تقریبا دو راه وجود دارد:
- پخش آهنگ با کدهای ساده html و بدون استفاده از پلاگین و کدی اضافه.
- پخش آهنگ با پلاگین و کدهای جاوا اسکریپت یا فلش.
هر کدام از روش هایی که در بالا گفته شد دارای معایب و محاسنی هستند، پخش آهنگ بدون پلاگین و تنها با استفاده از کدها و تگ های ساده html اگرچه خیلی راحت تر و سریع تر است، اما متاسفانه مشکل سازگاری با برخی مرورگرها هنوز حل نشده باقی مانده و البته گویا در نسخه بعدی html یعنی HTML 5، قرار است این مشکلات با استانداردسازی فرمت ها حل شود؛ روش پخش با استفاده از پلاگین اگرچه معمولا مشکل سازگاری با مرورگرها را حل می کند، اما به دلیل نیاز به بارگذاری عناصری مثل کد جاوا اسکریپت، فلش و... ممکن است برای همه به راحتی قابل استفاده نباشد، البته مشکل در حدی نیست که از آن صرف نظر کنیم؛ در این آموزش سعی می کنیم هر دو روش را توضیح دهیم و انتخاب را به خودتان واگذار می کنیم.
پخش آهنگ با تگ embed در html
یکی از ساده ترین روش های قرار دادن یک آهنگ در پس زمینه استفاده از تگ embed است.
<embed src="http://your/music/file.mid" autostart="true" loop="true"
width="0" height="0">
</embed>
<noembed>
<bgsound src="http://your/music/file.mid" loop="infinite">
</noembed>
توضیح:
- برای استفاده از این کد تنها کافی است آدرس آهنگ خود را با فرمت mid، wave یا mp3 در دو قسمت مروبط به src جایگزین کنید و کد را در قالب وبلاگ یا سایت قرار دهید.
پخش آهنگ با استفاده از قابلیت html 5 در مرورگرهای جدید
علاوه بر کد بالا، در استاندارد جدید وب (که البته هنوز به طور رسمی ارائه نشده) و در مرورگرهای جدید، تگ audio برای پخش آهنگ بدون پلاگین استفاده می شود:
<audio controls="controls" height="50px" width="100px">
<source src="http://your/music/file.mp3" type="audio/mpeg" />
<source src="http://your/music/file.ogg" type="audio/ogg" />
<embed height="50px" width="100px" src="http://your/music/file.mp3" />
</audio>
توضیح:
- کد بالا علاوه بر مرورگرهای جدید، در نسخه های قدیمی تر نیز اجرا می شود، چرا که ما html 5 را با تگ embed ترکیب کردیم تا اگر مرورگر از قابلیتهای html 5 پشتیبانی نکرد، تگ embed را اجرا کند.
- همانطور که در کد می بینید، علاوه بر فرمت mp3 از فرمت ogg نیز جهت اطمینان از پخش شدن آهنگ در تمام مرورگرها استفاده شده است.
پخش آهنگ با قرار دادن dew mp3 player
اگر با کدهای html قانع نشده اید، در ادامه قصد داریم پلاگینی زیبا، سبک و کارآمد را معرفی کنیم که به کمک آن می توانید با خیالی آسوده تر آهنگ های خود را پخش کنید؛
dewmp3player
پلیری رایگان و قدرتمند است که از خیلی جهات مناسب به نظر می رسد، حتی برخی از سایت ها با اعمال تغییراتی از آن به عنوان ابزار آنلاین پخش آهنگ در وبلاگ استفاده می کنند؛ قدرت این پلیر در حجم بسیار کم، انعطاف پذیری خوب و قابلیتهای گوناگونش نهفته است؛ اگرچه به جزء این پلاگین، برنامه های دیگری نیز در وب وجود دارند، اما معمولا یا رایگان نیستند یا اینکه حجمی به مراتب بیشتر دارند و مخصوصا برای ما کاربران ایرانی که از خیلی جهات در مضیقه ایم مناسب نیستند!

این پلاگین را با توجه به نیازتان در چند بسته مختلف برای دانلود قرار داده ایم که هر کدام تفاوتهایی با هم دارند:
دانلود پلیر شماره 1 (پلیر کلاسیک با قابلیت پخش یک آهنگ)
دانلود پلیر شماره 2 (پلیر کلاسیک با قابلیت پخش چند آهنگ و دکمه های کمکی)
دانلود پلیر شماره 3 (پلیر پیشرفته با قابلیت پخش یک آهنگ و افزایش و کاهش صدا)
نحوه استفاده:
هر کدام از بسته های بالا حاوی سه فایل هستند (index.html، test.mp3 و فایل فلش پلیر با فرمت swf)، برای پخش آهنگ باید ابتدا آن را آپلود کنید و لینک مستقیم را در کد جایگزین نمائید، فایل swf پلیر را نیز باید آپلود کنید و آدرس url آن را جایگزین نمائید، به عنوان مثال:
<object type="application/x-shockwave-flash" data="http://yoursite.com/dewplayer.swf?mp3=http://yoursite.com/test.mp3" width="200" height="20" id="dewplayer">
<param name="wmode" value="transparent" />
<param name="movie" value="http://yoursite.com/dewplayer.swf?mp3=http://yoursite.com/test.mp3" />
<param name="flashvars" value="mp3=http://yoursite.com/test.mp3&autostart=0&autoreplay=0" />
</object>
از تگ param flashvars و قسمت autostart=0&autoreplay=0 می توانید برای تنظیم شروع خودکار و پخش مجدد آهنگ استفاده کنید (مقادیر 0 به معنی غیر فعال و 1 فعال است).
تنظیمات پیش فرض مورد نیاز در فایل index جهت راهنمایی بیشتر و آسان تر شدن استفاده از کد، اعمال شده، کافی است که آدرس فایل ها را جایگزین مقادیر پیش فرض کنید.