افزودن صدا به تصویر در وردپرس با افزونه

افزودن صدا به تصویر در وردپرس با افزونه

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

توی این روش، صدا واقعاً داخل فایل تصویر قرار نمی‌گیره. تصویر و فایل صوتی جدا می‌مونن و افزونه فقط اون‌ها رو به هم وصل می‌کنه. اول بررسی می‌کنیم این قابلیت چه زمانی به کارتون میاد و چه راه‌های جایگزینی دارید. بعد تصویر و صدا رو آماده می‌کنیم، فایل صوتی رو به تصویر وصل می‌کنیم و نتیجه رو داخل نوشته یا برگه آزمایش می‌کنیم.

آنچه در این مقاله می‌خوانید

افزودن صدا به تصویر در وردپرس چه کاربردی داره؟

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

افزونه یک کنترل پخش کنار تصویر نشون می‌ده. کاربر روی اون کلیک می‌کنه و صدای متصل به همون عکس پخش می‌شه. تصویر و فایل صوتی همچنان دو فایل جدا توی کتابخانه رسانه وردپرس هستن؛ افزونه فقط ارتباط بین اون‌ها رو ذخیره می‌کنه.

آیا واقعاً لازمه روی عکس‌ها صدا بذاریم؟

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

برای آموزش مرحله‌به‌مرحله یا نمایش حرکت، ویدئو معمولاً انتخاب کامل‌تریه؛ چون تصویر و صدا رو هماهنگ نشون می‌ده. اگه تصویر فقط کاور آهنگ، پادکست یا مصاحبه‌ست، بلوک «صوت» وردپرس ساده‌تر و قابل‌فهم‌تره. برای توضیح کوتاه محصول هم متن کنار تصویر معمولاً سریع‌تر خونده می‌شه و بدون روشن‌کردن صدا در دسترس کاربر قرار می‌گیره.

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

معرفی افزونه Audio Story Images

Audio Story Images افزونه‌ای برای وصل‌کردن فایل صوتی به تصاویر کتابخانه رسانه وردپرسه. روش کلی کار اینه که یک فایل صوتی جدا رو به تصویر انتخابی متصل می‌کنید و افزونه کنترل پخش رو کنار اون تصویر نشون می‌ده.

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

آماده‌کردن تصویر و فایل صوتی

قبل از ورود به پیشخوان، تصویر و صداتون رو آماده کنید. برای عکس معمولی، JPEG معمولاً حجم کمتری داره. اگه تصویر به پس‌زمینه شفاف نیاز داره، PNG انتخاب مناسب‌تریه. برای صدا هم MP3 در بیشتر مواقع حجم کمتری نسبت به WAV داره و برای استفاده توی سایت راحت‌تره. یادتون نره فرمت‌های مجاز نسخه فعلی افزونه رو هم توی صفحه رسمی اون بررسی کنید.

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

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

نصب افزونه Audio Story Images در وردپرس

  1. وارد پیشخوان وردپرس بشید و از منوی «افزونه‌ها»، بخش افزودن افزونه تازه رو باز کنید.
  2. توی کادر جست‌وجو، عبارت Audio Story Images رو بنویسید.
  3. نام و سازنده افزونه رو با صفحه رسمی اون مقایسه کنید. بعد دکمه نصب رو بزنید و پس از پایان نصب، افزونه رو فعال کنید. متن دکمه‌ها ممکنه با توجه به نسخه یا زبان پیشخوان کمی فرق داشته باشه.

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

نصب افزونه Audio Story Images
نصب افزونه Audio Story Images

آموزش افزودن صدا به تصویر در وردپرس

آپلود تصویر و فایل صوتی در کتابخانه رسانه

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

افزودن رسانه جدید در وردپرس

اتصال صدا از نمای فهرستی کتابخانه رسانه

به «رسانه ← کتابخانه» برید و نمای فهرستی رو انتخاب کنید. نمای فهرستی همون حالتیه که فایل‌ها رو به شکل ردیف‌های جدا نشون می‌ده.

تنظیمات افزونه Audio Stories To Images
تنظیمات افزونه Audio Stories To Images

توی ردیف تصویر موردنظرتون، دنبال گزینه یا ستون مربوط به Audio Story بگردید. اگه گزینه Attach رو دیدید، روی اون بزنید. Attach یعنی «متصل‌کردن». بعد فایل صوتی رو از کتابخانه انتخاب کنید و دکمه تأیید یا Select رو بزنید. نام و جای این گزینه‌ها ممکنه در نسخه‌های مختلف فرق داشته باشه.

