postina logo پستینا منتشر شد 🎉

ابزار قرار دادن فایل صوتی و موزیک در وبلاگ

اکثر ما عاشق موزیک هستیم و دوست داریم پست‌های وبلاگمون همراه با موسیقی مورد علاقمون خونده و خواننده‌هامون رو به گوش دادنشون دعوت می‌کنیم. بعضی از وبلاگ‌ها هم پادکست محور هستن و پست‌های صوتی منتشر می‌کنن و به صورت کلی می‌تونیم نتیجه بگیریم که قرار دادن فایل صوتی در پست وبلاگ یکی از چالش‌های همیشگی اکثر وبلاگ‌نویس‌ها هست.

حتی اگر با کدنویسی آشنا باشین، خیلی از مواقع حال و حوصله‌ی تنظیمات تگ audio رو ندارین و این برای من خیلی پیش اومده و نیاز به یک ابزار برای راحتی انجام این کار رو به شدت احساس می‌کنم. این شد که مثل «ابزار قرار دادن ویدیو در وبلاگ» این ابزار رو هم برای قرار دادن فایل‌های صوتی از جمله موسیقی، پادکست، جلوه‌های صوتی و ... برای استفاده آزاد منتشر می‌کنم:

ابزار تولید کد فایل صوتی

سایت‌های آپلود فایل

آموزش استفاده از ابزار

استفاده از این ابزار خیلی راحت هست. تنها کافیه فایل خودتون رو با فرمت‌ها یا پسوند‌های mp3 یا ogg یا wav رو در یکی از سایت‌های آپلود فایل بالا، اپلود کنین و نشانی مستقیم دانلود فایل که انتهای نشانی، نقطه و یکی از پسوند‌های گفته شده رو داره در قسمت نشانی فایل مربوطه قرار بدین و دکمه‌ی تولید کد و پیشنمایش رو کلیک یا فشار بدین.

بعد از فشار دادن دکمه‌ی تولید کد و پیشنمایش یک پیشنمایش حقیقی از کد تولید شده و در ادامه کد تولید شده براتون تولید میشه. پیشنمایش برای تست هست که آیا اون چیزی هست که مد نظرتونه و اگر همون چیزی هست که می‌خواین در ادامه کد تولید شده رو کپی می‌کنین.

حالا وقت اون رسیده که وارد پنل وبلاگتون بشین و از قسمت انتشار و حالا یا ارسال مطلب جدید یا فهرست مطالب، وارد ویرایشگر مطلبتون شده و دکمه‌ی منبع رو در ویرایشگر فشار بدین یا کلیک کنین تا بتونین کد تولید شده رو به درستی وارد پستتون کنین.

وقتی که وارد منبع شدین کد کپی کرده رو اونجا paste می‌کنین و دوباره دکمه‌ی منبع رو فشار میدین یا کلیک می‌کنین تا وارد حالت ویرایش دیداری بشین و حالا می‌تونین پست خودتون رو به راحتی بنویسین.

تنظیمات پیشرفته

این ابزار برای افرادی که نیاز به تنظیمات خاصی از تگ صوتی دارن هم طراحی شده. تقریبا تمامی ویژگی‌های تگ صوتی HTML5 به صورت دیداری قرار داده شده که به راحتی بتونیم تگ صوتی رو با سرعت بالا تولید کنیم.

بخش‌های نشانی فایل با فرمت‌های OGG و Wav کامل مشخص هست. اگر به غیر از فایل با فرمت mp3 رو آپلود کردین، می‌تونین نشانی فایل آپلود شده با اون فرمت خاص رو هم در این کادرها وارد کنین تا اگر دوستی با مرورگری وارد وبلاگتون شد و دستگاهش کدک mp3 رو پشتیبانی نمی‌کرد بتونه از طریق فرمت ogg آهنگ مورد علاقه شما رو گوش بده. گزینه نمایش کنترل هم برای نشون دادن کنترل‌های ایستادن و نوار پخش موزیک هست که حتما فعال باید باشه تا بقیه بتونن استفاده کنن از پخش‌کننده.

