Як вставити аудіо на сайт?

Звичайно, якщо у вас сайт, який працює на CMS, наприклад такий, як у мене - ви можете просто скористатися спеціальним плагіном, і підключити будь-який mp3 файл.

Однак, часто буває ситуація, коли вам необхідно підключити mp3 плеєр на сайт, який використовує лише HTML і CSS. Припустимо, ви продаєте який-небудь товар, і вирішили вбудувати на продажному сайті аудіо звернення до потенційних клієнтів.

Як вбудувати mp3 плеєр на сайт найпростіше?

Для того, що б аудіо файл почав програватися прямо на сторінках вашого браузера, необхідно підключити спеціальний флеш плеєр, і прописати невеликий код в HTML сторінці.

Це все просто, ось тільки де взяти цей "чарівний" код, та й сам флеш плеєр?

Я сам, особисто, використовую два варіанти таких плеєрів, але запевняю вас, якщо добре пошукати в інтернеті - можна знайти просто величезна кількість!

Одні плеєри працюватимуть за рахунок інтернет сервісів, на які ви завантажуєте свій аудіо файл, і натомість отримуєте код плеєра, який вам просто потрібно вставити в те місце, де ви хочете підключити ваш плеєр. Такий підхід зручний тільки з точки економії простору на хостингу. Так як будь-який онлайн сервіс може спокійно видалити ваш файл, або тимчасово перестати працювати. Для ваших відвідувачів, якщо ви робите якісний сайт - це буде не зовсім зручно.

Інший спосіб, має на увазі пряму лінію mp3 плеєра на хостинг. Втім, сам плеєр не займає великого місця, всього лише пару кілобайт. А ось аудіо файли - можуть важити по кілька мегабайт, природно, що б підключити велику кількість файлів - знадобитися хороша порція місця на хостингу.

Однак, в наш час, хостинг коштує не так вже й дорого . Тим більше, якщо ви збираєтеся розмістити один mp3 файл на вашому сайті.

Для того, що б ви змогли добре розібратися в установці, я спеціально створив просту HTML сторінку, і підключив до неї два плеєра, а вже який з них вибрати - вирішуйте самі.

попередження:

1. Імена mp3 файлів не повинні містити російських букв і пробілів. Інакше аудіо не запуститься. Повинні бути тільки латинські символи.

2. Якщо ви в опціях аудіо файлу вказали системне назва (не плутати з ім'ям файлу, ця назва відображається в самому плеєрі) російськими символами, воно буде відображатися не коректно. Приклад ви зможете переглянути в архіві. Один файл зарубіжної пісні. Він програється в першому плеєрі, а другий нашої. Зверніть увагу, як відображаються назви пісень в плеєрах.

3. У вас може вискочити помилка про безпеку. Це пов'язано з тим, що плеєр намагається взяти дані з інтернету, будучи розташованим у вас на комп'ютері. Сміливо дозволяйте дію і дивіться на результат. Якщо все перенести на хостинг, помилка з'являтися не буде.

4. Для тих, хто не знайомий з HTML, може здатися щось незрозумілим. Не хвилюйтеся. Після того як ви пройдете мою розсилку з навчання створення сайту. Ви у всьому легко розберетеся.

5. Якщо немає програми, якою ви б хотіли переглянути код, тоді вам на сторінку про редактори .

Всі технічні моменти по розміщенню mp3 плеєра на сайті я написав в коді сторінки, яка знаходиться в архіві. Качайте архів і експериментуйте, якщо ви знайдете варіант краще - буду радий побачити і розмістити в цій статті додаткову інформацію.

В папці script розміщений скрипт і самі флеш плеєри. А в папці music - самі пісні.

Всі питання сунемо в коментарі.