افزودن صوت به تصویر در وردپرس

اتصال صدا از صفحه ویرایش فایل رسانه‌ای

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

جداکردن یا عوض‌کردن فایل صوتی تصویر

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

قراردادن تصویر صدادار در نوشته یا برگه

  1. نوشته یا برگه موردنظرتون رو باز کنید و روی دکمه + بزنید.
  2. بلوک «تصویر» رو اضافه کنید و گزینه «کتابخانه رسانه» رو بزنید.
  3. همون تصویری رو انتخاب کنید که فایل صوتی بهش وصل شده و بعد نوشته رو منتشر یا به‌روزرسانی کنید.
افزودن رسانه به پست

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

تنظیم پخش خودکار صدا

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

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

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

حل مشکلات رایج صدا روی تصویر

آیکون پخش کنار تصویر دیده نمی‌شه

اول از بخش «افزونه‌ها» مطمئن بشید افزونه فعاله. بعد دوباره صفحه ویرایش تصویر رو باز کنید و اتصال فایل صوتی رو بررسی کنید. صفحه منتشرشده رو هم ببینید، چون ممکنه کنترل پخش داخل ویرایشگر نمایش داده نشه. در آخر، کش سایت و مرورگر رو پاک کنید. اگه مشکل حل نشد، آدرس صفحه و یک تصویر از خطا رو برای پشتیبان سایت یا هاست بفرستید.

صدا بعد از کلیک پخش نمی‌شه

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

فایل صوتی به تصویر وصل نمی‌شه

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

پخش خودکار کار نمی‌کنه

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

تصویر یا صدا باعث کندشدن صفحه می‌شه

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

نکته‌های مهم برای استفاده بهتر از تصویر صدادار

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

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

جمع‌بندی

برای افزودن صدا به تصویر در وردپرس، اول مطمئن بشید صدا واقعاً اطلاعات مفیدی به عکس اضافه می‌کنه. بعد سازگاری نسخه فعلی Audio Story Images رو بررسی کنید، تصویر و فایل صوتی رو داخل کتابخانه رسانه بذارید و صدا رو از بخش رسانه به تصویر وصل کنید. در آخر هم تصویر رو با بلوک «تصویر» داخل نوشته یا برگه قرار بدید.

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

سؤال‌های متداول درباره افزودن صدا به تصویر در وردپرس

آیا برای افزودن صدا به تصویر به کدنویسی نیاز داریم؟

نه. افزونه Audio Story Images برای اتصال فایل صوتی به تصویر ساخته شده و برای کار معمول با اون نیازی به نوشتن کد ندارید.

افزونه Audio Story Images از چه فرمت‌هایی پشتیبانی می‌کنه؟

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

آیا می‌تونیم فایل صوتی متصل به تصویر رو عوض کنیم؟

بله. از گزینه جداکردن صدا استفاده کنید و بعد فایل تازه رو به همون تصویر وصل کنید. جداکردن اتصال نباید خود فایل‌ها رو از کتابخانه رسانه حذف کنه، ولی بهتره نتیجه رو در نسخه فعلی افزونه بررسی کنید.

چرا پخش خودکار صدا در بعضی مرورگرها کار نمی‌کنه؟

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

آیا افزودن صدا به تصویر سرعت سایت رو کم می‌کنه؟

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

نظر شما در این مورد چیه؟

  1. کاربر مهمان۲۳ فروردین ۱۳۹۶

    سلام یه سوال داشتم چطور میشه یه آهنگ را به صورت مخفی در بگراند وردپرس اجرا کرد

    • رضا راد۲۴ فروردین ۱۳۹۶

      سلام باید display:none به المنت پخش کننده بدید

      • کاربر مهمان۲۶ فروردین ۱۳۹۶

        آقای حسینی شرمنده میشه بیشتر توضیح بدید 

  2. کاربر مهمان۳۰ دی ۱۳۹۵

    سلام. لینک دانلود را اصلاح کنین. اول لینک آدرس سایت خودتون خورده

پشتیبانپشتیبانپشتیبانپشتیبانپشتیبان
تیم میهن وردپرس
پشتیبانپشتیبانپشتیبانپشتیبانپشتیبان
تیم میهن وردپرسآنلاین و پاسخگوی شما هستیم.آنلاین

در حال بارگذاری...

هر سوالی دارید بپرسید.پاسخگوی شما هستیم.