پخش اتومات برای مواقعی هست که می‌خواین فایل صوتی شما برای خواننده به صورت خودکار پخش بشه، بدون این که دکمه‌ی پخش رو بزنن. البته این گزینه در مرورگرهای پیشرفته معمولا غیرفعال شده اما احتمالا کسانی که از مرورگر کروم استفاده می‌کنن هنوز براشون پخش خودکار اتفاق میوفته. برای این منظور باید این گزینه رو فعال کنین و بعد کد رو دوباره تولید کنین.

اگر می‌خواین موزیک شما بعد از اتمام پخش دوباره به صورت خودکار تکرار بشه، این گزینه رو فعال کنین.

این گزینه به صورت پیش‌فرض فعال هست و باعث این میشه که دو خط خالی قبل و بعد فایل صوتی ایجاد بشه که بتونین در ویرایشگر دیداری انتشار پستتون به راحتی قبل یا بعد فایل صوتی، به نوشتن پستتون ادامه بدین.

تگ audio به صورت پیش‌فرض یک مقدار زیبا نیست و به دلیل زیبایی بیشتر این تگ رو با گوشه‌های خمیده، به صورت پیش‌فرض قرار دادم ولی اگر نمی‌پسندیدن می‌تونین این گزینه رو غیرفعال کنین تا به صورت عادی براتون به نمایش گذاشته بشه.

در مورد عرض آدیو هم اگر می‌خواین تگ صوتی ۱۰۰ درصد عرض پست رو به خودش اختصاص بده یا هر درصد یا واحدی که مد نظرتون هست رو در این کادر قرار بدین و کد رو دوباره تولید کنین تا به شکل مد نظرتون قرار بگیره.

برچسب‌ها

از قبل24 تا نظر داشتیم!

(*post_author*)
فاطـــღـــمـه ツ
فاطـــღـــمـه ツ
مثل همیشه عالی :)
۲۲ آبان ۱۳۹۹
(*comment_reply_fullname*)
محمدرضا ...
مرسی ... 😊🌷🌹
۲۲ آبان ۱۳۹۹
some boy
some boy
wow
۲۲ آبان ۱۳۹۹
(*comment_reply_fullname*)
محمدرضا ...
مرسی ... 😊🌷🌹
۲۲ آبان ۱۳۹۹
Mohsen Farajollahi シ
Mohsen Farajollahi シ
تمام :) ساخت ابزار فایل صوتی توی برنامه من بود ولی ماشاء الله شما اینقدر خوب کار کردین که دیگه فکر نکنم نیازی باشه من کاری انجام بدم.واقعا عالیه... ممنونم ازتون!
۲۲ آبان ۱۳۹۹
(*comment_reply_fullname*)
محمدرضا ...
خب شاید اولین دید برای ساخت یک ابزار کمک به همه باشه ... اما حتما ابزار رو بسازین ... این یک تجربه‌ی کدنویسی فوق‌العاده هست ... چالش‌های جالبی داره و همینطور خواننده‌های وبلاگتون ازش استفاده می‌کنن ... خیلی از خواننده‌های شما خواننده وبلاگ من نیستن ... و به درد خیلی‌های دیگه می‌تونه بخوره ... پس حتما به کارتون ادامه بدین ... و سعی نکنین کارها رو مقایسه کنین توی این مرحله ... سعی کنین از کاری که می‌کنین لذت ببرین ... برای بهبود و پیشرفت خوبه که مقایسه کنین ... + مرسی ... خواهش می‌کنم 😊🌷🌹
۲۲ آبان ۱۳۹۹
هیـ ‌‌‌ـچ
هیـ ‌‌‌ـچ
عه چقدر خوب، اتفاقاً برای همین روزایی که در پیش داریم همچین پلیری می‌خواستم و مرسی که معرفی کردی :)
۲۲ آبان ۱۳۹۹
(*comment_reply_fullname*)
محمدرضا ...
واقعا ابزار پر کابردیه توی محیط وبلاگ ... خودم خیلی ازش استفاده می‌کنم جاهای مختلف ... 😁+ خواهش می‌کنم ... 😊🌷🌹
۲۲ آبان ۱۳۹۹
Alireza z.i
Alireza z.i
خیلی عالی و مفید. :)))))
۲۲ آبان ۱۳۹۹
(*comment_reply_fullname*)
محمدرضا ...
مرسی ... 😊🌷🌹
۲۲ آبان ۱۳۹۹
** سیلاک **
** سیلاک **
بسیار عالی .. به قدری حرفه ای و کامل همه چی رو توضیح میدین آدم دلش نمیاد نخونه  ممنونم :))
۲۲ آبان ۱۳۹۹
(*comment_reply_fullname*)
محمدرضا ...
مرسی ... خوشحالم که از خوندن پست لذت بردین ... 😊🌷🌹خواهش می‌کنم ... 😊🌷🌹
۲۲ آبان ۱۳۹۹
دختر پاییزی
دختر پاییزی
سلام... خیلی ممنون مفید بود واقعا🌷...فقط دوتا سوال برام پیش اومد ممنون میشم جواب بدید 🙏1. این ابزار میشه دانلود کرد؟ یا فقط تو همین صفحه می تونیم استفاده کنیم؟2.من از ابزار شما برای یکی از پستایی که قبلا گذاشته بودم استفاده کردم منتهی نتونستم اون آهنگ قبلی رو که گذاشته بودم پاک کنم😅..راهی هست برای این قضیه؟
۲۲ آبان ۱۳۹۹
(*comment_reply_fullname*)
محمدرضا ...
سلام ... وقتتون بخیر ... خواهش می‌کنم ... مرسی ... 😊🌷🌹 ... حتما ... ۱. ابزار قابل دانلود هست ... تنها کافیه این صفحه از وبلاگم رو با مرورگرتون ذخیره کنین (مثلا برای مرورگر فایرفاکس وقتی روی صفحه راست کلیک می‌کنین گزینه‌ای با عنوان save page as داره) ... و هر بار که می‌خواین استفاده کنین از جایی که ذخیره کردین دوباره فایل html رو فراخونی کنین ... ولی در حالت عادی همیشه اینجا هست ... ۲. خب برای پاک کردن تگ‌های آدیو و ویدیو می‌تونین به قسمت منبع پستتون برین و کلمه‌ی audio یا video رو پیدا کنین توی کد منبع پست ... و از آغاز تگ تا پایانش رو حذف کنین ... چرا که ویرایشگر دیداری بیان قابلیت حذفش رو نداره ...
۲۲ آبان ۱۳۹۹
محمدمهدی قاسمی
محمدمهدی قاسمی
بسیار عالی...موفق باشید
۲۲ آبان ۱۳۹۹
(*comment_reply_fullname*)
محمدرضا ...
مرسی ... سلامت باشین ... 😊🌷🌹
۲۲ آبان ۱۳۹۹
Mohsen Farajollahi シ
Mohsen Farajollahi シ
نه خب پروژه های دیگه ای هم هستش که روشون کار کرد :) نمیدونم از کدوم روش برای قرار دادن اطلاعات توی کد اصلی استفاده کردین ولی بنظرم استفاده از Regular Expression برای پیدا کردن رشته مورد نظرمون تو کد اصلی و جایگذاری مقدار پیش فرض با داده کاربر کار تمیز تری هستش. تجربه تقریبا مشابهی رو در "ابزار اسلایدر ساز تمام css" دارم. هدف من حل کردن مشکلات کاربران بلاگ بود که شما این مشکل رو به خوبی حل کردین و چون طراحی واقعا قشنگی هم تو ساخت ابزار دارین یک جورایی اتلاف وقت هست اگر حتی تلاش کنم یک ابزار کپی مال شما بسازم :) بخاطر همین تو قسمت لینک های روزانه یک لینک به این مطلب گذاشتم تا خواننده هام اگر خواستن از این ابزار استفاده کنن. باز ممنون از لطفتون... هدفم این نبود که بگم "منم بلدم" یا "شما ایده منو دزدیدین" بلکه بالعکس واقعا خوشحالم که فردی هست که نیاز های وبلاگ نویسان رو درک کنه و کاری براشون انجام بده!
۲۲ آبان ۱۳۹۹
(*comment_reply_fullname*)
محمدرضا ...
عالیه که پروژه‌های دیگه‌ای هست ... پس خوب شد که مشکل یه نیازمندی حل شد ... 😁+ موافقم ... با رگکس کار تمیزتر در میاد ولی این ابزارهایی که من درست کردم بسیار ساده طراحی شدن و زیاد تمیز نیستن ... 😁+ چه جالب ... یکی از خواننده‌های بلاگ از من خواسته بود که ابزار اسلایدر ساز تمام سی اس اس بنویسم ... توی فکرش بودم ... خوب شد که یکی ساختین ... + مرسی که لینک کردین ... با منطقتون موافقم ... امیدوارم به درد دوستان بخوره ... خواهش می‌کنم ... 😊🌷🌹+ خب من هم به چنین چیزی فکر نمی‌کردم ... راستش توی این فکر بودم که شاید انگیزه‌ی یک خالق اثری رو برای ساخت یک محصول منحصر به فردش گرفته باشم ... که خوشحالم اینطور نبود ...
۲۲ آبان ۱۳۹۹
عرفان‌‌ ‌‌‌‌
عرفان‌‌ ‌‌‌‌
مثل همیشه عالی :))، خسته نباشین😉
۲۲ آبان ۱۳۹۹
(*comment_reply_fullname*)
محمدرضا ...
مرسی ... سلامت باشین ... 😊🌷🌹
۲۲ آبان ۱۳۹۹
.ک. .ن.
.ک. .ن.
اقعا بهترین ابزار ساز بیانی😉💗
۲۲ آبان ۱۳۹۹
(*comment_reply_fullname*)
محمدرضا ...
قربونت ... مرسی ... 😊🌷🌹
۲۲ آبان ۱۳۹۹
محمدمهدی قاسمی
محمدمهدی قاسمی
سلام مجدد...بنده یک پیشنهاد دارم از شما ... چون کاربلد هستید گفتم مطرح کنم ... متاسفانه بیان که کاری نمیکنهاگر براتون مقدور هست یک کد بنویسید که کاربران . بتونند پاسخ سایر کاربران رو بدندمنظورم این هست که هر کس نظری ارسال کرد. سایر کاربران بتونند به اون نظر پاسخ بدند ...و اینکه آیا تغییر قالب وبلاگ میتونه توی سئو تاثیر داشته باشه؟ من قالبم رو به نقل تغییر دادم و توی سایت gtmetrix هم بررسی کردم که متاسفانه نتیجه خوب نبود!!البته سایت gtmetrix رو بیشتر برای وردپرس استفاده میکنندممنون از شما
۲۲ آبان ۱۳۹۹
(*comment_reply_fullname*)
محمدرضا ...
سلام ... وقتتون بخیر ... خب چنین چیزی با امکان جاواسکریپت امکان‌پذیر هست اما به صورت اصولی باید بیان انجام بده و همه نمی‌تونن و نمی‌خوان امکان جاواسکریپت رو خریداری و فعال کنن ...+ همینطوره ... می‌تونه تاثیر بذاره ... ولی در کل بیان امکانات آنچنانی‌ای برای مانور دادن نداره و باید یه جورایی کدنویس باشین تا بتونین مشکلاتتون رو حل کنین چون سیستم بیان یه نرم‌افزار انحصاری هست و فقط برنامه‌نویس‌های شرکت می‌تونن تغییرات رو ایجاد کنن ...+ ابزار جی تی متریکس برای تست سرعت سایت هست و سرعت سایت روی تجربه‌ی کاربر تاثیر میذاره که با وجود cache و فناوری‌های دیگه تاثیر سرعت سایت برای بهینه سازی موتورهای جستجو کمتر شده ... و برای بررسی سئوی سایتتون سعی کنید از ابزارهای آنالیز سئو مثل این سایت استفاده کنین ... خواهش می‌کنم ... خوشحالم که تونستم راهنماییتون کنم ... 😊🌷🌹
۲۲ آبان ۱۳۹۹
Amir chaqamirza
Amir chaqamirza
سلام سلام سلام.خیلی خوب و درست توضیح دادینعالی.دستتان درد نکنه.خدا قوت....
۲۲ آبان ۱۳۹۹
(*comment_reply_fullname*)
محمدرضا ...
سلام ... وقتتون بخیر ... + مرسی ... خواهش می‌کنم ... 😊🌷🌹 ... سلامت باشین ...
۲۲ آبان ۱۳۹۹
نویسنده آشنا
نویسنده آشنا
سلامآقا دمت گرم😄🌹 گل کاشتی عزیز😉👌شکرا جزیلا
۲۲ آبان ۱۳۹۹
(*comment_reply_fullname*)
محمدرضا ...
سلام ... وقتت بخیر ... قربانت ... مرسی ... 😊🌷🌹
۲۳ آبان ۱۳۹۹
زهرا میم
زهرا میم
عااالی.ممنون
۲۳ آبان ۱۳۹۹
(*comment_reply_fullname*)
محمدرضا ...
مرسی ... خواهش می‌کنم ... 😊🌷🌹
۲۳ آبان ۱۳۹۹
Dreamic
Dreamic
سلام. تشکر بابت مطالب خوبتونای کاش یه سایت مطمئن هم برای اپلود فایل صوتی تو این پست معرفی میکردید 🌹🙏🏻
۳ آذر ۱۳۹۹
(*comment_reply_fullname*)
محمدرضا ...
سلام ... وقتتون بخیر ... مرسی ... خواهش می‌کنم ... 😊🌷🌹+ اتفاقا سایت‌های آپلود معتبری رو بعد از ابزار با عنوان «سایت‌های آپلود فایل» لیست کردم ... می‌تونین از سایت‌ها برای آپلود فایل صوتی استفاده کنین ... 👍
۳ آذر ۱۳۹۹
راینر | ‌Rainer
راینر | ‌Rainer
مرسی خیلی ابزار مفیدیه :)
۲۳ آذر ۱۳۹۹
(*comment_reply_fullname*)
محمدرضا ...
خواهش می‌کنم ... مرسی ... خوشحالم که به درد می‌خوره ... 😊🌹
۲۳ آذر ۱۳۹۹
زری ...
زری ...
سلاممن از ابزارتون استفاده کردم...توی کامپیوتر میادش ، ولی توی موبایل نمیادش o-Oفقط یه جا خالیه...نمیدونم چرا...مشکل از مرورگره ؟این پست   
۵ بهمن ۱۳۹۹
(*comment_reply_fullname*)
محمدرضا ...
سلام، وقتتون بخیرخوشحالم که این ابزار به دردتون خورد ...⁦😊خب من به دستگاه‌های مختلفی امتحان کردم، مشکلی ندارن و پخش می‌کنهاحتمالا از سمت مرورگر شماست ...
۵ بهمن ۱۳۹۹
زری ...
زری ...
پس  مرورگره... مرسی ممنون :))))
۵ بهمن ۱۳۹۹
(*comment_reply_fullname*)
محمدرضا ...
ببخشین زری خانم ... من اشتباه بررسی کردم ... از اونجایی که من عموما کاربر فایرفاکس هستم ... صفحه ی شما رو با فایرفاکس تست کردم ... و مشکلی نداشت ولی توی کامنت ها ... به کامنت فاطمه خانم بر خوردم و متوجه شدم که فقط از کروم هست و این بار با کروم تست کردم کدی که شما درست کردین مشکل نداره و در حقیقت تنها مشکلی که برای شما و فاطمه خانم و دوستانی که این مشکل مشابه رو دارن ... سی اس اس قالب هاتون هست ... برای این که روی کروم این مشکل رو نداشته باشین کافیه در خط 17 سی اس اس قالبتون که به شکل زیر هست:audio {    max-width: 98%;    height: inherit;}ویژگی ارتفاع یا height رو حذف کنین و به این شکل بشه:audio {    max-width: 98%;}
۶ بهمن ۱۳۹۹
زری ...
زری ...
ممنون 😍😍درست شد :)))))))))
۶ بهمن ۱۳۹۹
(*comment_reply_fullname*)
محمدرضا ...
عالیه ... چه خوب شد که این مشکل گزارش کردین ... تا حالا بهش بر نخورده بودم ...این باگ اکثر قالبای قدیمی بیانه ... که نسبت به نسخه‌های جدید کروم ... مشکل دارن  ... مرسی ... 😊🌹
۶ بهمن ۱۳۹۹
امیر +
امیر +
من کد رو داخل منبع می‌زنم. بعد توی همون قسمتی که باید متن رو بنویسیم هم هست ، دکمه‌ی انتشار رو که می‌زنم و می‌رم صفحه وبلاگ که ببینم موسیقی هست ، می‌بینم که اصلا موسیقی‌ای نیست !مشکل از چی هست؟
۲ مهر ۱۴۰۰
(*comment_reply_fullname*)
محمدرضا ...
من کد آماده رو روی قالبت تست کردم ... قالبت مشکلی نداره ... روی ویرایشگر بیان هم تست کردم ... فرمتش نکرد و درست نشونش داد ... و مشکل از بیان هم نیست ... مشکل خاصی هست ... باید جزئیات بیشتری رو بررسی کنیم ... + راستی ببخش دیر جواب کامنت رو دادم ... وقت کمی داشتم نرسیدم ... 😊🌷🌹
۹ مهر ۱۴۰۰
jokerwolfan
jokerwolfan
خیلی کارت عالیه دمت گرمسایتا و پلتفرم های دیگه همچین ابزار مناسب و دقیقی ندارن این کارت واقعا تو وبلاگم کمکم کرد عالی❤
۱۷ فروردين ۱۴۰۱
(*comment_reply_fullname*)
محمدرضا ...
قربانت ... مرسی که یه حالی دادی بهم ... خوشحالم که به دردت خورد ... 😊😉🌹
۱۷ فروردين ۱۴۰۱
jokerwolfan
jokerwolfan
سلام عزیزمیگم میتونید یه کد قرار بدید که عکس رو تو وبلاگ نشون بشه بعد وقتی رو عکس میزنی وارد لینک مشخص شده بشهنمی خوام از خود وبلاگ استفاده کنم چون کل وبلاگ رو از اول نوشتم نمیشه از طریق پیام عکس لینک کرد و اینکه کد رو وقتی هر جای وبلاگ بذاری همونجا نمایش میده نه نثل پستا که فقط یکجای مشخص هستشاگه تونستی بذاری ممنونت میشم❤
۱۸ فروردين ۱۴۰۱
(*comment_reply_fullname*)
محمدرضا ...
این ابزار رو قبلاً ساختم ... ابزار گالری در این پست
۱۹ فروردين ۱۴۰۱
🌺آسیــ هــ💚
🌺آسیــ هــ💚
چقد زحمت میکشین واقعا . خدا خیرتون بده . 
۲ آبان ۱۴۰۲
چت درباره من تماس جعبه ابزارها آسمانی ساز گروه تلگرام موزیک‌ها 💙 برنامه وبلاگ CKEditor Quill TinyMCE Froala کانال آپارات
تازه‌ترین نظرات